Zurück zum Blog

Proxying von Mediendateien in einer lokalen WordPress-Entwicklungsumgebung mit DDEV

2023-07-043 Min. Lesezeit

Das Proxying von Mediendateien in einer lokalen WordPress-Entwicklungsumgebung ist eine wesentliche Fähigkeit für Entwickler, die sicherstellen möchten, dass ihre lokale Website den Inhalt und die Funktionalität der Live-Produktionswebsite widerspiegelt.

Das Herunterladen aller Mediendateien in Ihre lokale Umgebung ist möglicherweise nicht die beste Lösung, insbesondere wenn die Produktionswebsite eine große Medienbibliothek hat. Stattdessen können Sie Ihre lokale Entwicklungsumgebung so einrichten, dass Medienanfragen an den Produktionsserver weitergeleitet werden. Für die lokale Entwicklung verwende ich DDEV, ein Open-Source-Tool, das es extrem einfach macht, lokale PHP-Entwicklungsumgebungen innerhalb von Minuten einzurichten. In diesem Blogbeitrag teile ich eine Lösung, die ich für das Proxying von Mediendateien in einer lokalen DDEV-Umgebung ohne Plugin nützlich fand.

Das Problem

Bei der lokalen Arbeit mit WordPress mit DDEV benötigte ich eine Möglichkeit, Mediendateien anzuzeigen, ohne sie tatsächlich in meine lokale Umgebung herunterzuladen. Mein Ziel war es, dass WordPress diese Dateien vom Produktionsserver lädt, wann immer sie angefordert werden.

Die Lösung

Dies können wir erreichen, indem wir benutzerdefinierte Funktionen zur Datei functions.php unseres WordPress-Themes hinzufügen. Diese Funktionen ändern die URLs für Anhänge und Thumbnails so, dass sie auf den Produktionsserver zeigen.

Hier ist der Code-Schnipsel, den Sie zu Ihrer functions.php-Datei hinzufügen können:

if ($_SERVER['HTTP_HOST'] == 'your-local-ddev-url') {

    function replace_domain($url) {
        return str_replace('https://your-local-ddev-url', 'https://your-production-url', $url);
    }

    function rewrite_attachment_url($url) {
        return replace_domain($url);
    }
    add_filter('wp_get_attachment_url', 'rewrite_attachment_url');

    function rewrite_thumbnail_attributes($attr, $attachment, $size) {
        if (isset($attr['srcset'])) {
            $attr['srcset'] = replace_domain($attr['srcset']);
        }
        return $attr;
    }
    add_filter('wp_get_attachment_image_attributes', 'rewrite_thumbnail_attributes', 10, 3);

}

Ersetzen Sie your-local-ddev-url durch die URL Ihrer lokalen DDEV-Umgebung und your-production-url durch die URL Ihres Produktionsservers.

Wie es funktioniert

  • Die Funktion replace_domain nimmt eine URL als Eingabe und ersetzt die lokale Domäne durch die Produktionsdomäne.
  • Die Funktion rewrite_attachment_url verwendet den Filter wp_get_attachment_url, um die URLs von Anhangsdateien zu ändern.
  • Die Funktion rewrite_thumbnail_attributes ändert das Attribut srcset für Thumbnail-Bilder. Dies ist nützlich, wenn Ihr Theme responsive Bilder mit verschiedenen Größen verwendet.

DDEV: Ein großartiges Werkzeug für die lokale Entwicklung

DDEV ist ein Open-Source-Tool, das Ihnen hilft, schnell lokale PHP-Entwicklungsumgebungen mit Docker einzurichten. Es ist unglaublich einfach zu bedienen und kann Ihren Entwicklungs-Workflow erheblich beschleunigen. Durch die Verwendung von DDEV für Ihre lokale WordPress-Entwicklung können Sie sicherstellen, dass Ihre Umgebung mit Ihrem Produktionsserver konsistent ist, was entscheidend ist, um das Problem „Es funktioniert auf meiner Maschine“ zu vermeiden.

Wenn Sie neu bei DDEV sind und wissen möchten, wie Sie es für WordPress und Drupal einrichten, habe ich einen Leitfaden, der Sie durch den Prozess der Einrichtung einer lokalen Website mit DDEV führt. Schauen Sie sich meinen vorherigen Beitrag an: How to Set Up a WordPress and Drupal Local Site with DDEV.

Fazit

Durch das Proxying von Mediendateien von einem Produktionsserver können Sie Speicherplatz und Zeit in Ihrer lokalen Entwicklungsumgebung sparen. Diese Lösung ist besonders nützlich bei der Verwendung von DDEV für große WordPress-Websites mit umfangreichen Medienbibliotheken. Achten Sie immer auf die zusätzliche Last, die dies auf den Produktionsserver ausüben könnte, und stellen Sie sicher, dass Ihre Produktionsumgebung den zusätzlichen Datenverkehr bewältigen kann. Viel Spaß beim Codieren!