Tecniche Ajax migliorate per WordPress programmazione orientata agli oggetti

Nel post precedente di questa serie, abbiamo rivisitato l'argomento del lavoro con Ajax in WordPress. In definitiva, l'obiettivo è quello di migliorare su una serie precedente che è stata eseguita sul sito alcuni anni fa.

Per ribadire, non è che le tecniche insegnate nella serie originale fossero sbagliate, ma è che il software cambia nel tempo quindi è sempre bene rivisitare concetti trattati anni fa e provare ad aggiornarli a qualcosa che è un po 'più attuale e più resiliente per i nostri sforzi di sviluppo.

Ricordiamo dal post precedente, abbiamo esaminato il seguente commento della serie originale:

Daremo una breve panoramica di cosa sia Ajax, come funzioni, come configurarlo in primo piano e capire i vantaggi che fornisce WordPress. Realizzeremo anche un piccolo progetto che mette in pratica la teoria. Passeremo attraverso il codice sorgente e ci assicureremo che sia disponibile anche su GitHub.

E in quel post abbiamo esaminato alcuni modi avanzati per incorporare l'API Ajax di WordPress nei nostri progetti utilizzando la programmazione procedurale. In questo post, prendiamo il codice che abbiamo scritto nella prima parte di questa serie e lo rifattiamo in modo che utilizzi un approccio orientato agli oggetti.

In definitiva, l'obiettivo non è quello di spiegare perché un paradigma dovrebbe essere usato rispetto all'altro; invece, è per mostrare come possiamo ottenere la stessa funzionalità indipendentemente dall'approccio scelto durante la creazione dei plugin.

Pianificazione del plugin

Prima di iniziare a refactoring del codice, qualcosa che dobbiamo considerare è Come abbiamo intenzione di disporre i vari file. Dopotutto, parte del processo di iniziare un nuovo progetto - o anche di saltare in un vecchio progetto - sta pianificando il modo in cui il lavoro verrà svolto.

Per questo particolare plugin, avremo bisogno di quanto segue:

un file bootstrap che è responsabile dell'inizializzazione della classe principale e dell'avvio del plugin
una classe responsabile del caricamento delle dipendenze come JavaScript
una classe che funge da classe plugin principale

Come puoi vedere, non c'è pure molto che dobbiamo fare per il plugin. Verificheremo anche la riorganizzazione di alcuni file per avere una struttura di directory coerente, e ci assicureremo di documentare correttamente tutto il codice in modo che segua gli standard di codifica di WordPress.

Detto ciò, iniziamo.

Organizzazione dei file

Prima di scrivere qualsiasi codice, procediamo nel seguente modo:

Creare un risorse elenco.
Creare un js directory che si troverà nel risorse elenco.
Mossa frontend.js al js elenco.

La ragione per fare questo è che stiamo entrando in uno stile di programmazione orientato agli oggetti. Parte di questo include l'organizzazione dei nostri file in modo che seguano convenzioni spesso considerate pacchetti.

Nel nostro caso, il risorse la directory include tutte le cose necessarie per far funzionare il programma. Per alcuni plugin, questo potrebbe essere JavaScript, CSS, immagini, caratteri e così via. In questo caso, abbiamo un singolo file JavaScript.

Il caricatore delle dipendenze

Successivamente, abbiamo bisogno di introdurre una classe che sarà responsabile del caricamento delle dipendenze per il nostro progetto. Per questo particolare plugin, l'unica dipendenza che abbiamo è il file JavaScript che abbiamo appena inserito risorse elenco.

Parte della programmazione orientata agli oggetti è assicurarsi che ogni classe abbia uno scopo specifico. In questo caso, la classe che stiamo per introdurre sarà responsabile del caricamento del codice JavaScript utilizzando l'API di WordPress.

Iniziamo creando la struttura di base della classe:

Successivamente, aggiungeremo un metodo che sarà responsabile dell'inserimento del codice JavaScript secondo l'API di WordPress.
enqueue_scripts ();  / ** * Accoda gli script front-end per ottenere le informazioni dell'utente corrente * tramite Ajax. * * @access private * * @since 1.0.0 * / private function enqueue_scripts () wp_enqueue_script ('ajax-script', plugin_dir_url (dirname (__FILE__)). 'assets / js / frontend.js', array ('jquery ')); wp_localize_script ('ajax-script', 'sa_demo', array ('ajax_url' => admin_url ('admin-ajax.php')));  
Dopodiché, dobbiamo assumere le funzioni responsabili della gestione delle richieste Ajax e fornire le risposte e quindi aggiungerle alla classe. Dal momento che saranno nel contesto di una classe, dobbiamo aggiungere una nuova funzione che li registrerà con WordPress.
Creeremo un setup_ajax_handlers funzione. Sembra questo:
Successivamente, dobbiamo effettivamente spostare le funzioni in questa classe. Si noti che le funzioni originariamente prefissate con _sa non sono più contrassegnati come tali. Dato che si trovano nel contesto della classe, possiamo rilasciare il prefisso e anche lasciare il trattino di sottolineatura in favore di privato parola chiave.
user_is_logged_in ($ user_id) && $ this-> user_exists ($ user_id)) wp_send_json_success (wp_json_encode (get_user_by ('id', $ user_id)));  funzione privata user_is_logged_in ($ user_id) $ is_logged_in = true; if (0 === $ user_id) wp_send_json_error (new WP_Error ('-2', 'Il visitatore non è attualmente connesso al sito.')); $ is_logged_in = falso;  return $ is_logged_in;  funzione privata user_exists ($ user_id) $ user_exists = true; if (false === get_user_by ('id', $ user_id)) wp_send_json_error (new WP_Error ('-1', 'Nessun utente trovato con l'ID specificato ['. $ user_id. ']')); $ user_exists = false;  return $ user_exists; 
Quindi salveremo questo file in un file include directory nella radice della directory dei plugin. Il include directory è spesso dove si trova il codice che viene utilizzato in tutto un progetto. Si potrebbe dire di più su questa particolare directory, ma questo è il contenuto di un post più lungo.
La versione finale di questa classe dovrebbe assomigliare a questa:
enqueue_scripts ();  / ** * Accoda gli script front-end per ottenere le informazioni dell'utente corrente * tramite Ajax. * * @access private * * @since 1.0.0 * / private function enqueue_scripts () wp_enqueue_script ('ajax-script', plugin_dir_url (dirname (__FILE__)). 'assets / js / frontend.js', array ('jquery ')); wp_localize_script ('ajax-script', 'sa_demo', array ('ajax_url' => admin_url ('admin-ajax.php')));  / ** * Registra le funzioni di callback responsabili di fornire una risposta * all'installazione delle richieste Ajax nel resto del plug-in. * * @since 1.0.0 * / funzione pubblica setup_ajax_handlers () add_action ('wp_ajax_get_current_user_info', array ($ this, 'get_current_user_info')); add_action ('wp_ajax_nopriv_get_current_user_info', array ($ this, 'get_current_user_info'));  / ** * Recupera le informazioni sull'utente attualmente connesso al sito. * * Questa funzione è destinata a essere chiamata tramite il lato client del lato * rivolto al pubblico del sito. * * @since 1.0.0 * / public function get_current_user_info () $ user_id = get_current_user_id (); if ($ this-> user_is_logged_in ($ user_id) && $ this-> user_exists ($ user_id)) wp_send_json_success (wp_json_encode (get_user_by ('id', $ user_id)));  / ** * Determina se un utente ha effettuato l'accesso al sito utilizzando l'ID utente specificato. In caso contrario, * il seguente codice di errore e il messaggio verranno restituiti al client: * * -2: il visitatore non è attualmente connesso al sito. * * @accesso privato * @since 1.0.0 * * @param int $ user_id L'ID dell'utente corrente. * * @return bool $ is_logged_in Indica se l'utente corrente ha effettuato l'accesso. * / private function user_is_logged_in ($ user_id) $ is_logged_in = true; if (0 === $ user_id) wp_send_json_error (new WP_Error ('-2', 'Il visitatore non è attualmente connesso al sito.')); $ is_logged_in = falso;  return $ is_logged_in;  / ** * Determina se un utente con l'ID specificato esiste nel database di WordPress. In caso contrario, * verrà restituito al client il seguente codice di errore e il messaggio: * * -1: Nessun utente è stato trovato con l'ID specificato [$ user_id]. * * @accesso privato * @since 1.0.0 * * @param int $ user_id L'ID dell'utente corrente. * * @return bool $ user_exists Se l'utente specificato esiste o meno. * / funzione privata user_exists ($ user_id) $ user_exists = true; if (false === get_user_by ('id', $ user_id)) wp_send_json_error (new WP_Error ('-1', 'Nessun utente trovato con l'ID specificato ['. $ user_id. ']')); $ user_exists = false;  return $ user_exists;  
La classe principale
Ora siamo pronti per scrivere la classe principale per il plugin. Questa particolare classe risiederà nella radice della directory dei plugin e la struttura di base della classe sarà simile a questa:
Successivamente, aggiungeremo un paio di proprietà che verranno impostate quando viene creata un'istanza della classe:
Successivamente, creeremo un costruttore e una funzione di inizializzazione che verrà utilizzata per impostare il plug-in in movimento:
version = '1.0.0'; $ this-> loader = new Dependency_Loader ();  / ** * Inizializza questo plugin e il caricatore di dipendenze per includere * il codice JavaScript necessario per il funzionamento del plugin. * * @access private * @since 1.0.0 * / public function initialize () $ this-> loader-> initialize (); $ This-> loader-> setup_ajax_handlers ();  
Nel codice sopra, il costruttore imposta le proprietà e crea un'istanza delle dipendenze necessarie per impostare il plug-in in movimento.
quando inizializzare viene chiamato, il plug-in si avvierà e chiamerà il metodo di inizializzazione sulla classe di dipendenza creata in precedenza in questo tutorial.
Il Bootstrap
L'ultima cosa che dobbiamo fare è prendere il file principale che abbiamo, usare PHP includere funzionalità, e assicurarsi che sia a conoscenza dei file PHP necessari che abbiamo.
Dopodiché, dobbiamo definire un metodo che inizializzerà il file del plugin principale e imposterà tutto in movimento.
inizializzare(); 
La versione finale del file di bootstrap dovrebbe assomigliare a questa:
inizializzare();  acme_start_plugin (); 
Innanzitutto, il file controlla se è possibile accedervi direttamente controllando se è stata definita una costante di WordPress. In caso contrario, l'esecuzione si interrompe. 
Dopo di ciò, include le varie classi che abbiamo creato attraverso questo tutorial. Infine, definisce una funzione chiamata quando WordPress carica il plug-in che avvia il plug-in e imposta tutto in movimento.
Conclusione
E questo ci porta alla fine di questa serie in due parti. Si spera che tu abbia imparato non solo alcune delle migliori pratiche per incorporare Ajax nei tuoi progetti WordPress, ma anche un po 'di documentazione sul codice procedurale e orientato agli oggetti oltre a vedere la differenza nella quantità di codice prevista.
In un post futuro, potrei rivisitare alcuni dei concetti orientati agli oggetti che sono stati introdotti qui e li riguardano in modo molto più dettagliato. Per ora, però, dai un'occhiata al plugin usando il link GitHub nella barra laterale di questa pagina.
Ricorda, puoi prendere tutti i miei corsi ed esercitazioni sulla mia pagina del profilo, e puoi seguirmi sul mio blog e / o Twitter su @tommcfarlin dove parlo di sviluppo di software nel contesto di WordPress.
Come al solito, non esitare a lasciare qualsiasi domanda o commento nel feed qui sotto, e io mirerò a rispondere a ciascuno di essi. 



		
			
	   
	




Codice