L'API Heartbeat come iniziare

Con 3.6, alias "Oscar", appena rilasciato, diamo un'occhiata ad alcune delle nuove funzionalità disponibili per gli sviluppatori. In particolare, in questa serie vedrò la nuova API heartbeat e dimostrerò come utilizzarla nei tuoi plugin e temi.


Cos'è l'API Heartbeat?

L'API heartbeat consente una comunicazione regolare tra il browser dell'utente e il server. Una delle motivazioni originali era quella di consentire il blocco dei post e avvisare gli utenti quando più di un utente sta tentando di modificare un post, o avvisare l'utente quando il suo log-in è scaduto.

Questa 'comunicazione' implica l'invio di dati al server di routine, che quindi risponde con dati appropriati. L'API consente ai plugin di allegare i propri dati a entrambe le estremità, dando al proprio plugin la possibilità di comunicare tra server e browser. Puoi pensare a queste fasi (dati inviati da browser a server e risposta inviata da server a browser) come i due "battiti" che costituiscono un ciclo cardiaco. L'intero processo viene ripetuto a intervalli regolari. Tutto questo accade in background, quindi la maggior parte delle volte probabilmente non saprai mai che è lì.


Invio di dati dal browser al server

Per impostazione predefinita, Heartbeat viene avviato automaticamente, ma invia sempre dati al server solo quando dispone di dati da inviare. Per accodare i dati è necessario utilizzare il wp.heartbeat.enqueue () funzione nel tuo file JavaScript. Questa funzione richiede tre argomenti:

  • Maniglia - (stringa) Questo è solo un identificatore di stringa per i tuoi dati. Assicurati che sia unico.
  • Dati - (oggetto) I dati da inviare come oggetto.
  • Oltrepassare - (bool) Sia per cavalcare esistente dati. Se true, tutti i dati precedentemente aggiunti con l'handle fornito vengono sostituiti. Se falso e i dati esistono già per quella maniglia, non fa nulla.

Per esempio:

 wp.heartbeat.enqueue ('wptuts-plugin', 'foo': 'bar', 'wp': 'tuts',, false);

Nota: Qualsiasi dato inviato con un beat viene immediatamente rimosso dalla coda. I dati accodati dopo quel punto vengono inviati con il beat successivo.

Per verificare se un determinato handle dispone già di dati in attesa in coda o per recuperare tali dati, è possibile utilizzare il comando wp.heartbeat.isQueued (). Questa funzione accetta un handle come unico argomento e restituisce entrambi nullo o i dati associati in attesa in coda.

Questo è utile, ad esempio, se vuoi aggiungere argomenti extra a dati già accodati:

 // Dati per aggiungere var new_data = 'version': '3.6'; if (data = wp.heartbeat.isQueued ('wptuts-plugin')) // Data già esiste - unisce i dati con i nuovi dati new_data = jQuery.extend (data, new_data);  // Accoda e supera i dati esistenti wp.heartbeat.enqueue ('wptuts-plugin', new_data, true); / * wptuts-plugin ora ha i dati e new_data ad esso associati: 'foo': 'bar', 'wp': 'tuts', 'version': '3.6'; * /

Mancia: Dovresti elencare 'battito cardiaco'come una dipendenza per qualsiasi file JavaScript che faccia uso di questa API. Ne tratteremo questo, insieme a un plug-in di esempio funzionante, nella terza parte.


Invio di dati dal server al browser

Al successivo "beat" i dati di cui sopra vengono inviati al server, quando questi dati vengono ricevuti sul lato server ci sono tre hook che vengono attivati:

  • heartbeat_received - Questo filtra la risposta del server al browser. Passa anche i dati ricevuti dal browser e l'ID della schermata di amministrazione (o "front" se questa richiesta proviene dal front-end).
  • heartbeat_send - Questo hook filtra anche la risposta del server al browser. La sua unica differenza rispetto al filtro precedente è che non trasmette i dati ricevuti.
  • heartbeat_tick - Questa azione è attivata appena prima che la risposta sia impostata. Passa l'array di risposta e l'ID dello schermo come argomenti.

Se l'utente corrente è disconnesso, allora i ganci:

  • heartbeat_nopriv_received
  • heartbeat_nopriv_send
  • heartbeat_nopriv_tick

sono invece attivati. (nopriv sta per nessun privilegio)

Per la maggior parte probabilmente avrai solo bisogno del primo di questi filtri: heartbeat_received / heartbeat_nopriv_received. Questi filtri passano i dati ricevuti dal browser e quindi ci consentono di verificare se abbiamo dati associati al nostro handle, prima di includere la nostra risposta:

 function wptuts_respond_to_browser ($ response, $ data, $ screen_id) if (isset ($ data ['wptuts-plugin'])) // Abbiamo dati con il nostro handle! Rispondiamo con qualcosa ... // echo $ data ['wptuts-plugin'] ['foo']; // stampa 'bar'; $ response ['wptuts-plugin'] = array ('hello' => 'mondo');  return $ response;  // Utenti registrati: add_filter ('heartbeat_received', 'wptuts_respond_to_browser', 10, 3); // Utenti registrati add_filter ('heartbeat_nopriv_received', 'wptuts_respond_to_browser', 10, 3);

Ascoltando il ritorno "Beat"

Infine, per completare il ciclo, possiamo ascoltare quando la risposta dal server viene ricevuta dal browser. Quando ciò accade, WordPress attiva l'evento battito cardiaco-tick. Possiamo collegarci a questo con il nostro callback per elaborare la risposta:

 jQuery (document) .ready (function ($) $ (document) .on ('heartbeat-tick.wptuts-plugin', function (event, data) if (data.hasOwnProperty ('wptuts-plugin'))  console.log (data ['wptuts-plugin']); // Stampa sulla console 'hello': 'world'););

Nota: Si consiglia vivamente di utilizzare gli eventi con nomi assegnati, ovvero a cui si associa la richiamata heartbeat-tick. unique namespace come sopra, e non solo battito cardiaco-tick.

Questo, in sostanza, è come sfruttare l'API Heartbeat. Nella prossima parte della serie vedremo modi in cui puoi manipolare il battito del ritmo. Nella parte finale creeremo un esempio funzionante di un plugin che utilizza l'API.