Proxy Media-bestanden in een Lokale WordPress Ontwikkelomgeving met DDEV
Het proxyen van media-bestanden in een lokale WordPress ontwikkelomgeving is een essentiële vaardigheid voor ontwikkelaars die ervoor willen zorgen dat hun lokale site de inhoud en functionaliteit van de live productieomgeving weerspiegelt.
Het downloaden van alle media-bestanden naar je lokale omgeving is mogelijk niet de beste oplossing, vooral als de productieomgeving een grote mediabibliotheek heeft. In plaats daarvan kun je je lokale ontwikkelomgeving zo instellen dat mediaverzoeken worden geproxy'd naar de productieserver. Voor lokale ontwikkeling gebruik ik DDEV, een open-source tool die het kinderlijk eenvoudig maakt om lokale PHP ontwikkelomgevingen binnen enkele minuten op te zetten. In deze blogpost deel ik een oplossing die ik nuttig vond voor het proxyen van media-bestanden in een lokale DDEV-omgeving zonder een plugin te gebruiken.
Het Probleem
Tijdens het lokaal werken met WordPress met DDEV, had ik een manier nodig om media-bestanden weer te geven zonder ze daadwerkelijk naar mijn lokale omgeving te downloaden. Mijn doel was om WordPress deze bestanden van de productieserver te laten laden wanneer ze worden opgevraagd.
De Oplossing
Dit kunnen we bereiken door aangepaste functies toe te voegen aan het functions.php-bestand van je WordPress-thema. Deze functies zullen de URL's voor bijlagen en miniaturen wijzigen om naar de productieserver te verwijzen.
Hier is het codefragment dat je kunt toevoegen aan je functions.php-bestand:
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);
}
Vervang your-local-ddev-url door de URL van je lokale DDEV-omgeving en your-production-url door de URL van je productieserver.
Hoe het Werkt
- De
replace_domain-functie neemt een URL als invoer en vervangt het lokale domein door het productiedomein. - De
rewrite_attachment_url-functie gebruikt hetwp_get_attachment_url-filter om de URL's van bijlagebestanden te wijzigen. - De
rewrite_thumbnail_attributes-functie wijzigt hetsrcset-attribuut voor miniatuurafbeeldingen. Dit is handig wanneer je thema responsieve afbeeldingen met verschillende formaten gebruikt.
DDEV: Een Geweldige Tool voor Lokale Ontwikkeling
DDEV is een open-source tool die je helpt bij het snel opzetten van lokale PHP ontwikkelomgevingen met Docker. Het is ongelooflijk eenvoudig te gebruiken en kan je ontwikkelworkflow drastisch versnellen. Door DDEV te gebruiken voor je lokale WordPress-ontwikkeling, kun je ervoor zorgen dat je omgeving consistent is met je productieserver, wat cruciaal is om het 'het werkt op mijn machine'-probleem te voorkomen.
Als je nieuw bent met DDEV en wilt weten hoe je het voor WordPress en Drupal instelt, heb ik een gids die je door het proces van het opzetten van een lokale site met DDEV leidt. Bekijk mijn vorige post: Hoe een Lokale WordPress en Drupal Site Op te Zetten met DDEV.
Conclusie
Door media-bestanden van een productieserver te proxyen, kun je ruimte en tijd besparen in je lokale ontwikkelomgeving. Deze oplossing is vooral nuttig bij het gebruik van DDEV voor grote WordPress-sites met uitgebreide mediabibliotheken. Houd altijd rekening met de belasting die dit kan toevoegen aan de productieserver en zorg ervoor dat je productieomgeving het extra verkeer aankan. Veel codeerplezier!