Serverseitiges Rendering von React.js mit PHP

Lesezeit: 3 Minuten

Benutzeravatar von Yoav Kadosh
Yoav Kadosh

Ich möchte Themes/Plugins entwickeln für WordPress bezogen auf React. Um es suchmaschinenfreundlich zu machen, muss es anfänglich auf dem Server gerendert werden (serverseitiges Rendering).

Die einzige Möglichkeit, dies zu tun, ist meines Wissens nach zu verwenden reagieren-php-v8jswas die erfordert PECL V8js-Erweiterung. Dies ist ein Problem, da ich keine Kontrolle über die Plattform habe, auf der diese Themen/Plugins ausgeführt werden.

Gibt es eine Möglichkeit zu machen React und WordPress zusammenarbeiten, ohne zusätzliche Erweiterungen installieren zu müssen? Vielleicht durch Bauen/Kompilieren React Dateien hinein PHP?

  • Können Sie erklären, was Sie mit „Ich habe keine Kontrolle über die Plattform“ meinen? Ich nehme an, Sie meinen, Sie haben keinen Zugriff oder keine Berechtigung, Installationen auf dem Server von Dingen wie V8js oder Nodejs durchzuführen, richtig? Es gibt ein paar Lösungen, mit denen ich vertraut bin, aber sie beinhalten die Installation der einen oder anderen.

    – PeterG

    7. Februar 2016 um 5:52 Uhr

  • Das ist richtig – ich kann keine PHP-Erweiterung (z. B. v8js) oder irgendetwas wie Node.js installieren. Diese WordPress-Plugins/-Themen werden höchstwahrscheinlich auf gemeinsam genutzten Hosting-Plattformen ausgeführt, die dies nicht zulassen.

    – Yoav Kadosh

    7. Februar 2016 um 8:03 Uhr

  • In diesem Fall besteht der einzige Ansatz, der mir einfällt, darin, nodejs oder V8 auf einem separaten Server einzurichten und Ihren Reaktionscode nur für das serverseitige Rendern aufzurufen. Möglicherweise müssen Sie sich mit einigen CORS-Problemen befassen, aber theoretisch sehe ich nicht ein, warum dies nicht funktionieren würde (beachten Sie, dass ich das nicht selbst ausprobiert habe).

    – PeterG

    7. Februar 2016 um 20:13 Uhr


Es gibt einen Artikel, der beschreibt, wie das geht:

https://sebastiandedeyne.com/server-side-rendering-javascript-from-php/

Aber es ist ein ziemlich komplexes Setup und es erfordert die Verwendung von Composer. Das kann in WordPress-Projekten schwierig sein, da WordPress dazu neigt, die moderne PHP-Architektur vollständig zu meiden.

Wenn Sie nach einer Bibliothek suchen, die bei SSR in PHP hilft:

https://github.com/spatie/server-side-rendering

Viel Glück dabei.

Wenn Sie möchten, dass Ihre Inhalte von Suchmaschinen ohne js indiziert werden, können Sie Ihre minimalen Inhalte mit WordPress drucken, nur das Nötigste + entscheidende Meta-Tags, vielleicht einen Anfangszustand lokalisieren, damit Ihre Reaktions-App booten kann. Ein Bare-Bone-Thema wie z http://underscores.me/ würde reichen. Wenn js verfügbar ist, können Sie Ihren gesamten von WordPress generierten Inhalt durch React-Inhalte ersetzen.

Idealerweise erstellt React die Inhalte für Sie. Aber es ist schwierig, bis wir sehen können, dass die Erweiterung nodejs / PECL V8js überall verfügbar ist.

Wenn Sie zumindest nodejs installieren und einen Knotenprozess starten können, sollte es in Ordnung sein, wenn auch nicht so einfach.

Sie müssten eine SSR-Version Ihrer Assets generieren und sie in einem Node-Prozess verwenden, der einen Socket abhören würde, um das HTML-Ergebnis zu schreiben.

In Ihrem Controller können Sie einen Socket zu Ihrem Node-Prozess erstellen (etwas wie stream_socket_client(…)) und dann eine Dummy-Funktion, die als Javascript-String geschrieben ist, an diesen Socket senden (etwas wie stream_socket_sendto($sock, “getResultForMyWidget(someParams ){…}”)). Diese Funktion würde im Knotenprozess ausgewertet, der die Antwort an den Controller zurückgibt (die HTML-Antwort als ReactDOMServer.renderToString von der Komponente, die Sie rendern möchten).

Das ist es für das große Ganze.

Es gibt ein Symfony-Plugin, das es sehr anschaulich darstellt (siehe dieses github) und wird mit einem Dummy-Serverknotenprozess geliefert, um zu veranschaulichen, wie er das Socket-Listening und die Auswertung der eingehenden Funktion handhabt und das HTML-Ergebnis zurückgibt. Siehe auch das Beispiel in der Sandbox für ein größeres Bild und eine detaillierte Implementierung. Sie sollten in der Lage sein, es an WordPress anzupassen.

1405160cookie-checkServerseitiges Rendering von React.js mit PHP

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy