WP Rest API: detalii despre ultimul articol, inclusiv URL-ul media reprezentativ într-o singură cerere?
Folosesc wp-rest api pentru a obține informații despre articole. De asemenea, folosesc filtrarea elementelor din wp rest api pentru a filtra câmpurile și a simplifica rezultatul:
Când apelez http://example.com/wp-json/wp/v2/posts?items=id,title,featured_media
returnează rezultate ca acestea:
[
{
"id": 407,
"title": {
"rendered": "Titlu 1"
},
"featured_media": 399
},
{
"id": 403,
"title": {
"rendered": "Titlu 2"
},
"featured_media": 401
}
]
Întrebarea este cum pot genera URL-ul media reprezentativ folosind acest id? În mod implicit, apelarea http://example.com/wp-json/wp/v2/media/401
returnează un nou json care conține toate detaliile despre URL-urile diferitelor dimensiuni ale imaginii sursă:
{
"id": 401,
"date": "2016-06-03T17:29:09",
"date_gmt": "2016-06-03T17:29:09",
"guid": {
"rendered": "http://example.com/wp-content/uploads/nume-imagine.png"
},
"modified": "2016-06-03T17:29:09",
"modified_gmt": "2016-06-03T17:29:09",
"slug": "nume-imagine",
"type": "attachment",
"link": "http://example.com/url-articol",
"title": {
"rendered": "nume-imagine"
},
"author": 1,
"comment_status": "open",
"ping_status": "closed",
"alt_text": "",
"caption": "",
"description": "",
"media_type": "image",
"mime_type": "image/png",
"media_details": {
"width": 550,
"height": 250,
"file": "nume-imagine.png",
"sizes": {
"thumbnail": {
"file": "nume-imagine-150x150.png",
"width": 150,
"height": 150,
"mime_type": "image/png",
"source_url": "http://example.com/wp-content/uploads/nume-imagine-150x150.png"
},
"medium": {
"file": "nume-imagine-300x136.png",
"width": 300,
"height": 136,
"mime_type": "image/png",
"source_url": "http://example.com/wp-content/uploads/nume-imagine-300x136.png"
},
"one-paze-port-thumb": {
"file": "nume-imagine-363x250.png",
"width": 363,
"height": 250,
"mime_type": "image/png",
"source_url": "http://example.com/wp-content/uploads/nume-imagine-363x250.png"
},
"one-paze-blog-thumb": {
"file": "nume-imagine-270x127.png",
"width": 270,
"height": 127,
"mime_type": "image/png",
"source_url": "http://example.com/wp-content/uploads/nume-imagine-270x127.png"
},
"one-paze-team-thumb": {
"file": "nume-imagine-175x175.png",
"width": 175,
"height": 175,
"mime_type": "image/png",
"source_url": "http://example.com/wp-content/uploads/nume-imagine-175x175.png"
},
"one-paze-testimonial-thumb": {
"file": "nume-imagine-79x79.png",
"width": 79,
"height": 79,
"mime_type": "image/png",
"source_url": "http://example.com/wp-content/uploads/nume-imagine-79x79.png"
},
"one-paze-blog-medium-image": {
"file": "nume-imagine-380x250.png",
"width": 380,
"height": 250,
"mime_type": "image/png",
"source_url": "http://example.com/wp-content/uploads/nume-imagine-380x250.png"
},
"full": {
"file": "nume-imagine.png",
"width": 550,
"height": 250,
"mime_type": "image/png",
"source_url": "http://example.com/wp-content/uploads/nume-imagine.png"
}
},
"image_meta": {
"aperture": "0",
"credit": "",
"camera": "",
"caption": "",
"created_timestamp": "0",
"copyright": "",
"focal_length": "0",
"iso": "0",
"shutter_speed": "0",
"title": "",
"orientation": "0",
"keywords": [ ]
}
},
"post": 284,
"source_url": "http://example.com/wp-content/uploads/nume-imagine.png",
"_links": {
"self": [
{
"href": "http://example.com/wp-json/wp/v2/media/401"
}
],
"collection": [
{
"href": "http://example.com/wp-json/wp/v2/media"
}
],
"about": [
{
"href": "http://example.com/wp-json/wp/v2/types/attachment"
}
],
"author": [
{
"embeddable": true,
"href": "http://example.com/wp-json/wp/v2/users/1"
}
],
"replies": [
{
"embeddable": true,
"href": "http://example.com/wp-json/wp/v2/comments?post=401"
}
]
}
}
Dar să luăm în considerare cazul în care vreau să obțin lista articolelor și miniaturile lor. Mai întâi trebuie să apelez http://example.com/wp-json/wp/v2/posts?items=id,title,featured_media
apoi trebuie să apelez http://example.com/wp-json/wp/v2/media/id
de 10 ori pentru fiecare id media și apoi să analizez rezultatele și să obțin URL-ul final al miniaturii media. Deci necesită 11 cereri pentru a obține detaliile a 10 articole (una pentru listă, 10 pentru miniaturi).
Este posibil să obțin aceste rezultate într-o singură cerere?
Ah, tocmai am avut și eu această problemă! Și deși _embed
este grozav, în experiența mea este foarte lent, iar scopul JSON-ului este să fie rapid :D
Am următorul cod într-un plugin (folosit pentru a adăuga tipuri personalizate de postări), dar presupun că l-ați putea pune în fișierul function.php
al temei.
php
add_action( 'rest_api_init', 'add_thumbnail_to_JSON' );
function add_thumbnail_to_JSON() {
//Adaugă imaginea reprezentativă
register_rest_field(
'post', // Unde se adaugă câmpul (Aici, postări de blog. Poate fi un array)
'featured_image_src', // Numele noului câmp (Puteți numi acest câmp oricum)
array(
'get_callback' => 'get_image_src',
'update_callback' => null,
'schema' => null,
)
);
}
function get_image_src( $object, $field_name, $request ) {
$feat_img_array = wp_get_attachment_image_src(
$object['featured_media'], // ID-ul atașamentului imaginii
'thumbnail', // Dimensiune. Ex. "thumbnail", "large", "full", etc..
true // Dacă imaginea ar trebui tratată ca o pictogramă.
);
return $feat_img_array[0];
}
Acum, în răspunsul JSON ar trebui să vedeți un nou câmp numit "featured_image_src":
care conține un URL către imaginea în miniatură.
Citiți mai multe despre modificarea răspunsurilor aici:
http://v2.wp-api.org/extending/modifying/
Și aici sunt mai multe informații despre funcțiile register_rest_field
și wp_get_attachment_image_src()
:
1.) https://developer.wordpress.org/reference/functions/register_rest_field/
2.) https://developer.wordpress.org/reference/functions/wp_get_attachment_image_src/
**Notă: Nu uitați de tag-urile <?php ?>
dacă acesta este un nou fișier php!

Această soluție funcționează excelent și ajută la faptul că nu este nevoie să folosesc _embed, deoarece vreau doar imaginea featured la dimensiunea completă. A trebuit să o modific în: ($object['featured_media'], 'fullsize', false);
pentru a nu obține URL-ul thumbnail-ului, dar funcționează perfect prin fișierul functions.php -- Mulțumesc!

Toată această jonglerie cu punctul final al API-ului REST îmi amintește de ce îmi place GraphQL și că ar trebui să finalizez wrapper-ele pentru REST API și noii rezolvers personalizați ;-) Oricum, este o soluție inteligentă și, de fapt, folosesc puncte finale personalizate în producție pentru a obține doar datele de care am nevoie.

Noul plugin are http://mahditajik.ir/wp-json/wp/v2/media/<id>
dar conține multe date suplimentare care încetinesc răspunsul, așadar cum pot personaliza răspunsul API-ului REST?

Mulțumesc mult, m-a ajutat să finalizez funcționalitatea de conținut recomandat! :D

Doar adaugă argumentul de interogare _embed
în URL-ul tău pentru a cere postările, iar fiecare obiect post va include obiectul _embedded.[wp:featuredmedia]
, care conține toate imaginile, exact ca resursa /media/$id
. Dacă dorești o dimensiune specifică, acceseaz-o prin numele proprietății, de exemplu: _embedded[wp:featuredmedia][0].media_details.sizes.full.source_url
sau pentru thumbnail: _embedded[wp:featuredmedia][0].media_details.sizes.thumbnail.source_url
Adică, obiectul încorporat wp:featuredmedia include toate URL-urile și detaliile pentru fiecare dimensiune disponibilă pentru postarea ta, dar dacă vrei doar imaginea reprezentativă originală, poți folosi valoarea din această cheie: post._embedded["wp:featuredmedia"][0].source_url
Eu o folosesc pe un site cu ceva de genul acesta (folosește, desigur, propriul tău domeniu):
$.get('https://example.com/wp-json/wp/v2/posts/?categories=3&_embed',
function(posts) {
var elems = '';
posts.forEach(function(post){
var link = post.link;
var title = post.title.rendered;
var pic = post._embedded["wp:featuredmedia"][0].source_url);
elems += '<div class="this_week"><a href="' + link + '" target="_blank">';
elems += '<img src="' + pic + '" title="' + title + '"/><span class="title">';
elems += title + '</span></a></div>';
});
$('#blockbusters').html(elems);
});
});
Vezi? Nu este nevoie de două interogări, doar adaugă _embed
ca argument de interogare, și apoi ai toate informațiile necesare pentru a folosi cea mai bună dimensiune pentru vizualizarea ta.
