Förbättrade Ajax-tekniker för WordPress Objektorienterad programmering

I det föregående inlägget i denna serie granskade vi ämnet för att arbeta med Ajax i WordPress. I slutändan är målet att förbättra sig på en tidigare serie som kördes på platsen för några år sedan.

Att upprepa är inte att teknikerna som lärt sig i den ursprungliga serien var fel, men det är så att programvaran ändras över tid så det är alltid bra att återgå till koncept som täcktes år sedan och försöka uppdatera dem till något som är lite mer aktuellt och mer eftergivligt för våra utvecklingsinsatser.

Minns från föregående inlägg, tittade vi på följande kommentar från den ursprungliga serien:

Vi ska ge en mycket kort översikt över vad Ajax är, hur det fungerar, hur man ställer upp det på framsidan och förstår krokarna som WordPress tillhandahåller. Vi ska också faktiskt bygga ett litet projekt som sätter teorin i bruk. Vi går igenom källkoden och vi ser också till att den är tillgänglig på GitHub också.

Och i det inlägget granskade vi några avancerade sätt att integrera WordPress Ajax API i våra projekt genom procedurprogrammering. I det här inlägget kommer vi att ta den kod som vi skrev i den första delen av denna serie och refactor den så att den använder en objektorienterad tillvägagångssätt.

I slutändan är målet inte att göra ett fall varför ett paradigm ska användas över det andra; istället är det för att visa hur vi kan uppnå samma funktionalitet oavsett vilket sätt du väljer när du bygger dina plugins.

Planerar plugin

Innan vi börjar ompröva koden, är det något vi behöver tänka på på vilket sätt Vi ska lägga ut de olika filerna. När allt kommer omkring är det en del av processen att starta ett nytt projekt - eller till och med hoppa in i en gammal - planerar hur arbetet ska utföras.

För det här pluginet behöver vi följande:

  • en bootstrap-fil som ansvarar för att initialisera huvudklassen och startar pluginprogrammet
  • en klass som ansvarar för att ladda beroendet, som JavaScript
  • en klass som fungerar som huvud plugin-klass

Som du kan se finns det inte för mycket som vi behöver göra för plugin. Vi kommer också att organisera om några av filerna för att ha en konsekvent katalogstruktur och vi ska se till att du korrekt dokumenterar hela koden så att den följer WordPress-kodningsstandarderna.

Med det sagt, låt oss börja.

Organisera filerna

Innan vi skriver in någon kod, låt oss gå vidare och göra följande:

  1. Skapa en tillgångar katalog.
  2. Skapa en js katalog som kommer att finnas i tillgångar katalog.
  3. Flytta frontend.js till js katalog.

Anledningen till detta är att vi flyttar in i en objektorienterad programmeringsstil. En del av detta inkluderar att organisera våra filer så att de följer konventioner som ofta anses vara paket.

I vårt fall är tillgångar katalogen innehåller alla de saker som krävs för att programmet ska köras. För vissa plugins kan det här vara JavaScript, CSS, bilder, teckensnitt och så vidare. I det här fallet har vi en enda JavaScript-fil.

Dependency Loader

Därefter måste vi introducera en klass som ansvarar för att ladda beroendet för vårt projekt. För det här pluginet är det enda beroende vi har JavaScript-filen som vi precis placerat i tillgångar katalog.

En del av objektorienterad programmering är att se till att varje klass har ett specifikt syfte. I det här fallet är den klass vi ska introducera ansvarig för att ladda JavaScript med WordPress API.

Låt oss börja med att skapa klassens grundläggande struktur:

Därefter lägger vi till en metod som ansvarar för att skriva in JavaScript enligt WordPress API.

enqueue_scripts ();  / ** * Förenklar front-end-skript för att få den nuvarande användarens information * via Ajax. * * @access privat * * @since 1.0.0 * / privat funktion enqueue_scripts () wp_enqueue_script ('ajax-script', plugin_dir_url (dirname (__FILE__)) 'tillgångar / js / frontend.js', array ('jquery ')); wp_localize_script ('ajax-script', 'sa_demo', array ('ajax_url' => admin_url ('admin-ajax.php')));  

Därefter måste vi ta de funktioner som är ansvariga för hanteringen av Ajax-förfrågningarna och ge svar och lägg sedan till dem i klassen. Eftersom de kommer att ligga inom ramen för en klass måste vi lägga till en ny funktion som registrerar dem med WordPress.

Vi skapar en setup_ajax_handlers fungera. Det ser ut så här:

Därefter måste vi faktiskt flytta funktionerna till den här klassen. Observera att de funktioner som ursprungligen var prefixade med _sa är inte längre markerade som sådana. Eftersom de är i klassens sammanhang kan vi släppa prefixet och även släppa understrykning till förmån för privat nyckelord.

user_is_logged_in ($ user_id) && $ this-> user_exists ($ user_id)) wp_send_json_success (wp_json_encode (get_user_by ('id', $ user_id)));  privat funktion user_is_logged_in ($ user_id) $ is_logged_in = true; om (0 === $ user_id) wp_send_json_error (ny WP_Error ('-2', 'Besökaren är för närvarande inte inloggad på sajten.')); $ is_logged_in = false;  returnera $ is_logged_in;  privat funktion user_exists ($ user_id) $ user_exists = true; om false === get_user_by ('id', $ user_id)) wp_send_json_error (ny WP_Error ('-1', 'Ingen användare hittades med det angivna ID ['. $ user_id. ']')); $ user_exists = false;  returnera $ user_exists; 

Då sparar vi filen i en innefattar katalog i rutan till plugin katalogen. De innefattar katalog är ofta där kod som används under ett projekt ligger. Mer kan sägas om den här katalogen, men det är innehåll för ett längre inlägg.

Den sista versionen av den här klassen ska se ut så här:

enqueue_scripts ();  / ** * Förenklar front-end-skript för att få den nuvarande användarens information * via Ajax. * * @access privat * * @since 1.0.0 * / privat funktion enqueue_scripts () wp_enqueue_script ('ajax-script', plugin_dir_url (dirname (__FILE__)) 'tillgångar / js / frontend.js', array ('jquery ')); wp_localize_script ('ajax-script', 'sa_demo', array ('ajax_url' => admin_url ('admin-ajax.php')));  / ** * Registrerar återuppringningsfunktionerna som är ansvariga för att svara * på Ajax-förfrågningsinställningar under resten av plugin. * * @since 1.0.0 * / public function 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'));  / ** * Hämtar information om den användare som för närvarande är inloggad på sajten. * * Den här funktionen är avsedd att kallas via klientsidan av webbplatsens public-facing sida *. * * @since 1.0.0 * / public function get_current_user_info () $ user_id = get_current_user_id (); om ($ 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)));  / ** * Bestämmer om en användare är inloggad på sajten med det angivna användar-ID. Om inte, * kommer följande felkod och meddelande att returneras till klienten: * * -2: Besökaren är för närvarande inte inloggad på sajten. * * @access privat * @since 1.0.0 * * @param int $ user_id Den nuvarande användarens ID. * * @return bool $ is_logged_in Huruvida den nuvarande användaren är inloggad. * / privat funktion user_is_logged_in ($ user_id) $ is_logged_in = true; om (0 === $ user_id) wp_send_json_error (ny WP_Error ('-2', 'Besökaren är för närvarande inte inloggad på sajten.')); $ is_logged_in = false;  returnera $ is_logged_in;  / ** * Bestämmer om en användare med det angivna IDet finns i WordPress-databasen. Om inte, kommer följande felkod och meddelande att returneras till klienten: * * -1: Ingen användare hittades med det angivna ID [$ user_id]. * * @access privat * @since 1.0.0 * * @param int $ user_id Den nuvarande användarens ID. * * @return bool $ user_exists Om den angivna användaren finns eller inte. * / privat funktion user_exists ($ user_id) $ user_exists = true; om false === get_user_by ('id', $ user_id)) wp_send_json_error (ny WP_Error ('-1', 'Ingen användare hittades med det angivna ID ['. $ user_id. ']')); $ user_exists = false;  returnera $ user_exists;  

Huvudklassen

Nu är vi redo att skriva huvudklassen för plugin. Den här klassen kommer att ligga i roten i plugin-katalogen och den grundläggande strukturen i klassen kommer att se ut så här:

Därefter lägger vi till ett par egenskaper som vi ska ställa in när klassen är instantierad:

Därefter skapar vi en konstruktör och en initialiseringsfunktion som ska användas för att ställa in plugin i rörelse:

version = '1.0.0'; $ this-> loader = new Dependency_Loader ();  / ** * Initierar det här pluginet och beroendelastaren för att inkludera * JavaScript som krävs för att plugin ska fungera. * * @access privat * @since 1.0.0 * / public function initialize () $ this-> loader-> initiera (); $ This-> loader-> setup_ajax_handlers ();  

I koden ovan ställer konstruktören egenskaperna och instanserar de beroenden som är nödvändiga för att ställa in plugin i rörelse.

När initialisera kallas, plugin startar och det kommer att ringa initieringsmetoden på den beroende klass vi skapade tidigare i denna handledning.

Bootstrap

Det sista vi behöver göra är att ta huvudfilen som vi har, använd PHP inkludera funktionalitet, och se till att den är medveten om nödvändiga PHP-filer som vi har.

Därefter måste vi definiera en metod som initierar huvud pluginfilen och sätter allt på gång.

initialisera (); 

Den slutliga versionen av bootstrap-filen ska se ut så här:

initialisera ();  acme_start_plugin (); 

Först kontrollerar filen om den ska nås direkt genom att kontrollera om en WordPress-konstant har definierats. Om inte, slutar körningen. 

Därefter innehåller den de olika klasserna vi skapade genom denna handledning. Slutligen definierar den en funktion som heter när WordPress laddar in det plugin som startar plugin och sätter allt i rörelse.

Slutsats

Och det leder oss till slutet av den här tvådelade serien. Förhoppningsvis har du inte bara lärt dig några av de bästa metoderna för att integrera Ajax i dina WordPress-projekt, utan också lite om att dokumentera både processorienterad och objektorienterad kod, samt att se skillnaden i hur mycket koden läggs ut.

I ett framtida inlägg kan jag se några av de objektorienterade begrepp som introducerades här och täcka dem i mycket mer detalj. För tillfället, ta en titt på plugin med hjälp av GitHub-länken i sidoregionen på den här sidan.

Kom ihåg att du kan fånga alla mina kurser och handledning på min profilsida, och du kan följa mig på min blogg och / eller Twitter på @tommcfarlin där jag pratar om mjukvaruutveckling i samband med WordPress.

Som vanligt, tveka inte att lämna några frågor eller kommentarer i foderet nedan, och jag ska sträva efter att svara på var och en av dem.