Share
Nella parte precedente della serie, abbiamo esaminato come utilizzare l'API WP REST per recuperare il contenuto dal server. Abbiamo imparato a recuperare contenuti per risorse diverse tra cui post, post meta, tag, categorie, ecc. Questa è una funzionalità potente dal momento che questo contenuto può essere utilizzato ovunque all'interno o all'esterno di WordPress.
Abbiamo anche imparato a conoscere il OPZIONI richiedere di auto-documentare l'API elencando tutti i percorsi, i relativi endpoint e i rispettivi argomenti. Ciò riduce la necessità di fare affidamento su una documentazione esterna per l'API e consente di rilevare le modifiche piuttosto rapidamente nel caso in cui l'API sia stata aggiornata o modificata.
Avendo esaminato queste funzionalità, nel tutorial corrente concentreremo la nostra attenzione sulle altre tre operazioni di CRUD, ovvero creando, aggiornando ed eliminando i dati utilizzando l'API WP REST.
In questo tutorial, dovremo:
Iniziamo quindi analizzando quali risorse supportano i metodi di creazione, aggiornamento ed eliminazione utilizzando l'API REST di WP.
Prima di procedere direttamente alla creazione e all'aggiornamento dei dati con l'API WP REST, è necessario analizzare quali percorsi supportano la creazione e l'aggiornamento dei metodi. Lo facciamo controllando i percorsi e il metodi proprietà nei loro endpoint. Questo può essere fatto inviando un separato OPZIONI richiesta ai singoli percorsi, ma un modo più conveniente è quello di inviare un OTTENERE richiesta al / Wp-JSON indice come abbiamo fatto nella parte precedente della serie.
Invio a OTTENERE richiesta al / Wp-JSON route restituisce un oggetto che contiene tutti i percorsi e i loro endpoint in itinerari proprietà.
È in questi percorsi individuali che possiamo verificare se una risorsa specifica supporta INVIARE, METTERE, e ELIMINA metodi. Iniziamo analizzando il Messaggi risorsa.
Il Messaggi risorsa espone i dati con le seguenti due rotte:
/ wp / v2 / posts / wp / v2 / posts / (? P[\ D] +)
La prima rotta punta alla collezione dell'oggetto post, e la sua metodo la proprietà è la seguente:
"metodi": ["OTTIENI", "POST"],
Questo metodi proprietà mostra che il / messaggi percorso supporta OTTENERE e INVIARE metodi per recuperare e creare dati rispettivamente.
Per il / messaggi / (? P percorso, che punta a un singolo Messaggi risorsa, il metodi la proprietà è la seguente:
"metodi": ["GET", "POST", "PUT", "PATCH", "DELETE"],
Come si può vedere nel codice sopra, il / messaggi / (? P percorso supporta il OTTENERE, INVIARE, METTERE, PATCH, e ELIMINA metodi.
Esaminando entrambe le rotte sopra, possiamo concludere che il / messaggi il percorso supporta il recupero e la creazione delle risorse. E il / messaggi / (? P percorso supporta il recupero delle risorse, nonché l'aggiornamento e la cancellazione. Anche se supporta il INVIARE metodo, questo percorso non supporta la creazione di risorse come vedremo in un esempio di seguito.
Pertanto, i percorsi che puntano a una singola risorsa non possono essere utilizzati per creare contenuti, sebbene supportino il INVIARE metodo. Questo perché, per questi percorsi, il INVIARE, METTERE, e PATCH i metodi vengono utilizzati per aggiornare il contenuto nell'API REST di WP.
Per concludere questa sezione, riassumiamo i concetti che abbiamo appreso qui:
Accentsconagua
OTTENERE, INVIARE, e ELIMINA metodi inviando un OPZIONI richiesta.INVIARE metodo.Dopo aver analizzato diversi percorsi, siamo ora pronti a creare contenuti utilizzando l'API WP REST e inizieremo esplorando il Messaggi risorsa.
Creiamo un post inviando una richiesta di test da Postman o qualsiasi altro client HTTP. Per fare ciò, avviare il client HTTP e inviare a INVIARE richiesta al / messaggi itinerario. Ma prima di questo, ricorda che la creazione, l'eliminazione e l'aggiornamento delle risorse richiedono l'autenticazione come utente con edit_posts diritti. Quindi useremo il metodo di autenticazione di base che abbiamo imparato nella seconda parte di questa serie.
Inizialmente, inviamo un corpo di richiesta vuoto lungo la richiesta a scopo di test:
$ POST / wp / v2 / posts
Il server restituirà a 400 - Richiesta non valida errore poiché mancavano gli argomenti richiesti nel corpo della richiesta. La seguente risposta verrà restituita dal server:
La risposta afferma che entrambi soddisfare, titolo, o estratto sono necessari per creare un oggetto post. Questi argomenti possono essere inviati lungo la richiesta nel corpo della richiesta in uno dei seguenti tre modi:
È solo una questione di scelta utilizzare uno di questi metodi e li esamineremo più da vicino in questo tutorial. Ma ora usiamo il primo metodo per creare un post.
Per inviare argomenti come oggetto JSON in Postman, passare a Corpo scheda e selezionare il crudo pulsante di scelta. Quindi dal menu a discesa a destra, selezionare il JSON (application / json) opzione. Nell'area di testo sottostante, puoi quindi aggiungere il corpo JSON.
Attualmente, questo corpo JSON contiene solo una proprietà per il titolo del post.
Invia la richiesta facendo clic sul Inviare pulsante. Se tutto va bene, il server restituirà a 201 - Creato stato con l'oggetto post appena creato come risposta.
Lo stato predefinito di questo post appena creato è bozza. Possiamo aggiornare il stato, così come alcune altre proprietà, inviandone un'altra INVIARE, METTERE, o PATCH richiesta. L'ID del post restituito nel mio caso è 232, quindi invierò una richiesta al seguente endpoint:
$ POST / wp / v2 / posts / 232
Il corpo della richiesta per aggiornare il stato e il soddisfare la proprietà si presenta così:
"status": "pubblica", "contenuto": "Questo è il contenuto del post"
Dopo aver inviato la richiesta, il server restituirà a 200 - OK stato, il che significa che il post è stato aggiornato correttamente.
Nell'esempio sopra, abbiamo trovato i seguenti tre argomenti per creare un post:
titolostatosoddisfareL'elenco completo degli argomenti supportati per la creazione di un post può essere recuperato da un semplice OPZIONI richiesta come segue:
$ OPZIONI / wp / v2 / post
Possiamo quindi controllare il args proprietà nel INVIARE array di metodi.
Ora che abbiamo imparato come possiamo creare e aggiornare un post, diamo un'occhiata ad altre risorse con cui possiamo lavorare.
Aggiornamento: l'utilizzo di meta post e pagina nell'API REST di WP richiede ora un plug-in companion disponibile su GitHub dal team dell'API REST di WP.
Il post meta può essere creato inviando un INVIARE richiesta per il seguente percorso:
/ WP / V2 / messaggi / (? P[\ D] +) / meta
Dove (? P è l'ID del post principale. Userò l'ID del post che abbiamo creato nella sezione precedente, ovvero 232.
In modo simile a come inviamo un corpo di richiesta per creare un oggetto post, è possibile inviare un oggetto JSON composto da due proprietà per creare un post meta. Queste due proprietà sono chiave e valore.
"chiave": "nome", "valore": "Bilal"
I valori di chiave e valore proprietà sono nome e Bilal rispettivamente.
Invia la richiesta e il server restituirà a 201 - Creato codice di stato, che mostra che il post meta è stato creato con successo. Anche il post meta oggetto appena creato verrà restituito nella risposta:
Si noti che al momento della stesura di questo tutorial, l'API WP REST non supporta i valori interi per la creazione di post meta. Se proviamo a inviare un valore intero nell'oggetto JSON per creare post meta, a 400 - Richiesta non valida il codice di stato verrà restituito dal server.
"chiave": "valore", "valore": 12345
Nota le virgolette mancanti attorno al valore 12345. La risposta restituita sarà simile alla seguente:
Quindi qualsiasi cosa tu invii lungo la richiesta per creare post meta dovrebbe essere in formato stringa.
Finora in questo tutorial, abbiamo utilizzato il formato JSON nel corpo della richiesta per creare e aggiornare le risorse. Diamo un'occhiata a tutte le opzioni che l'API WP REST fornisce per la creazione e l'aggiornamento dei dati.
Il modo più semplice per inviare dati lungo la richiesta è inviarlo come parametri URL. Considera quanto segue INVIARE richiesta per la creazione di un post:
$ POST / wp / v2 / posts? Title = il + titolo e contenuto = questo + è + il + contenuto
La richiesta precedente invia due parametri al server per titolo e il soddisfare del post.
Allo stesso modo, per creare post meta per un post che ha un ID di 232, usiamo il seguente INVIARE richiesta:
$ POST / wp / v2 / posts / 232 / meta? Key = nome e valore = Bilal
La richiesta di cui sopra creerà il seguente meta oggetto:
Questo metodo è più adatto quando i parametri sono stringhe brevi, come nell'esempio sopra. Ma con l'aumentare del numero di parametri e della lunghezza dei loro valori, diventa difficile gestirli come parametri URL.
Usando questo metodo, prendiamo argomenti come coppia chiave / valore in un oggetto JSON per passarli lungo la richiesta. Fino ad ora, abbiamo utilizzato Postman per inviare richieste al server. Daremo ora un'occhiata a come possiamo implementare questo metodo usando HTML e jQuery.
Si consideri il seguente modulo semplice composto da tre campi per titolo, stato, e il soddisfare:
Quando viene inviato il modulo sopra, viene eseguito il seguente codice JavaScript (jQuery):
var postForm = $ ('# post-form'); var jsonData = function (form) var arrData = form.serializeArray (), objData = ; $ .each (arrData, function (index, elem) objData [elem.name] = elem.value;); restituisce JSON.stringify (objData); ; postForm.on ('submit', function (e) e.preventDefault (); $ .ajax (url: 'http: // tuo-dev-server / wp-json / wp / v2 / posts', metodo: 'POST', dati: jsonData (postForm), crossDomain: true, contentType: 'application / json', beforeSend: function (xhr) xhr.setRequestHeader ('Authorization', 'Base username: password');, successo: function (data) console.log (data);, errore: function (errore) console.log (errore);););Su invio del modulo sopra, inviamo una richiesta AJAX al / WP / V2 / messaggi itinerario. Il jsonData () metodo accetta un'istanza jQuery del modulo HTML e converte i suoi dati in formato JSON. Questi dati JSON vengono quindi utilizzati in dati proprietà del $ .Ajax () metodo. Inoltre, impostiamo il tipo di contenuto su application / json usando il tipo di contenuto proprietà.
Prima di inviare la richiesta, impostiamo l'intestazione per includere il Autorizzazione intestazione per l'utilizzo del metodo di autenticazione di base. Abbiamo già imparato a configurare e utilizzare il metodo di autenticazione di base nella seconda parte di questa serie.
Infine, la richiesta viene inviata al / WP / V2 / messaggi percorso e viene creato un nuovo post. Questo oggetto post appena creato viene restituito dal server come risposta e lo registriamo semplicemente nella console all'interno di successo() metodo.
L'esempio sopra dimostra l'uso del formato JSON per inviare dati lungo la richiesta. L'origine di questo oggetto JSON può essere qualsiasi cosa oltre a un modulo HTML, a seconda dell'architettura dell'applicazione.
Si noti che per il corretto funzionamento del codice sopra descritto, potrebbe essere necessario impostare il codice Access-Control-Allow-intestazioni campo di intestazione per includere il Autorizzazione e Tipo di contenuto valori. Questo può essere fatto aggiungendo il seguente codice nel tuo WordPress .htaccess file:
Set di intestazione Access-Control-Allow-Headers "Content-Type, Authorization"
Diamo ora un'occhiata all'invio di dati tramite moduli HTML.
L'ultimo modo di inviare dati lungo la richiesta è utilizzando i moduli HTML. Queste forme dovrebbero contenere campi con il nome attributo. Il nome l'attributo serve come un nome di argomento come titolo, stato, soddisfare, ecc. I valori di questi campi servono come valore di questi argomenti.
Possiamo utilizzare lo stesso modulo HTML creato nell'esempio precedente e quindi utilizzare il seguente codice per creare un nuovo post:
var postForm = $ ('# post-form'); postForm.on ('submit', function (e) e.preventDefault (); $ .ajax (url: 'http: // tuo-dev-server / wp-json / wp / v2 / posts', metodo: 'POST', dati: postForm.serialize (), crossDomain: true, beforeSend: function (xhr) xhr.setRequestHeader ('Authorization', 'Base username: password');, success: function (data) console. log (dati);););Il codice sopra è lo stesso dell'esempio precedente, tranne che abbiamo rimosso il jsonData () metodo e ora stiamo inviando i dati del modulo in formato stringa usando jQuery serialize () metodo. Il codice jQuery sopra riportato utilizza il valore predefinito application / x-www-form-urlencoded tipo di contenuto che invia i dati sotto forma di una stringa gigante con argomenti separati da & segno e i loro valori assegnati utilizzando il = cartello. Questo assomiglia in qualche modo all'invio di dati come parametri URL, tranne per il fatto che non espone i dati. Questo è un modo efficace per inviare dati se i dati contengono solo caratteri alfanumerici.
Per inviare dati binari (non alfanumerici), usiamo il / Form-data multipart tipo di contenuto. Questo metodo può essere utilizzato se è necessario caricare immagini o altri file utilizzando l'API WP REST.
Per inviare i dati del modulo in Postman, è possibile passare a Corpo scheda e quindi utilizzare il form-data o x-www-form-urlencoded opzione.
Gli argomenti possono quindi essere definiti in coppie chiave / valore da inviare lungo la richiesta.
Informazioni dettagliate relative a diversi tipi di moduli sono disponibili nelle specifiche W3C.
/ Form-data multipart Tipo di contenutoOra che abbiamo guardato il x-www-form-urlencoded tipo di modulo, che invia i dati sotto forma di stringa, iniziamo a esplorare un tipo di codifica di modulo più avanzato, ad es. / Form-data multipart.
Il / Form-data multipart il tipo di contenuto viene utilizzato quando si ha a che fare con dati binari e quindi può essere utilizzato per caricare immagini o altri tipi di file sul server.
Nell'esempio seguente, usiamo un semplice modulo HTML composto da un input [type =”file”] e un po 'di jQuery per caricare immagini sul server usando il / Wp / v2 / media itinerario.
Considera il seguente modulo HTML:
Il seguente codice JavaScript verrà eseguito quando viene inviato il modulo sopra riportato:
var imageForm = $ ('# image-form'), fileInput = $ ('# file'), formData = new FormData (); imageForm.on ('submit', function (e) e.preventDefault (); formData.append ('file', fileInput [0] .file [0]); $ .ajax (url: 'http: // your-dev-server / wp-json / wp / v2 / media ', metodo:' POST ', data: formData, crossDomain: true, contentType: false, processData: false, beforeSend: function (xhr) xhr.setRequestHeader ( 'Autorizzazione', 'Nome utente di base: password');, successo: funzione (dati) console.log (dati);, errore: funzione (errore) console.log (errore););) ;Qui per prima cosa otteniamo un'istanza jQuery del modulo e il suo campo di input. Quindi inizializziamo un nuovo formdata oggetto. Il formdata l'interfaccia fornisce un modo per costruire un insieme di campi modulo con coppie chiave / valore e utilizza lo stesso formato di / Form-data multipart modulo di codifica.
Quando il modulo viene inviato, ne impediamo l'invio chiamando il .preventDefault () metodo sull'oggetto evento. Quindi aggiungiamo un nuovo campo al formdata istanza usando il .aggiungere() metodo. Il .aggiungere() metodo accetta due argomenti per il nome e il valore del campo. L'API WP REST impone il nome attributo del campo di input del file da essere file. Ecco perché abbiamo impostato il primo argomento: il nome-essere file, e per il secondo argomento passiamo un oggetto blob di file facendo riferimento all'elemento input.
Per impostazione predefinita, i dati passati al dati proprietà del jQuery.ajax () il metodo viene elaborato in una stringa di query. Dato che stiamo caricando file immagine qui, non vogliamo che ciò accada, e a tale scopo impostiamo il file dati di processo proprietà a falso. Abbiamo anche impostato il tipo di contenuto proprietà a falso impedire application / x-www-form-urlencoded inviato come tipo di contenuto predefinito al server.
E infine, abbiamo impostato il Autorizzazione intestazione per autenticarci come utente con edit_posts privilegi.
Assicurati di eseguire lo script sopra da dentro un server. Se tutto va bene e il file viene caricato, il server restituirà l'oggetto multimediale appena creato.
Questa immagine può quindi essere impostata come immagine in primo piano per un post.
Dopo aver esaminato attentamente i modi per creare e aggiornare le risorse utilizzando l'API REST di WP, vediamo come possiamo eliminarle.
Cancellare i dati con l'API WP REST è semplice come inviare un ELIMINA richiesta ad una particolare risorsa.
Se abbiamo bisogno di cancellare un post con un ID di 10, inviamo il seguente ELIMINA richiesta:
$ DELETE / wp / v2 / posts / 10
Questo sposterà il post nel cestino ma non lo eliminerà in modo permanente. Per eliminare definitivamente un post, utilizziamo il vigore discussione:
$ DELETE / wp / v2 / posts / 10? Force = true
Si noti che il vigore argomento è richiesto quando si elimina una risorsa che non supporta il cestin. Esempi di tali risorse sono post meta e media.
Detto questo, ora concludiamo la parte attuale della serie.
In questo lungo tutorial, abbiamo esaminato la creazione, l'aggiornamento e l'eliminazione di diversi tipi di risorse utilizzando l'API WP REST. Abbiamo appreso diversi modi per inviare dati lungo la richiesta, inclusi l'invio di dati come parametri URL, in formato JSON e utilizzando i moduli. Alla fine del tutorial, abbiamo imparato a cancellare le risorse inviando un ELIMINA richiesta.
Nella prossima e ultima puntata della serie, conosceremo la struttura interna dell'API REST di WP e le sue classi. Impareremo anche ad estendere l'API per modificare le risposte del server. Ci vediamo nella prossima parte della serie: state sintonizzati ...
