wake-up-neo.com

WP Rest-API: Details zum letzten Beitrag, einschließlich der empfohlenen Medien-URL, in einer Anfrage?

Ich benutze wp-rest api , um Informationen zu Beiträgen zu erhalten. Ich benutze auch wp rest api filter items , um Felder zu filtern und das Ergebnis zusammenzufassen:

Wenn ich http://example.com/wp-json/wp/v2/posts?items=id,title,featured_media aufrufe, werden folgende Ergebnisse zurückgegeben:

[

    {
        "id": 407,
        "title": {
            "rendered": "Title 1"
        },
        "featured_media": 399
    },
    {
        "id": 403,
        "title": {
            "rendered": "Title 2"
        },
        "featured_media": 401
    }

]

Die Frage ist, wie ich mit dieser ID eine URL für empfohlene Medien generieren kann. Standardmäßig gibt der Aufruf von http://example.com/wp-json/wp/v2/media/401 einen neuen json zurück, der alle Details zur URL verschiedener Größen des Quellbilds enthält:

{

    "id": 401,
    "date": "2016-06-03T17:29:09",
    "date_gmt": "2016-06-03T17:29:09",
    "guid": {
        "rendered": "http://example.com/wp-content/uploads/my-image-name.png"
    },
    "modified": "2016-06-03T17:29:09",
    "modified_gmt": "2016-06-03T17:29:09",
    "slug": "my-image-name",
    "type": "attachment",
    "link": "http://example.com/my-post-url",
    "title": {
        "rendered": "my-image-name"
    },
    "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": "my-image-name.png",
        "sizes": {
            "thumbnail": {
                "file": "my-image-name-150x150.png",
                "width": 150,
                "height": 150,
                "mime_type": "image/png",
                "source_url": "http://example.com/wp-content/uploads/my-image-name-150x150.png"
            },
            "medium": {
                "file": "my-image-name-300x136.png",
                "width": 300,
                "height": 136,
                "mime_type": "image/png",
                "source_url": "http://example.com/wp-content/uploads/my-image-name-300x136.png"
            },
            "one-paze-port-thumb": {
                "file": "my-image-name-363x250.png",
                "width": 363,
                "height": 250,
                "mime_type": "image/png",
                "source_url": "http://example.com/wp-content/uploads/my-image-name-363x250.png"
            },
            "one-paze-blog-thumb": {
                "file": "my-image-name-270x127.png",
                "width": 270,
                "height": 127,
                "mime_type": "image/png",
                "source_url": "http://example.com/wp-content/uploads/my-image-name-270x127.png"
            },
            "one-paze-team-thumb": {
                "file": "my-image-name-175x175.png",
                "width": 175,
                "height": 175,
                "mime_type": "image/png",
                "source_url": "http://example.com/wp-content/uploads/my-image-name-175x175.png"
            },
            "one-paze-testimonial-thumb": {
                "file": "my-image-name-79x79.png",
                "width": 79,
                "height": 79,
                "mime_type": "image/png",
                "source_url": "http://example.com/wp-content/uploads/my-image-name-79x79.png"
            },
            "one-paze-blog-medium-image": {
                "file": "my-image-name-380x250.png",
                "width": 380,
                "height": 250,
                "mime_type": "image/png",
                "source_url": "http://example.com/wp-content/uploads/my-image-name-380x250.png"
            },
            "full": {
                "file": "my-image-name.png",
                "width": 550,
                "height": 250,
                "mime_type": "image/png",
                "source_url": "http://example.com/wp-content/uploads/my-image-name.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/my-image-name.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"
            }
        ]
    }

}

Aber denken Sie an den Fall, wenn ich eine Liste von Posts und deren Thumbnails erhalten möchte. Einmal sollte ich http://example.com/wp-json/wp/v2/posts?items=id,title,featured_media anrufen, dann sollte ich http://example.com/wp-json/wp/v2/media/id 10 Mal für jede Medien-ID anrufen und dann die Ergebnisse analysieren und die endgültige URL des Medien-Thumbnails abrufen. Es werden also 11 Requests benötigt, um Details zu 10 Posts zu erhalten (einer für die Liste, 10 für die Thumbnails). Ist es möglich, diese Ergebnisse in einer Anfrage zu erhalten?

pluginsfiltersjsonrest-api
10
VSB

Ah, ich hatte gerade dieses Problem selbst! Und während _embed großartig ist, ist es meiner Erfahrung nach sehr langsam und der Punkt von JSON ist, schnell zu sein: D

Ich habe den folgenden Code in einem Plugin (der zum Hinzufügen benutzerdefinierter Beitragstypen verwendet wird), aber ich stelle mir vor, Sie könnten ihn in die function.php-Datei Ihres Themas einfügen.

php

add_action( 'rest_api_init', 'add_thumbnail_to_JSON' );
function add_thumbnail_to_JSON() {
//Add featured image
register_rest_field( 
    'post', // Where to add the field (Here, blog posts. Could be an array)
    'featured_image_src', // Name of new field (You can call this anything)
    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'], // Image attachment ID
    'thumbnail',  // Size.  Ex. "thumbnail", "large", "full", etc..
    true // Whether the image should be treated as an icon.
  );
  return $feat_img_array[0];
}

Jetzt sollten Sie in Ihrer JSON-Antwort ein neues Feld mit dem Namen "featured_image_src": sehen, das eine URL zur Miniaturansicht enthält.

Weitere Informationen zum Ändern von Antworten finden Sie hier:
http://v2.wp-api.org/extending/modifying/

Und hier sind weitere Informationen zu den Funktionen register_rest_field und 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/

** Hinweis: Vergessen Sie <?php ?> Tags nicht, wenn es sich um eine neue PHP-Datei handelt!

13
StephanieQ

Fügen Sie einfach das _embed-Abfrageargument zu Ihrer URL hinzu und fragen Sie nach den Beiträgen. Jedes Beitragsobjekt enthält das _embedded.[wp:featuredmedia]-Objekt, das alle Bilder enthält, genau wie die /media/$id-Ressource. Wenn Sie eine bestimmte Größe wünschen, greifen Sie einfach über den Namen der Eigenschaft darauf zu, d. H .: _embedded[wp:featuredmedia][0].media_details.sizes.full.source_url oder für die Miniaturansicht: _embedded[wp:featuredmedia][0].media_details.sizes.thumbnail.source_url

Das heißt, das in wp: featuredmedia eingebettete Objekt enthält alle URLs und Details für jede Größe, die für Ihren Beitrag verfügbar ist. Wenn Sie jedoch nur das ursprüngliche, empfohlene Bild möchten, können Sie den Wert in diesem Schlüssel verwenden: post._embedded["wp:featuredmedia"][0].source_url

Ich benutze es in einer Site mit so etwas (benutze natürlich deine eigene Domain):

$.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);
    });
});

Sehen? Es sind keine zwei Abfragen erforderlich. Fügen Sie einfach _embed als Abfrageargument hinzu, und Sie haben alle Informationen, die Sie benötigen, um die beste Größe für Ihre Ansicht zu verwenden.

6
Jesús Franco