Cloudfront / ELB / Pagespeed = Mixed content

[Shane Marsh]

Hi Guys, 

Just wondering if anyone has any ideas how I can get mod_pagespeed to rewrite resources in HTTPS only?

We've made a lot of system changes recently and what I think is happening (not 100% sure), could be related to a problem with the x-forwarded-proto header because Cloudfront is the SSL termination point. Basically the Cloudfront CDN decrypts and forwards the request and correct x-forwarded-proto headers to an ELB (Elastic Load Balancer). The ELB will then natrually modify the headers because the connection was made on port 80 which means an "incorrect" proto header is being provided to Nginx. Nginx (pagespeed) sees it as an unsecured site and rewrites accordingly. 

Now I have managed to get the rest of the system working (wordpress) by overriding some fastcgi headers but Nginx still is not writing resources correctly. Is there any way to fix this? any help is appreciated.

Shane :)

[Longinos]

Hi

I have tested the site in the image and can´t see any mixed content, all url´s are https.

The only error in dev tools console is a 403 error (forbidden) in /wp-content/mu-plugins/SG-AWS/ajax.php url.

Maybe a transient error until CDN is updated?

[Shane Marsh]

Hi Longinos, 

Thanks for your reply. I have since added some nginx headers forcing the browser to upgrade requests which seems to have provided a crude work around as it removed the browser warnings but no the mixed content is in fact still there. 

If you look in common-sg.css for example it is possible to see a http example (highlighted below). These relate to a background image applied to the social icons in the right of each page.

Pagespeed has re-written it from:

background-image: url("../images/social.png");

to

background-image:url(http://www.blisshair.com/wp-content/plugins/SG-common-files/images/xsocial.png.pagespeed.ic.dW6hua5ydE.png);

[Longinos]

Hi Shane

Now I see you have Cloudfront in front of your site....

How this CDN work? is like CloudFlare a proxy cache too?

And with /?PageSpeedFilters=+debug I can see a bunch of 4xx prevent rewrite error message.

Can you post your config?

[Shane Marsh]

Hi 

Yes - Cloudfront is a reverse proxy cache. 

Ahh I did not notice the 4xx error. I'm going to have a look at that now - I have a feeling I know what that might be. I'd rather not post my full config in a public forum if that's at all possible. Is there any other way?

[Shane Marsh]

OK I have found the source of the 4xx issue...

The error logs were a big help. It seems some of the port 80 traffic is going via the wrong nginx location. "/var/html/wwwroot/public/wp-content/plugins/SG-common-files/css/effects.css" failed (2: No such file or directory), c

this should be: /var/html/wwwroot/salonguru/wp....

I will try and fix this and come back to you.

Shane :)

[Shane Marsh]

Morning Longinos, 

Thanks for your pointer yesterday with the +debug. We found a whole pile of issues relating to the Nginx configuration and cloudfront which I'm please to say we are resolved. We had default server blocks not configured correctly (leading to the 404's within pagespeed), Cloudfront was rewriting 404's with html and changing it to a 200 code (don't ask how that happened!) and we had some encoding issues relating to GZIP compression. Thanks again for your pointer.

Shane :)

[Longinos]

Hi Shane

Glad to hear this.