Tehnici Ajax îmbunătățite pentru WordPress programare orientată pe obiecte

În postul anterior din această serie, am revizuit subiectul de lucru cu Ajax în WordPress. În cele din urmă, scopul este de a îmbunătăți o serie anterioară care a fost rulată pe site-ul cu câțiva ani în urmă.

Pentru a reitera, nu este ca tehnicile predate in seriile originale au fost gresite, dar este ca software-ul se schimba de-a lungul timpului, deci este intotdeauna bine sa revedeti concepte care au fost acoperite cu ani in urma si sa incercati sa le actualizati la ceva mai putin curent si mai rezistent pentru eforturile noastre de dezvoltare.

Reamintim din postul anterior, am analizat următorul comentariu din seria originală:

Vom oferi o scurtă trecere în revistă a ceea ce este Ajax, cum funcționează, cum să-l instalezi pe front și să înțelegi cârligele pe care le oferă WordPress. De asemenea, vom construi un mic proiect care să pună teoria în practică. Vom trece prin codul sursă și vom asigura, de asemenea, că este disponibil și pe GitHub.

Și în acest post, am analizat câteva modalități avansate de a încorpora API-ul WordPress Ajax în proiectele noastre folosind programarea procedurală. În acest post, vom lua codul pe care l-am scris în prima parte a acestei serii și vom refactoriza astfel încât să folosească o abordare orientată pe obiecte.

În cele din urmă, obiectivul nu este de a face un caz de ce o paradigmă ar trebui să fie folosită peste cealaltă; în schimb, este de a arăta cum putem obține aceleași funcționalități indiferent de abordarea pe care o alegeți atunci când construiți pluginurile.

Planificarea pluginului

Înainte de a începe să refacem codul, trebuie să luăm în considerare acest lucru Cum vom desena diferitele fișiere. La urma urmei, o parte din procesul de a începe un nou proiect - sau chiar de a sări într-unul vechi - planifică modul în care se va face lucru.

Pentru acest plugin special, vom avea nevoie de următoarele:

un fișier de bootstrap care este responsabil pentru inițializarea clasei principale și pornirea plugin-ului
o clasă responsabilă de încărcarea dependențelor, cum ar fi JavaScript
o clasă care servește ca clasă principală a plugin-urilor

După cum puteți vedea, nu există de asemenea ceea ce trebuie să facem cu pluginul. Vom reorganiza, de asemenea, unele dintre fișiere pentru a avea o structură consistentă a directoarelor și vom asigura că documentarea corectă a codului va fi însoțită de standardele de codare WordPress.

Cu asta a spus, să începem.

Organizarea dosarelor

Înainte de a începe să scriem orice cod, să mergem mai departe și să facem următoarele:

Creaza un bunuri director.
Creeaza o js director care va fi localizat în bunuri director.
Mișcare frontend.js la js director.

Motivul pentru care facem acest lucru este că ne mutăm într-un stil de programare orientat spre obiect. O parte dintre acestea includ organizarea fișierelor noastre, astfel încât acestea să respecte convențiile considerate adesea pachete.

În cazul nostru, bunuri directorul include toate lucrurile necesare pentru a face programul să ruleze. Pentru unele pluginuri, acesta ar putea fi JavaScript, CSS, imagini, fonturi și așa mai departe. În acest caz, avem un singur fișier JavaScript.

Încărcătorul de dependență

Apoi, trebuie să introducem o clasă care va fi responsabilă pentru încărcarea dependențelor pentru proiectul nostru. Pentru acest plugin special, singura dependență pe care o avem este fișierul JavaScript pe care tocmai l-am plasat în bunuri director.

O parte din programarea orientată pe obiecte se asigură că fiecare clasă are un scop specific. În acest caz, clasa pe care urmează să o prezentăm va fi responsabilă pentru încărcarea JavaScript folosind API-ul WordPress.

Să începem prin crearea structurii de bază a clasei:

Apoi, vom adăuga o metodă care va fi responsabilă pentru enqueuing JavaScript ca API WordPress.

enqueue_scripts ();  / ** * Încorporează scripturile frontale pentru obținerea informațiilor utilizatorului curent * prin Ajax. * * @access privat * * @ din 1.0.0 * / funcția privată enqueue_scripts () wp_enqueue_script ('ajax-script', plugin_dir_url (dirname (__FILE__)) 'assets / js / frontend.js', array ')); wp_localize_script ('ajax-script', 'sa_demo', array ('ajax_url' => admin_url ('admin-ajax.php')));

După aceea, trebuie să luăm funcțiile responsabile de manipularea solicitărilor Ajax și de furnizarea de răspunsuri și apoi să le adăugăm la clasă. Deoarece vor fi în contextul unei clase, trebuie să adăugăm o nouă funcție care să le înregistreze cu WordPress.

Vom crea o setup_ajax_handlers funcţie. Se pare ca aceasta:

Apoi, trebuie să mutăm funcțiile în această clasă. Rețineți că funcțiile care au fost inițial prefixate cu _sa nu mai sunt marcate ca atare. Din moment ce se află în contextul clasei, putem renunța la prefix și, de asemenea, lăsăm sublinierea în favoarea privat cuvinte cheie.

user_is_logged_in ($ user_id) și& $ this-> user_exists ($ user_id)) wp_send_json_success (wp_json_encode (get_user_by ('id', $ user_id));  funcția privată user_is_logged_in ($ user_id) $ is_logged_in = true; dacă (0 === $ user_id) wp_send_json_error (noul WP_Error ('-2', 'Vizitatorul nu este conectat în prezent la site.')); $ is_logged_in = false;  return $ is_logged_in;  funcția privată user_exists ($ user_id) $ user_exists = true; if (false === get_user_by ('id', $ user_id)) wp_send_json_error (nou WP_Error ('-1', 'Niciun utilizator nu a fost găsit cu ID-ul specificat ['. $ user_id. ']'); $ user_exists = false;  return $ user_exists;

Apoi vom salva acest fișier într-un include directorul din directorul plugin-ului. include directorul este adesea unde este localizat codul care este utilizat în întregul proiect. S-ar putea spune mai multe despre acest director special, dar acesta este conținut pentru un post mai lung.

Versiunea finală a acestei clase ar trebui să arate astfel:

enqueue_scripts ();  / ** * Încorporează scripturile frontale pentru obținerea informațiilor utilizatorului curent * prin Ajax. * * @access privat * * @ din 1.0.0 * / funcția privată enqueue_scripts () wp_enqueue_script ('ajax-script', plugin_dir_url (dirname (__FILE__)) 'assets / js / frontend.js', array ')); wp_localize_script ('ajax-script', 'sa_demo', array ('ajax_url' => admin_url ('admin-ajax.php')));  / ** * Înregistrează funcțiile de returnare a apelurilor responsabile pentru furnizarea unui răspuns * la solicitarea Ajax de instalare în restul pluginului. * * @ din 1.0.0 * / funcția publică 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'));  / ** * Returnează informații despre utilizatorul care este conectat în prezent la site. * * Această funcție este destinată să fie apelată prin intermediul paginii client a părții publice a site-ului *. * * @ din 1.0.0 * / funcția publică get_current_user_info () $ user_id = get_current_user_id (); dacă ($ 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));  / ** * Determină dacă un utilizator este conectat la site utilizând ID-ul de utilizator specificat. Dacă nu, * următorul cod de eroare și mesaj vor fi returnate clientului: * * -2: Vizitatorul nu este în prezent conectat la site. * * @access privat * @since 1.0.0 * * @param int $ user_id ID-ul curent al utilizatorului. * * @return bool $ is_logged_in Dacă utilizatorul curent este sau nu logat. * / funcția privată user_is_logged_in ($ user_id) $ is_logged_in = true; dacă (0 === $ user_id) wp_send_json_error (noul WP_Error ('-2', 'Vizitatorul nu este conectat în prezent la site.')); $ is_logged_in = false;  return $ is_logged_in;  / ** * Determină dacă un utilizator cu ID-ul specificat există în baza de date WordPress. Dacă nu, atunci * va fi returnat clientului următorul cod de eroare și mesajul: * * -1: Niciun utilizator nu a fost găsit cu ID-ul specificat [$ user_id]. * * @access privat * @since 1.0.0 * * @param int $ user_id ID-ul curent al utilizatorului. * * @return bool $ user_exists Indiferent dacă există sau nu utilizatorul specificat. * / funcția privată user_exists ($ user_id) $ user_exists = true; if (false === get_user_by ('id', $ user_id)) wp_send_json_error (nou WP_Error ('-1', 'Niciun utilizator nu a fost găsit cu ID-ul specificat ['. $ user_id. ']'); $ user_exists = false;  return $ user_exists;

Clasa principală

Acum suntem gata să scriem clasa principală pentru plugin. Această clasă specială se va afla în rădăcina directorului plugin și structura de bază a clasei va arăta astfel:

Apoi, vom adăuga câteva proprietăți pe care le vom stabili atunci când clasa este instanțiată:

După aceea, vom crea un constructor și o funcție de inițializare care va fi utilizată pentru a seta pluginul în mișcare:

versiunea = '1.0.0'; $ this-> loader = nou Dependency_Loader ();  / ** * Inițializează acest plugin și încărcătorul de dependență pentru a include * JavaScript-ul necesar ca pluginul să funcționeze. * * @access privat * @ începând cu 1.0.0 * / funcția publică initialize () $ this-> loader-> initialize (); $ This-> loader-> setup_ajax_handlers ();

În codul de mai sus, constructorul stabilește proprietățile și instanțiază dependențele necesare pentru a seta pluginul în mișcare.

Cand inițializa se numește, pluginul va porni și se va apela metoda inițializării pe clasa de dependență pe care am creat-o mai devreme în acest tutorial.

Bootstrapul

Ultimul lucru pe care trebuie să-l facem este să luăm fișierul principal pe care îl avem, să folosim PHP-ul include și asigurați-vă că este conștient de fișierele PHP necesare pe care le avem.

După aceasta, trebuie să definim o metodă care va inițializa fișierul principal de plugin și va pune totul în mișcare.

inițializarea ();

Versiunea finală a fișierului bootstrap ar trebui să arate astfel:

inițializarea ();  acme_start_plugin ();

În primul rând, fișierul verifică dacă este accesat direct prin verificarea pentru a vedea dacă o constanță WordPress a fost definită. Dacă nu, execuția se oprește.

După aceasta, acesta include diferitele clase pe care le-am creat prin acest tutorial. În cele din urmă, aceasta definește o funcție numită atunci când WordPress încarcă plugin-ul care pornește plugin-ul și pune totul în mișcare.

Concluzie

Și asta ne aduce la sfârșitul seriei din două părți. Sperăm că ați învățat nu numai câteva dintre cele mai bune practici pentru încorporarea Ajax în proiectele dvs. WordPress, dar și un pic despre documentarea atât a codului procedural cât și a obiectului orientat, precum și pentru a vedea diferența în ceea ce privește cantitatea din cod.

Într-un post viitor, aș putea revizui câteva dintre conceptele orientate pe obiecte introduse aici și le-aș acoperi cu mult mai multe detalii. Pentru moment, însă, aruncați o privire asupra plugin-ului utilizând link-ul GitHub din bara laterală a acestei pagini.

Amintiți-vă că puteți să-mi prindeți toate cursurile și tutorialele pe pagina mea de profil și puteți să mă urmați pe blogul meu și / sau pe Twitter la @tommcfarlin unde vorbesc despre dezvoltarea de software în contextul WordPress.

Ca de obicei, vă rugăm să nu ezitați să lăsați orice întrebări sau comentarii în feed-ul de mai jos și voi încerca să răspund la fiecare dintre ele.

Cod