Verbesserte Ajax-Techniken für WordPress Objektorientierte Programmierung

Im vorherigen Beitrag dieser Serie haben wir das Thema Arbeiten mit Ajax in WordPress erneut behandelt. Letztendlich ist es das Ziel, eine vorherige Serie zu verbessern, die vor einigen Jahren auf der Website lief.

Um es noch einmal zu sagen, es ist nicht so, dass die in der Originalserie gelehrten Techniken falsch waren, aber es ist immer gut, dass sich die Software mit der Zeit ändert. Es ist also immer gut, Konzepte zu überdenken, die vor Jahren behandelt wurden, und versuchen, sie auf etwas aktuelleres und widerstandsfähigeres zu aktualisieren für unsere Entwicklungsbemühungen.

Im vorherigen Beitrag haben wir uns den folgenden Kommentar aus der Originalserie angesehen:

Wir werden einen sehr kurzen Überblick über Ajax geben, wie es funktioniert, wie man es an der Front aufstellt und die Haken von WordPress verstehen. Wir werden auch ein kleines Projekt erstellen, das die Theorie in die Praxis umsetzt. Wir gehen den Quellcode durch und stellen sicher, dass er auch auf GitHub verfügbar ist.

In diesem Beitrag haben wir einige fortgeschrittene Möglichkeiten zur Einbindung der WordPress-Ajax-API in unsere Projekte mithilfe von prozeduraler Programmierung überprüft. In diesem Beitrag werden wir den Code, den wir im ersten Teil dieser Serie geschrieben haben, übernehmen und ihn so umgestalten, dass er einen objektorientierten Ansatz verwendet.

Letztendlich ist es nicht das Ziel, einen Fall darzulegen, warum ein Paradigma über dem anderen verwendet werden sollte; Stattdessen soll gezeigt werden, wie wir die gleiche Funktionalität erreichen können, unabhängig von dem Ansatz, den Sie beim Erstellen Ihrer Plug-ins auswählen.

Planung des Plugins

Bevor wir damit anfangen, den Code zu überarbeiten, ist etwas, das wir berücksichtigen müssen Wie Wir werden die verschiedenen Dateien anlegen. Ein Teil des Prozesses, ein neues Projekt zu beginnen oder sogar in ein altes Projekt zu springen, ist schließlich die Planung der Arbeit.

Für dieses spezielle Plugin benötigen wir Folgendes:

eine Bootstrap-Datei, die für die Initialisierung der Hauptklasse und das Starten des Plugins verantwortlich ist
eine Klasse, die für das Laden der Abhängigkeiten wie JavaScript verantwortlich ist
eine Klasse, die als Hauptklasse für Plugins dient

Wie Sie sehen können, gibt es nicht auch viel, was wir mit dem Plugin tun müssen. Wir werden auch einige Dateien neu organisieren, um eine konsistente Verzeichnisstruktur zu erhalten, und wir werden sicherstellen, dass der gesamte Code ordnungsgemäß dokumentiert wird, so dass er den WordPress-Codierstandards entspricht.

Nachdem dies gesagt ist, lasst uns anfangen.

Dateien organisieren

Bevor wir mit dem Schreiben von Code beginnen, gehen wir folgendermaßen vor:

Erstelle ein Vermögenswerte Verzeichnis.
Ein ... kreieren js Verzeichnis, das sich im Verzeichnis befindet Vermögenswerte Verzeichnis.
Bewegung frontend.js zum js Verzeichnis.

Der Grund dafür ist, dass wir uns in einen objektorientierten Programmierstil begeben. Dazu gehört auch, dass unsere Dateien so organisiert werden, dass sie Konventionen folgen, die oft als Pakete betrachtet werden.

In unserem Fall die Vermögenswerte Das Verzeichnis enthält alle zum Ausführen des Programms erforderlichen Elemente. Bei einigen Plugins können dies JavaScript, CSS, Bilder, Schriftarten usw. sein. In diesem Fall haben wir eine einzige JavaScript-Datei.

Der Abhängigkeitslader

Als Nächstes müssen wir eine Klasse einführen, die für das Laden der Abhängigkeiten für unser Projekt verantwortlich ist. Die einzige Abhängigkeit, die wir für dieses Plugin haben, ist die JavaScript-Datei, die wir gerade in die Vermögenswerte Verzeichnis.

Ein Teil der objektorientierten Programmierung stellt sicher, dass jede Klasse einen bestimmten Zweck hat. In diesem Fall ist die Klasse, die wir gerade einführen, dafür verantwortlich, JavaScript mit der WordPress-API zu laden.

Beginnen wir mit der Erstellung der Grundstruktur der Klasse:

Als Nächstes fügen wir eine Methode hinzu, die für das Einreihen von JavaScript gemäß der WordPress-API verantwortlich ist.
enqueue_scripts ();  / ** * Ruft die Front-End-Skripts auf, um die aktuellen Benutzerinformationen * über Ajax abzurufen. * * @access private * * @since 1.0.0 * / private Funktion 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')));  
Danach müssen wir die Funktionen übernehmen, die für die Bearbeitung der Ajax-Anfragen und das Bereitstellen von Antworten verantwortlich sind, und sie dann der Klasse hinzufügen. Da sie sich im Kontext einer Klasse befinden, müssen wir eine neue Funktion hinzufügen, die sie bei WordPress registriert.
Wir schaffen eine setup_ajax_handlers Funktion. Es sieht aus wie das:
Als Nächstes müssen wir die Funktionen tatsächlich in diese Klasse verschieben. Beachten Sie, dass die Funktionen, denen ursprünglich vorangestellt wurde _sa sind nicht mehr als solche gekennzeichnet. Da sie sich im Kontext der Klasse befinden, können wir das Präfix und auch den Unterstrich zugunsten von löschen Privatgelände Stichwort.
user_is_logged_in ($ user_id) && $ this-> user_exists ($ user_id)) wp_send_json_success (wp_json_encode (get_user_by ('id', $ user_id)));  private Funktion user_is_logged_in ($ user_id) $ is_logged_in = true; if (0 === $ user_id) wp_send_json_error (neuer WP_Error ('-2', 'Der Besucher ist derzeit nicht an der Site angemeldet.')); $ is_logged_in = false;  return $ is_logged_in;  private Funktion user_exists ($ user_id) $ user_exists = true; if (false === get_user_by ('id', $ user_id)) wp_send_json_error (neuer WP_Error ('-1', 'Es wurde kein Benutzer mit der angegebenen ID gefunden ['. $ user_id. ']')); $ user_exists = false;  Rückgabe von $ user_exists; 
Dann speichern wir diese Datei in einem beinhaltet Verzeichnis im Stammverzeichnis des Plugin-Verzeichnisses. Das beinhaltet In einem Verzeichnis befindet sich häufig Code, der im gesamten Projekt verwendet wird. Zu diesem Verzeichnis könnte man mehr sagen, aber das ist ein längerer Beitrag.
Die endgültige Version dieser Klasse sollte folgendermaßen aussehen:
enqueue_scripts ();  / ** * Ruft die Front-End-Skripts auf, um die aktuellen Benutzerinformationen * über Ajax abzurufen. * * @access private * * @since 1.0.0 * / private Funktion 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')));  / ** * Registriert die Callback-Funktionen, die für die Bereitstellung einer Antwort * auf die Einrichtung von Ajax-Anforderungen während des restlichen Plugins verantwortlich sind. * * @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'));  / ** * Ruft Informationen über den Benutzer ab, der aktuell an der Site angemeldet ist. * * Diese Funktion ist für den Aufruf über die Clientseite der * nach außen gerichteten Seite der Site vorgesehen. * * @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));  / ** * Bestimmt, ob ein Benutzer mit der angegebenen Benutzer-ID an der Site angemeldet ist. Wenn nicht, werden der folgende Fehlercode und die folgende Meldung an den Client zurückgegeben: * * -2: Der Besucher ist derzeit nicht an der Site angemeldet. * * @access private * @since 1.0.0 * * @param int $ user_id Die ID des aktuellen Benutzers. * * @return bool $ is_logged_in Gibt an, ob der aktuelle Benutzer angemeldet ist oder nicht. * / private Funktion user_is_logged_in ($ user_id) $ is_logged_in = true; if (0 === $ user_id) wp_send_json_error (neuer WP_Error ('-2', 'Der Besucher ist derzeit nicht an der Site angemeldet.')); $ is_logged_in = false;  return $ is_logged_in;  / ** * Bestimmt, ob ein Benutzer mit der angegebenen ID in der WordPress-Datenbank vorhanden ist. Wenn nicht, wird * der folgende Fehlercode und die folgende Meldung an den Client zurückgegeben: * * -1: Es wurde kein Benutzer mit der angegebenen ID [$ Benutzer-ID] gefunden. * * @access private * @since 1.0.0 * * @param int $ user_id Die ID des aktuellen Benutzers. * * @return bool $ user_exists Gibt an, ob der angegebene Benutzer vorhanden ist. * / private Funktion user_exists ($ user_id) $ user_exists = true; if (false === get_user_by ('id', $ user_id)) wp_send_json_error (neuer WP_Error ('-1', 'Es wurde kein Benutzer mit der angegebenen ID gefunden. $ user_exists = false;  Rückgabe von $ user_exists;  
Die Hauptklasse
Jetzt können wir die Hauptklasse für das Plugin schreiben. Diese bestimmte Klasse befindet sich im Stammverzeichnis des Plugin-Verzeichnisses und die grundlegende Struktur der Klasse sieht folgendermaßen aus:
Als Nächstes fügen wir einige Eigenschaften hinzu, die wir setzen, wenn die Klasse instanziiert wird:
Danach erstellen wir einen Konstruktor und eine Initialisierungsfunktion, mit der das Plugin in Bewegung gesetzt wird:
version = '1.0.0'; $ this-> loader = new Dependency_Loader ();  / ** * Initialisiert dieses Plugin und den Abhängigkeits-Loader, um * das für das Plugin erforderliche JavaScript zu enthalten. * * @access private * @since 1.0.0 * / public function initialize () $ this-> loader-> initialize (); $ this-> loader-> setup_ajax_handlers ();  
Im obigen Code legt der Konstruktor die Eigenschaften fest und instanziiert die Abhängigkeiten, die erforderlich sind, um das Plugin in Bewegung zu setzen.
Wann initialisieren aufgerufen wird, startet das Plugin und ruft die initialize-Methode für die zuvor in diesem Lernprogramm erstellte Abhängigkeitsklasse auf.
Das Bootstrap
Das letzte, was wir tun müssen, ist, die Hauptdatei, die wir haben, mit PHP zu verwenden umfassen Funktionalität, und stellen Sie sicher, dass es die erforderlichen PHP-Dateien kennt.
Danach müssen wir eine Methode definieren, mit der die Haupt-Plugin-Datei initialisiert und alles in Gang gesetzt wird.
initialisieren(); 
Die endgültige Version der Bootstrap-Datei sollte folgendermaßen aussehen:
initialisieren();  acme_start_plugin (); 
Zuerst prüft die Datei, ob direkt auf sie zugegriffen wird, indem geprüft wird, ob eine WordPress-Konstante definiert wurde. Wenn nicht, stoppt die Ausführung. 
Danach enthält es die verschiedenen Klassen, die wir in diesem Lernprogramm erstellt haben. Schließlich definiert es eine Funktion, die aufgerufen wird, wenn WordPress das Plugin lädt, das das Plugin startet, und alles in Bewegung setzt.
Fazit
Damit sind wir am Ende dieser zweiteiligen Serie. Hoffentlich haben Sie nicht nur einige der bewährten Vorgehensweisen für die Integration von Ajax in Ihre WordPress-Projekte kennen gelernt, sondern auch einiges darüber, wie sowohl prozeduraler als auch objektorientierter Code dokumentiert wird und wie unterschiedlich der Code ist.
In einem zukünftigen Beitrag kann ich einige der hier vorgestellten objektorientierten Konzepte noch einmal genauer betrachten und ausführlicher behandeln. Im Moment sehen Sie sich jedoch das Plugin über den GitHub-Link in der Seitenleiste dieser Seite an.
Denken Sie daran, Sie können alle meine Kurse und Tutorials auf meiner Profilseite abrufen und Sie können mir auf meinem Blog und / oder Twitter unter @tommcfarlin folgen, wo ich über Softwareentwicklung im Kontext von WordPress spreche.
Bitte zögern Sie nicht, Fragen oder Kommentare in den untenstehenden Feed zu schreiben, und ich möchte auf jeden einzelnen antworten. 



		
			
	   
	




Code