I am using a custom PHP project with DDEV. The project uses NGINX as a server with two different doc roots: One doc root hosts the website code, the second is used as a CDN. The doc roots are accessible with two urls
- site.ddev.site
- cdn.site.ddev.site
When the main domain requests images via https from cdn.site.ddev.site I receive an error in the Chrome console:
Mixed Content: The page at 'site.ddev.site' was loaded over HTTPS, but requested an insecure image 'http://cdn.site.ddev.site/imgXYZ.jpg'. This request has been blocked; the content must be served over HTTPS.
I have read that the ddev-router acts as a reverse proxy that terminates SSL and passes along requests on port 80 to the web container which explains the mixed content error.
I tried a rewrite:
server {
listen 80;
server_name cdn.site.ddev.site;
return 301 https://cdn.site.ddev.site$request_uri;
}
But it does not work and loops infinitely for the same reasons that ddev routes all requests to port 80.
How can I fix it? Is there kind of a proxy NGINX setting I can use to force HTTPS?
Edit 1:
There is a thumbnail related functionality that rewrites the url if a thumb img is missing so a new one will be generated via PHP. From that rewrite on https is missing and requests are made with http. Still I am not sure how the correct rewrite should look. The simplified server block:
server {
listen 80;
listen 443 ssl http2;
location ~* /img/thumbs/.*.\.(?:jpe?g|png|webp)$ {
try_files $uri @thumb;
}
location @thumb {
rewrite ^/img/thumbs/(.*) /shots/thumb/$1 redirect;
}
}
Edit 2:
If i put this in the server block (not into location) it seems to work:
add_header 'Content-Security-Policy' 'upgrade-insecure-requests';
It's my workaround for now.