SSL termination Nginx + Backend Nginx not working (get mixed content result in HTTPS)

Question

I set up 2 nginx webserver from this tutorial https://www.digitalocean.com/community/tutorials/how-to-set-up-nginx-load-balancing-with-ssl-termination

The problem is, a simple one test php page via SSL is loaded nicely, but when I try to install some PHP Application like Moodle, I got mixed content warning and the UI is broken.. (some in HTTP mode, some in HTTPS mode, etc...)

How can I get all content loaded in all HTTPS (fix the mixed content thing)?

Here is the frontend SSL Nginx config:

# File: \etc\nginx\sites-available\main.big.vm

upstream mainBigVm {
    server main.big.vm:80;
}

server {
    listen 80;

    listen 443 ssl;
    ssl on;
    ssl_certificate         /etc/nginx/cert.crt;
    ssl_certificate_key     /etc/nginx/cert.key;

    server_name main.big.vm;

    location / {
        proxy_pass http://mainBigVm;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}

And here is the backend Nginx config (in server main.big.vm):

# File: \etc\nginx\sites-available\default

server {
    listen 80 default_server;
    listen [::]:80 default_server;

    root /var/www/html;

    index index.html index.htm index.nginx-debian.html index.php;

    server_name _;

    location / {
        try_files $uri $uri/ =404;
    }

    location ~ \.php$ {
        fastcgi_pass unix:/var/run/php5217-fpm.sock;
        fastcgi_index index.php;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        include fastcgi_params;
    }
}

update 170430-1

I've tried the suggested config in front-end, but still not work.

upstream mainBigVm {
    server main.big.vm:80;
}

#suggestion
server {
    listen 80;
    location / {
        return 301 https://$host$request_uri;
    }
}

server {
    listen 80;

    listen 443 ssl;
    ssl on;
    ssl_certificate         /etc/nginx/cert.crt;
    ssl_certificate_key     /etc/nginx/cert.key;

    server_name main.big.vm;

    location / {
        proxy_pass http://mainBigVm;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}

update 170501-1

I noticed a strange behavior too. If I type the HTTPS URL with ending slash, the URL is loaded, but if I type without the ending slash, somehow the URL is converted to HTTP with auto added end-slash

You probably need to configure the application (Moodle) to use https. It's probably generating http links to the static resources, it needs to generate them as https. — Tim, Apr 30 '17 at 18:52

score 2 · Accepted Answer · edited May 23 '17 at 12:41

Finally I got this working. I found my old notes about SSL nginx-reverse proxy with Apache need this config on

# file \apps\httpd\2225\conf.d\nginx-reverse-proxy.conf

# Make sure mod_env is loaded.
# This make sure variable _SERVER[HTTPS] is set if using Nginx as reverse proxy for Apache
# This will help some application to work, since many apps using _SERVER[HTTPS] to work with SSL
# Make sure Nginx has config: proxy_set_header X-Forwarded-Proto $scheme;

SetEnvIf X-Forwarded-Proto https HTTPS=on

Since I'm using Nginx backend, I got this config to test:

location ~ \.php$ {
    fastcgi_pass unix:/var/run/php5217-fpm.sock;
    fastcgi_index index.php;
    fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    include fastcgi_params;
    fastcgi_param HTTPS 'on'; # I tested by adding this line to check
}

And It works, now my Moodle is loaded nicely in HTTPS Front-End (css, js, images, etc...). Now I just need a Nginx config similar to Apache's SetEnvIf X-Forwarded-Proto https HTTPS=on OR make sure all of my backend runs on SSL everytime

Update 170502: I got this example for this here https://stackoverflow.com/questions/4848438/fastcgi-application-behind-nginx-is-unable-to-detect-that-https-secure-connectio

score 0 · Answer 2 · answered Apr 30 '17 at 04:18

0

In your front end listen on 80 then immediately redirect that to permanently 443

server { listen 80; location / { return 301 https://$host$request_uri; } }

answered Apr 30 '17 at 04:18

Alok Yadav

31
3

I have updated my question (update 173004-1), with your provided solution, but still not work – Bonn Apr 30 '17 at 14:42
Set listen on 80 only once remove from main server block – Alok Yadav Apr 30 '17 at 16:49
yes Ive tried that too, still doesn't work. I also noticed weird behavior in my updated post update 170501-1 – Bonn Apr 30 '17 at 22:12

score 0 · Answer 3 · answered May 01 '17 at 10:20

Scan the HTML source code of the page giving the mixed content warning and see which resources are loaded through HTTP instead of HTTPS. If they are outside resources, you are out of luck. If they are inside resources, since the HTML page is generated by your PHP code, see what you can do in your PHP software (some configuration maybe?) to make sure that all images/CSS/scripts/etc… are using the https scheme and not the http one.

SSL termination Nginx + Backend Nginx not working (get mixed content result in HTTPS)

3 Answers3