WP REST API Parte 2: Personalizar los puntos finales predeterminados y agregar nuevos


Este es el artículo 2 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
En la primera parte de esta serie, creamos una aplicación nativa React muy simple, utilizando WordPress y WP JSON API. En este artículo, reanudaré dónde permaneció la aplicación y agregaré algunas personalizaciones a la API que activará varias funciones en la aplicación. Si va a seguir este artículo, asegúrese de estar atrapado con la primera entrega porque comenzaremos.
Para limpiar inicialmente, agregué un filtro al archivo functions.php del tema activo para agregar un nodo de texto sin formato al campo de contenido: add_filter (‘REST_PREPARE_POST’, ‘DT_USE_POST_CONTENT’, 10, 3); Function dt_use_raw_post_content ($ date, $ post, $ request) {$ data-> date [‘content’] [‘asignext’] = $ post-> post_content; devolver $ fecha; } Desde que se publicó ese artículo, me han informado que esta no es una excelente manera de hacer las cosas y la documentación V2 comparte este sentimiento: […] Es importante tener en cuenta que la API se refiere a la exposición de una interfaz a todos clientes, no solo la característica para la que trabaja. Cambiar las respuestas es peligroso. Agregar campos no es peligroso, por lo que si necesita cambiar los datos, es mucho mejor duplicar el campo con los datos modificados.
Entonces, lo primero que haré es eliminar esas líneas de funciones.php. Debido a que React Native no parece tener una buena manera de tratar las entidades HTML y HTML, aún tendremos que exponer una versión de texto simple de nuestra publicación, pero agregaremos algunos código más específico a nuestra aplicación profunda un poco más tarde, Entonces también podríamos poner todo nuestro código en un complemento. Cree una carpeta en el directorio de complementos de su sitio llamado profundo pensamiento-plugin y luego cree un archivo php en el interior que se llame profundo-penshts-plugin.php con la siguiente caldera: =rand&randr & filteró_page], que devolverá una matriz que contiene una sola publicación aleatoria . Funciona bien, pero, como mencioné en el artículo anterior, no es muy eficiente. En general, las consultas de WordPress usando Orderby = rand son bastante lentas y, además, no podemos almacenar las solicitudes a esta URL en caché, porque tienen que devolver algo diferente cada vez. La solución ideal es agregar un punto final de API personalizado que devuelva una lista de todas las ID de publicación en nuestra aplicación React Native, luego podemos seleccionar una ID de publicación aleatoria y enviar una solicitud directa para esa publicación cada vez que deseemos mostrar un nueva publicación aleatoria en la aplicación. Primero utilizaremos la función Registro_Rest_Route para registrar una nueva ruta en WP-JSON/Deep-Thughts/V1/Get-All-Post-ID. Agregaremos esto a la función dt_register_pi_hooks que creamos anteriormente:

// Agregar pensamientos profundos/v1/get-todo-eide registro_rest_route (‘profundo-thughts/v1’, ‘/get-all-pos-ide/’, array (‘métodos’ => ‘get’, ‘,’ callback ‘=>’ dt_get_all_post_ids ‘,); Ahora podemos agregar la función de llamada inversa dt_get_all_post_ids al campo principal del complemento, que devolverá una serie de publicaciones. Almacenaremos los resultados de esta consulta en una transición que expira cada 2 horas para que WordPress no tenga que interrogar toda la tabla WP_Posts cada vez que alguien solicita estos datos:
// Devuelve todas las ID de publicación de la función dt_get_all_post_ids () {if (false == ($ all_post_ids = get_transient (‘dt_all_post_ids’))) {$ all_post_ids = get_posts (‘numberPosts’ => -1, ‘post_type’ => ‘post’ ‘ , ‘Campos’ => ‘ids’,)); // caché durante 2 horas set_ransient (‘dt_all_post_ids’, $ all_post_ids, 60*60*2); } return $ all_post_ids; } Puede probar si esto funciona visitando el nuevo punto final, http: // profundo- a través de los que Debe obtener una respuesta que se vea así: [150, 148, 147, 146, 145, 144, 143, 142, 141, 140, 139, 138, 137, 136, 135, 134, 133, 132, 131, 130 , 129, 128, 127, 126, 125, 124, 123, 122, 121, 120, 119, 118, 117, 116, 115, 114, 113, 112, 111, 110, 109, 108, 107, 106, 105 , 104, 103, 102, 101, 100, 99, 98] Ahora solo tenemos que actualizar la aplicación Native React para usar este nuevo punto final y hacer solicitudes que se pueden almacenar en caché. Primero reemplazaremos la variable request_url con request_ur_base y agregaremos dos variables más para los diferentes puntos finales a los que accederemos: var request_url_base = ‘http://deep-thoughts.dev/wp-json/’; Var posts_url_patch = ‘wp/v2/publica/’; Var get_post_ids_path = ‘Deep-thughts/v1/get-all-pos-id’; Luego tendremos que agregar dos nuevas propiedades a los estados iniciales de la aplicación: ThoughtIds y CurringId:
GetInitialState: function () {return {// El pensamiento se establece inicialmente en NULL para que el mensaje de alojamiento muestre pensamiento: nulo, thinkIds: null, currentId: null}; } A continuación, agregaremos métodos para completar esas propiedades: getAllids: function () {fetch (request_url_base + get_post_ids_path) .sen ((respuesta) => respuestas. This.setsate () hará que la nueva fecha se aplique a la UI Eso es creado por la función `render` debajo de esto. }, getRandid: function () {varurrentid = this.steate.theughtids [math.floor (math.random ()*this.steate.theughtids.length); If (this.steate.currentId == currentId) {currentId = this.gerandId (); } Else {this.setsate ({tentinID: currentId}); } Return tenturid; } Notarás que lo último que hace GetAllids () después de hacerse cargo de la lista de ID y agregado a los Estados Unidos es que llama a esto. Ya disponible en los Estados Unidos antes de que puedan correr. Tendremos que reemplazar el fetchData () con el método getAllids () en el método ComponentDidMount () para garantizar que el getAllids () se ejecute primero: // llamado automáticamente por React cuando este componente ha terminado de montaje. componentDidmount: function () {this.getAllids (); } Y luego tendremos que actualizar el fetchData () para ejecutar getRandid () y luego usar la ID aleatoria para tomar esa publicación: fetchData: function () {var tententId = this.getRandid (); This.setsate ({// También estableceremos el pensamiento en nulo al cargar nuevos pensamientos para que el mensaje de carga muestre pensamiento: nulo,});

fetch (request_url_base + posts_url_patch + currentId) .sen ((respuesta) => respuesta.json ()) .sen ((respuesta) => {// this.setsate () se aplicará la nueva fecha a la interfaz de usuario. por la función `render` debajo de esto.setsate ({pensamiento: {title: respuesta.title.rended, content: respuesta.Plaintext});}) .done (); } No ha cambiado mucho en fetchData (), agregamos la llamada a getRandid () al principio y luego usamos su resultado con request_url_base y posts_url_patch para acceder a un determinado post a través de la API con una URL que se almacena con fácil en caché a través de un Sistema de almacenamiento de caché en el lado del servidor, como WP Super Cache o Varnish. Aquí hay un archivo esencial de todo el archivo index.ios.js hasta ahora: y, mientras estamos en esto, aquí está nuestro complemento de WordPress profundo hasta ahora:
Los puntos finales son solo el comienzo como puede ver, WP-API hace que Agregar campos personalizados y puntos finales sea una tarea relativamente trivial. Los puntos API personalizados finales a menudo tienen mucho más sentido que el uso de Admin-AJAX y son un poco más fáciles de administrar, en mi opinión. Actualmente, nuestra aplicación no es mucho más de lo que era cuando comenzaste a leer este artículo, pero ahora hay mucho potencial que hemos desbloqueado el poder de las rutas personalizadas. Si WP-API hace que sea tan fácil exponer nuevos datos, entonces probablemente sea tan fácil exponer nuevas formas de interactuar con nuestros datos. ¡Esta es una perspectiva interesante y es exactamente lo que exploraremos la próxima vez! Este es el artículo 2 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: Personalización de los puntos finales predeterminados y agregando los nuevos REST API Parte 2.5: Su uso en WordPress 4.4

Copyright statement: Unless otherwise noted, this article is Collected from the Internet, please keep the source of the article when reprinting.

Check Also

gkOVSBm5B8SgiXmo

Shopify vs WooCommerce – ¿Cuál es la mejor plataforma?(Comparación)

Shopify vs WooCommerce

Leave a Reply

Your email address will not be published. Required fields are marked *