WP REST API PARTE 2.5: Use en WordPress 4.4

Este es el artículo 3 de 3 de la serie “WP REST API”
WP REST API Parte 1: Creación de una aplicación móvil con WP-API y React Native
WP REST API Parte 2: Personalizar los puntos finales predeterminados y agregar nuevos
WP REST API PARTE 2.5: Use en WordPress 4.4
WordPress 4.4 está programado para lanzarse en las próximas dos semanas y trae consigo la primera mitad de la integración de la API REST. Esta es una noticia bastante emocionante para los temas de WordPress y los desarrolladores de arado, pero si te preguntas “¿Qué me usa la mitad de la API REST?”, Probablemente no estés solo.
Yo, Dawg. Cuando leí la propuesta de fusión en septiembre, lo primero que creí fue “Oh, genial, se unen al resto”. Esencialmente, lo que obtenemos en 4.4 es un excelente reemplazo, el resto, para el sistema Admin_ajax_ Hook, que ofrece una forma más simple y más robusta de crear puntos finales personalizados para complementos y aplicaciones. Hay mucha información sobre el resto y la fusión allí, por lo que no entraré en muchos detalles aquí. Por el contrario, en el espíritu de esta serie, me gustaría explorar el resto WordPress 4.4 API, redactando una aplicación.
Descansa lo que creamos es una aplicación muy simple que llamaré sin vergüenza “descanso” o giar cuando sea demasiado vago para escribir todo. Si enviaría a Giar a ProductThunt, lo describiría como “Tinder se encuentra con Pocket para un solo blog”. La aplicación consistirá en dos partes:
Un complemento de WordPress que creará la API para nuestra aplicación. La API proporcionará un punto final para obtener una lista de publicaciones, así como un punto final para publicar votos positivos y negativos.
Una aplicación JavaScript que mostrará a los usuarios títulos de publicaciones de blog aleatorios y les permitirá votar en contra de “descansar” o votar por “leer” y agregarla a su lista de lectura. Para mantener las cosas simples, construiremos esto como un MVP o un mínimo Producto viable.Utilizaremos el HTML básico, CSS y JavaScript/jquey para escribir la aplicación, almacenar la lista de lectura en LocalsStallage y no necesitaremos autenticación para votar.
A partir del punto final porque esto será bastante simple, comenzaré primero al montar la aplicación, para poder crear la API de puntos finales en función de cómo la aplicación la usará efectivamente. Lo primero que necesitará la aplicación es una lista de artículos que imitaré en JSON por el momento: var publica_mockup = [{id: 1, título: “Primer título de publicación”, Permalink: ‘http://example.com/ 1/’, Votes: 12, votos descendentes: 2}, {id: 22, título: “Segundo título de publicación”, Permalink:’ http://example.com/2/ ‘, Upvotes: 1, downvotes: 22}, {Id: 33, título: “Título del tercer post”, Permalink: ‘http://example.com/3/’, upvotes: 5, votos descendentes: 4}, {id: 44, título: “Cuarto título de publicación”, Permalink: ‘http://example.com/4/’, upvotes: 2, downvotes: 2}, {id: 55, título: “Quinto título de publicación”, Permalink: ‘http://example.com/5/ ‘, Votos de forma: 8, votos descendentes: 13},]; Así es como nuestra respuesta debería mostrarse eventualmente cuando solicitamos una lista de publicaciones de API. A continuación, crearé una página HTML muy simple que será nuestra aplicación. Incluiré a JQuey y App.js que harán el trabajo sucio, así como algunos estilos básicos y todos los elementos que nuestra aplicación necesitará operar en un nivel básico. Lo que se ve así en un navegador:
Luego creé una implementación de JavaScript muy simple. Este no es el mejor código que he escrito, pero este es un MVP, por lo que hace su trabajo:
Lo que funciona prácticamente todo lo que puedes jugar aquí: vea el resto del resto de jrgould (@jrgould) en el codepen. Dado que esta es una publicación sobre el resto, no me profundizaré demasiado en lo que está sucediendo en JS (no dude en preguntar en comentarios o en mi código flexible), pero aquí hay una breve presentación general: hay un $.) Solo se hace cargo de los datos burlados hasta ahora, pero también requiere una llamada inversa, porque agregaremos una llamada AJAX para obtener los datos reales del servidor. Tenemos las publicaciones en el servidor. La devolución de llamada se ocupa de los datos que se conectan a los datos que DOM que muestra una publicación aleatoria usando getRandompost () como argumento para el showPost () y luego configurando la lista de lectura que limpia el UL y busca nuestra lista de lectura existente en L en L OcalTistastage usando getLS () y su uso para completar la lista de lectura de enlaces si encuentra alguna. Si lee este código, verá dos comentarios de TODO: …, aquí tenemos que conectar la API. Lo haré creando un objeto de configuración primero con la información de conexión y los puntos finales, esto facilita la personalización o la modificación en el futuro:

Var giar_settings = {api_base: ‘http://give-it-ast.dev/wp-json/give-it-a-rest/v1/’, endpoints: {publicaciones: {ruta: ‘list-poss/’, Método: ‘Get’, Votes: {Ruta: ‘Votes/’, Método: ‘Post’}} Construiremos.A continuación, crearé una función de ayuda AJAX para usar este objeto: función doajax (endpoint, date) {return $ .AJAX ({url: giar_sets.api_base + endpoint.route, método: endpoint.method, date: date});} Esto nos permitirá enviar solo una referencia al punto final que nos gustaría usar con los datos que nos gustaría enviar y configurará una llamada básica solo sobre la base de esto.Esta función también devuelve el objeto jQuery, por lo que podemos agregar llamadas inversas cuando sea necesario.
Ahora todo lo que se necesita es cuidar a esos TODO.Primero, actualizaremos getPostsFromServer (): function getPostSFromServer (callback) {doAJAX (giar_sets.endpoints.posts, {}) .done (function) {posts = date; if (‘function’ === typeof Callback) {devolución de llamada. Llamar ();}});} A continuación, reemplazaremos a Toodo en VoterPost () para enviar efectivamente nuestro voto: Doajax (giar_sets.endpoints.vote, {votos, updown, id: post.id});Asegúrese de que hemos actualizado nuestra aplicación para usar los datos en el servidor, tendremos que crear los puntos finales que realmente respondan a ello.Tenga en cuenta que la API REST que se incluye en WordPress 4.4 no incluye ningún punto final en el cuadro, por lo que tendremos que crear la nuestra desde cero.Lo haremos creando un complemento simple que sea muy similar a lo que hemos creado en la versión anterior de esta serie.
Primero nos conectaremos al REST_PI_INIT para registrar nuestras rutas: add_action (‘REST_PI_INIT’, ‘DT_REGISTER_PI_HOKS’);Función dt_registerregister_rest_route ($ namePace, ‘/list-poss/’, array (‘métodos’ => ‘get’, ‘callback’ => giar_get_posts,));register_rest_route ($ namePace, ‘/votes/’, array (‘métodos’ => post ‘,’ callback ‘=> giar_process_vote’,));} Si miras el objeto Giar_settings que creé antes, debería verse muy similar.Comenzamos definiendo un espacio de nombre Give-IT-A-Rest/V1 y luego registramos dos rutas: una ruta/lista de listos/que responde a las solicitudes Get y otro a/votos/que responde a las solicitudes posteriores.
Ahora establezcamos esas llamadas inversas. Primero veremos el giar_get_posts: function giar_get_posts () {if (0 || false ==== ($ return = get_transient (‘dt_all_posts))) {$ query = apply_filters (‘ giar_get_posts_query ‘, array (‘ numberposts ‘=>> -1, ‘post_type’ => ‘post’, ‘post_status’ => ‘pub’,)); $ all_posts = get_posts ($ consulta); $ return = array (); Foreach ($ all_posts como $ post) {$ return [] = array (‘id’ => $ post-> id, ‘title’ => $ post-> post_title, ‘permalink’ => get_permalink ($ post-> id> ), ‘upvotes’ => intval (get_post_meta ($ post-> id, ‘giar_upvotes’), ‘votes downvotes’ => intval (get_post_meta ($ post-> id, ‘giar_downvotes’, true),); } // caché durante 10 minutos set_transient (‘giar_all_posts’, $ return, apply_filters (‘giar_posts_ttl’, 60*10)); } $ respuesta = nuevo WP_REST_RESPONDE ($ return); $ Respuesta-> Header (‘Access-Control-Allow-Oirigin’, Aplice_filters (‘giar_access_control_allow_origin’, ‘*’)); Devolver $ respuesta; } Esto es un poco largo, solo porque tenemos que transformar los datos, pero prácticamente todo lo que hacemos es tomar todas las publicaciones de la base de datos y crear una versión simplificada de esa matriz asociativa para que coincida con los datos esqueléticos que hemos creado los datos , incluidos los votos positivos y negativos que obtenemos usando get_post_meta. También almacenamos los datos en un caché de transición, de modo que no golpeemos la base de datos demasiado fuerte y proporcionamos filtros para los parámetros WP_QUEY y el “tiempo de vida” del transitorio o TTL.

Una nota final aquí es que, en lugar de devolver solo la matriz asociativa (que funcionaría), devolvemos un objeto WP_REST_RESPONDE que nos permite establecer el encabezado Origer de control de acceso (para el cual ofrecemos un filtro). ) para evitar problemas de CORS con nuestras solicitudes AJAX. Ahora solo tenemos que establecer giar_process_vote () y deberíamos estar listos para la función giar_process_vote () {$ votes = $ _post [‘votos’]; $ post_id = $ _post [‘id’]; // Validación de entrada if (! is_numeric ($ post_id) ||! } $ meta_name = ‘giar_’. $ votos. ‘votos’; $ votes_count = intval (get_post_meta ($ post_id, $ meta_name, true)); $ update_success = update_post_meta ($ post_id, $ meta_name, ++ $ votes_count)? VERDADERO FALSO; // borrar publicaciones transitorias caché delete_transient (‘giar_all_posts’); $ respuesta = nuevo WP_REST_RESPONSE ($ update_success); $ Respuesta-> Header (‘Access-Control-Allow-Oirigin’, Aplice_filters (‘giar_access_control_allow_origin’, ‘*’)); Devolver $ respuesta; } Dado que se ocupa de las solicitudes de publicación, solo podemos usar $ _post para acceder a los datos esperados y aumentar los metadatos giar_upvotes o giar_downvotes de la publicación. También ofrecemos una respuesta booleana aquí, pero de hecho no la verificamos en la aplicación. ¡Ahora deberíamos estar listos para ir! Aquí está nuestro código de complemento completo: y nuestro código APP.JS completado:
Si esto parece similar al artículo anterior de esta serie, ¡lo es! Lo bueno aquí es que estamos hablando de algo que se incorpora en WordPress 4.4 y más tarde, lo que significa que puede descargar e instalar el complemento de WordPress anterior en cualquier sitio web existente que ejecute 4.4 o una versión posterior, descargue el archivo HTML y la aplicación. JS, y actualice la URL giar_setts.ap_base para que coincida con la de su sitio y esté listo. Esta es una solución estúpida y simple, pero sugiere algo mucho más grande: incluso con solo la mitad de la API desarrollada por WordPress, WordPress ha recibido algunas herramientas realmente robustas en WordPress. Este es el artículo 3 de 3 de la serie “WP REST API” WP REST API Parte 1: Creación de una aplicación móvil con WP-API y React Native
WP REST API Parte 2: Personalizar los puntos finales predeterminados y agregar nuevos
WP REST API PARTE 2.5: Use en WordPress 4.4