We help IT Professionals succeed at work.

How to resolve Mixed content error with https and reverse proxy on nginx?

neal wang
neal wang asked
on
How do I resolve "Mixed Content: The page at 'https://win.interstagebpm.com/social/' was loaded over a secure connection, but contains a form that targets an insecure endpoint 'http://win.interstagebpm.com/social/index.php/login'. This endpoint should be made available over a secure connection." ?

I'm trying to get the php forms to load but they aren't, what am I missing?


I'm using nginx to reverse proxy apache which is hosting the social engine platform on 8080.

Apache is running port 80 and there is a https certificate as well

Here is my nginx file:

server {
    server_name  win.interstagebpm.com;

    #charset koi8-r;
    #access_log  /var/log/nginx/host.access.log  main;

    location / {
        #root   /usr/share/nginx/html; default page.. remove hash and this comment after ; 
        root    /var/www/html;
        index  index.php index.html index.htm;
        try_files $uri $uri/ =404;
    }

    location /aa/ {
        proxy_cookie_path / /aa/;
    proxy_pass http://win.interstagebpm.com:49950/aa/;
    }


     location ~ \.php$ {
        
        proxy_set_header X-Real-IP  $remote_addr;
        proxy_set_header X-Forwarded-For $remote_addr;
        proxy_set_header Host $host;
        proxy_pass http://127.0.0.1:8008;
	proxy_redirect http:// https://;
         }

         location ~ /\.ht {
                deny all;
        }
    #error_page  404              /404.html;

    # redirect server error pages to the static page /50x.html
    #
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }

    # proxy the PHP scripts to Apache listening on 127.0.0.1:80
    #
    #location ~ \.php$ {
    #    proxy_pass   http://127.0.0.1;
    #}

    # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
    #
    #location ~ \.php$ {
    #    root           html;
    #    fastcgi_pass   127.0.0.1:9000;
    #    fastcgi_index  index.php;
    #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
    #    include        fastcgi_params;
    #}

    # deny access to .htaccess files, if Apache's document root
    # concurs with nginx's one
    #
    #location ~ /\.ht {
    #    deny  all;
    #}

   
    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/win.interstagebpm.com/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/win.interstagebpm.com/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot

}

server {
    if ($host = win.interstagebpm.com) {
        return 301 https://$host$request_uri;
    } # managed by Certbot


    listen       80;
    server_name  win.interstagebpm.com;
    return 404; # managed by Certbot



}

Open in new window

Comment
Watch Question

Most Valuable Expert 2018
Distinguished Expert 2019

Commented:
Hi,

Your mixed content error os down to the fact that you're trying to load all of your CSS and Scripts over a non-secure request. Right at the top of your page, you have this line:

<base href="http://win.interstagebpm.com/social/" />

Change that to point to the https version of your site:

<base href="https://win.interstagebpm.com/social/" />

Now all your scripts will be loaded over https and you won't get the mixed content error.

Author

Commented:
The php doesn't load up, how do I get it to load?
Most Valuable Expert 2018
Distinguished Expert 2019

Commented:
What do mean the PHP doesn't load up. Your site was loading fine before, just not over https. What else have you changed other than the base url?

Author

Commented:
http://win.interstagebpm.com:8008/social/index.php  has the php social engine load up

https://win.interstagebpm.com/social/ does not

I'm trying to not expose port 8008 to the internet hence the reverse proxy
Most Valuable Expert 2018
Distinguished Expert 2019

Commented:
Sorry - I'm still confused.

The source code of your 2 sites is exactly the same, so clearly the PHP is loading up fine. The reason one site is working and one isn't is because you're trying to load your CSS, JS & Images over a non-secure connection, so those files won't get loaded. Change the base href to make sure you're loading from https and try it again.

Author

Commented:
Change the base href to make sure you're loading from https and try it again.

How do I do this?
Most Valuable Expert 2018
Distinguished Expert 2019

Commented:
Have a read through my first comment as that explains what you need to do.

Author

Commented:
I meant do I edit the nginx file? Do I edit the socialengine files?

Do I edit the web page file directly?
Most Valuable Expert 2018
Distinguished Expert 2019

Commented:
You'll need to edit whichever file creates that line in your HTML. It's unlikely to be anything to do with nginx. I don't know how you're creating your files so I can't tell you which one to edit

Author

Commented:
The website loads fine directly from apache on port 8008 but when I try to reverse proxy through nginx I get the issue, I was hoping the issue would be resolved due to some configuration in my nginx file

I'm loading social engine php

this is the contents of the index.php


// Check version
if (version_compare(phpversion(), '7.2', '<')) {
    printf('PHP 7.2 is required, you have %s', phpversion());
    exit(1);
}

// Constants
define('_ENGINE_R_BASE', dirname($_SERVER['SCRIPT_NAME']));
define('_ENGINE_R_FILE', $_SERVER['SCRIPT_NAME']);

include dirname(__FILE__)
    . DIRECTORY_SEPARATOR.
    'boot.php';

$boot = new Engine_Boot(dirname(__FILE__));
$boot->boot();

Open in new window

Most Valuable Expert 2018
Distinguished Expert 2019

Commented:
It's not the Port that's the issue - it's the httpS part of your request.

When you're loading it through port 8008, you're not using a secure connection, so everything works fine. When you load it without that port you're loading it through a secure connection.

Your page is trying to load data from a non-secure place because you have your base href set to a non-secure location. Load up your non-working page and look at the source in your Browser (Ctrl + U). You'll see the 3rd line of your source clearly shows that you have the base href set to a non-secure location - that's what you need to change.

You have 2 choices here - set the base href to the correct location OR don't serve it through HTTPS

I don't know the Social Engine Software so I can't tell you where to change the base href, but at some point you will have had to set it, either directly or through a config somewhere. You'll need to dig around and see where and how you set up your site's URL and change it from http://win.interstagebpm.com/social/ to https://win.interstagebpm.com/social/

Author

Commented:

so no way to reverse proxy the php site through https?

Most Valuable Expert 2018
Distinguished Expert 2019

Commented:
Hey,

You seem to be focussing on proxying your site, but like I've said a few times now - that's not your problem.

Your site is being served from a secure connection. You're then explicitly telling your site to load stylesheets, images and javascript from a non-secure connection. That just won't work. You need to tell your site to load it's data from the secure connection and you do that by simply changing the base href setting in your file.

The problem is not with your server settings, or your PHP or anything else - it's simply down to the fact that you're trying to load non-secure data into a secure site (i.e Mixed Content). The only reason that's happening is because you're explicitly telling it to do that.

Author

Commented:

the social engine platform can only be run on apache... I've seen articles that it can run through nginx..  I guess I'll try that?


My manager wants me to go through https, and I'm not able to find the locaiton of the php files that let's me change the base url, what should I do?

Most Valuable Expert 2018
Distinguished Expert 2019

Commented:
Ni Neal,

Both Apache and Nginx can run PHP site just fine, so you should be able to use whichever you prefer, but it won't solve your problem.

You'll need to learn how your application works and how to change settings. If you can't do that, then you're not going to be to manage your site in any meaningful way. At some point, you will have set up the site's address. You just need to remember how you did that and change it to use https.

It may be that you need to speak with the author of the software.
nociSoftware Engineer
Distinguished Expert 2019

Commented:

Read this again: https://www.experts-exchange.com/questions/29171572/How-to-resolve-Mixed-content-error-with-https-and-reverse-proxy-on-nginx.html#a43023329

(don't focus on nginx,apache, proxying, ...) just the above link.


Search the .php & other files that mention a base href...

and verify if it comes from a files or if it comes form a database somewhere... then follwo through until you find the source...

Change the http://   into https://.. (add the S)  and check again.

David FavorFractional CTO
Distinguished Expert 2019

Commented:
Tip: Try starting simple.

1) Get HTTPS + HTTP2 + Brotli compression working first.

2) Which your native Web server (like Apache).

3) Serving an empty directory.

4) Then go back + add in a proxy if required.
David FavorFractional CTO
Distinguished Expert 2019

Commented:
Note: Be sure to load test your application with + without a proxy. You may find adding in a proxy slows performance to an unacceptably slow speed.

Author

Commented:

It works on apache, the issue is reverse proxy through nginx with a signed https certificate

nociSoftware Engineer
Distinguished Expert 2019

Commented:

Is HSTS involved somewhere then only one access to https will ensure future https regardless of http... and it will work with nginx as well...

i am not sure how browsers handle redirects..., if redirects are used and browser doesn't verify the intermediate then there is a gap...

Which may not be seen due to .htaccess being used by apache...


Most Valuable Expert 2018
Distinguished Expert 2019

Commented:
I don't understand why you keep insisting that this is a PHP or Proxy issue. If it was PHP, then your code wouldn't generate anything - it does. Look at the source of your page after you've loaded it up - everything is there. PHP has done it's job. It's finished. It has nothing to do with PHP. There's only so many way I can tell you this.

If you insist on loading your page over SSL and your content over a non-secure connection, then you will continue to have mixed-content problems.

Unfortuntately, I can't help you anymore - I've explained what your problem is several times, but you keep going back to a PHP and Proxies.

Good luck with it.
nociSoftware Engineer
Distinguished Expert 2019

Commented:

All HTTP content can be changed in transit.. So on your high secure site, you can still be hijacked by the images you let to be downloaded using http... (by injecting javascript instead f.e.) so there is no "low value unprotected content" UNLESS everything is "low value unprotected content" ... 

When something needs to be done in https, then EVERYTHING from that point on needs https... and its associated protection like HSTS, actually validating the certificates  etc.   Selfsigned certificates have no added value except for the people that 100% TRUST the issuer (that is a personal trust).

Author

Commented:

I need to check .htaccess files?

Most Valuable Expert 2018
Distinguished Expert 2019

Commented:
Nope!
nociSoftware Engineer
Distinguished Expert 2019

Commented:

.htaccess is not used with nginx, it is with apache.  so for the original question it is irrelevant. 


Author

Commented:

I guess I can't reverse proxy this website through nginx https. I'm not able to edit the php website itself

  guess I can't reverse proxy this website through nginx https. I'm not able to edit the php website itself