Mixed Content/Insecure Content SSL [duplicate] - wordpress

This question already has answers here:
Wordpress Mixed Content Error
(3 answers)
Closed 2 years ago.
I am currently having issues with the following
Mixed Content: The page at 'https://www.example.com/' was loaded over HTTPS, but requested an insecure stylesheet
This is a Wordpress website on a Centos server with httpd installed.
I have following virtual host setup in `http.conf:
NameVirtualHost *:80
NameVirtualHost *:443
<VirtualHost *:443>
DocumentRoot /var/www/html/example
ServerName www.example.com
ServerAlias example.com
SSLEngine on
SSLCACertificateFile /etc/httpd/conf/ssl.crt/intermediate.crt
SSLCertificateFile /etc/httpd/conf/ssl.crt/server.crt
SSLCertificateKeyFile /etc/httpd/conf/ssl.key/server.key
</VirtualHost>
<VirtualHost *:80>
ServerName www.example.com
ServerAlias example.com
Redirect / https://www.example.com/
</VirtualHost>
In my httpd.conf I have changed AllowOverride to all, so it looks like so:
<Directory "/var/www/html">
Options Indexes FollowSymLinks
AllowOverride All
Order allow,deny
Allow from all
</Directory>
I can confirm the htaccess is working as I am using iTheme security plugin and this is working as expected, also if I type some garbage in the htacces I get a server misconfiguration error as expected.
I have changed both the Wordpress URLs in the Dashboard to use https instead of http.
Once all of this was done, I was able to access the site over HTTP, be redirected to the HTTPS version of the site and see the site. However in the console I receive the error regarding mixed content and the padlock shield appears as yellow or red crossed as opposed to the desired green.
There are a few files that are an issue and I know for example I can change the URLs manually to use https as opposed to http. As I understand it, I can use change the URL to the below and this will simply adjust the link to the current protocol in use:
<img src="//www.example.com/image.jpg" />
I have also seen that if a resource is not available over https I can simply do the following:
https://example.com/imageserver?url=http://otherdomain.com/someimage.jpg&hash=abcdeafad
I am however, trying to find a way to fix all of these in one go using htaccess (something I am sure I have done before, but my snippets aren't working for me).
There are two main snippets I have used in an attempt to force everything over https, the first being:
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
#These Lines to force HTTPS
RewriteCond %{SERVER_PORT} !^443$
RewriteRule ^/(.*) https://%{HTTP_HOST}/$1 [NC,R=301,L]
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
The second is from Dave Walsh:
RewriteCond %{SERVER_PORT} 80
RewriteRule ^(.*)$ https://example.com/$1 [R,L]
However, neither seem to solve my issue. As a precaution I have restarted the httpd service after every change even htaccess changes which shouldn't require a restart, however the situation remains the same. Can anyone point me in the right direction?

The simplest solution is to replace all links manually using this solution below will save your time and its very straight forward.
The idea is to remove all (protocol HTTP and HTTPS) and leave them to use protocol relative URL https://stackoverflow.com/a/15146073/3599237
We can do this using the following code for index.php
<?php
//this lined added here
ob_start();
/**
* Front to the WordPress application. This file doesn't do anything, but loads
* wp-blog-header.php which does and tells WordPress to load the theme.
*
* #package WordPress
*/
/**
* Tells WordPress to load the WordPress theme and output it.
*
* #var bool
*/
define('WP_USE_THEMES', true);
/** Loads the WordPress Environment and Template */
require( dirname( __FILE__ ) . '/wp-blog-header.php' );
//and these lines also
$output = ob_get_contents();
ob_end_clean();
$output = str_replace(array("https://", "http://"), "//", $output);
echo str_replace('http:\/\/', "\/\/", $output);
Update: You can simply use Content Security Policy
The HTTP Content-Security-Policy (CSP) upgrade-insecure-requests
directive instructs user agents to treat all of a site's insecure URLs
(those served over HTTP) as though they have been replaced with secure
URLs (those served over HTTPS). This directive is intended for web
sites with large numbers of insecure legacy URLs that need to be
rewritten.
The upgrade-insecure-requests directive is evaluated before
block-all-mixed-content and if it is set, the latter is effectively a
no-op. It is recommended to set either directive, but not both, unless
you want to force HTTPS on older browsers that do not force it after a
redirect to HTTP.
Put below line into header section (header.php file).
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
For more information please read: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/upgrade-insecure-requests

Related

Editing htaccess file to redirect only content + Wordpress

I have created a subfolder in my webserver and installed wordpress there, it's working ok. And now i have created several subdomains. I need to show pages made in the wordpress installation in those subdomains but without changing the addess shown in the web browser address bar.
Options +FollowSymLinks
RewriteEngine on
RewriteOptions inherit
RewriteBase /
RewriteCond %{HTTP_HOST} ^sub.example.com$ [NC]
RewriteRule ^(.*)$ https://example.com/WPweb/index.php/pagetobeshown [R=301,NC,L,QSA]
with this i am being redirected and content is shown ok, but the address bar is changed.
is it possible to fix this so that address is not changed?
thanks in advance
To do this in .htaccess you would need to configure your server as a reverse proxy and proxy the request from the subdomain to the URL on the main domain. WordPress will then see this as a request for the main domain.
However, this does require some configuration in your server config to ensure the appropriate modules are loaded (mod_proxy, mod_proxy_http, etc.) and optionally to set ProxyPassReverse if WordPress should issue any redirects.
You can then use the P flag with mod_rewrite's RewriteRule to send the request through mod_proxy. For example:
RewriteCond %{HTTP_HOST} ^sub\.example\.com
RewriteRule ^$ https://example.com/WPweb/index.php/pagetobeshown [P]
This sends requests for https://sub.example.com/ only (ie. the document root of the subdomain) to the URL as stated. The NC, QSA and L flags are not required.
If you want to send any URL-path (as implied by your RewriteRule directive) to the URL on the target site then change the RewriteRule pattern from ^$ to ^ (simply remove the $). However, this many-to-one relationship is not necessarily good for SEO.
You will still need to modify the rel="canonical" link elements in the page to the appropriate URL in WordPress itself.
However, I'm sure there is a better, more WordPress-specific way to solve this. But WordPress would need to be configured to accept requests to the subdomain and the alternative URL-path.

Issues with SSL on EC2 behind ELB with nested WordPress blog

I'm migrating my website to AWS and have everything up and running on a Linux EC2 instance using ELB to enable SSL/TLS. Everything works fine (codeigniter, phpbb3, osticket) EXCEPT for issues with the WordPress portion of the site which resides in a subdirectory (e.g. www.mysite.com/blog). Portions of the blog are being accessed via http and therefore I am getting a "mixed content" message. I also get infinitely redirected when attempting to log in to the admin portion of the blog.
In order to get https working, I followed Amazon's instructions and added the recommended code to my httpd.conf file.
However, according to this blog (https://blog.lawrencemcdaniel.com/wordpress-aws-elb-ssl), WordPress doesn't work with that.
AMAZON RECOMMENDED CODE
<VirtualHost *:80>
RewriteEngine On
RewriteCond %{HTTP:X-Forwarded-Proto} =http
RewriteRule .* https://%{HTTP:Host}%{REQUEST_URI} [L,R=permanent]
</VirtualHost>
I figured there must be a way to apply the rewrite rule to all but one directory so that I can follow the WordPress specific instructions, but I can't seem to find any information on that. (I could just be a poor searcher!). I am open to any help resolving this matter.
----EDIT----
I have since tried the following (neither worked):
changed rewrite rule in httpd.conf to
RewriteRule !^blog https://%{HTTP_HOST}%{REQUEST_URI} [L,R=permanent]
and added
define('WP_HOME','https://www.example.com/blog');
define('WP_SITEURL','https://www.example.com/blog');
in wp config file.
removed VirtualHost code from httpd.conf file entirely and left WP_HOME and WP_SITEURL in wp config file
Ok. Here is what ended up working for me.
Use the Amazon recommended code in your httpd.conf file
<VirtualHost *:80>
RewriteEngine On
RewriteCond %{HTTP:X-Forwarded-Proto} =http
RewriteRule .* https://%{HTTP:Host}%{REQUEST_URI} [L,R=permanent]
</VirtualHost>
Add the following to your wp-config.php file
define('WP_HOME','https://www.yoursitename.com/yourdirectory');
define('WP_SITEURL','https://www.yoursitename.com/yourdirectory');
define('FORCE_SSL_ADMIN', true);
if (isset($_SERVER['HTTP_X_FORWARDED_PROTO']) && $_SERVER['HTTP_X_FORWARDED_PROTO'] == 'https')
$_SERVER['HTTPS'] = 'on';

Redirect a URL to another URL in Lighthouse/Wordpress

Previously I had a website implemented as a single page application on S3, and it had a page pointing to a list of tools. The URL for this list was: example.com/tool/<tool-name>
To expand the features of my website, I redid the DNS so that this old site is now sitting on a subdomain: tools.example.com/tool/<tool-name> (the new site, that is, example.com, is now on Lighthouse/Wordpress).
As there are still a bunch of links around the web referencing URLs in the tool list of the old site, I would like to write a redirect on Bitnami.
I've already asked for help on this and was told to do the following, but the redirect still doesn't seem to work when I go to example.com/tool/<tool-name>:
Modify /opt/bitnami/apps/wordpress/conf/httpd-app.conf by adding the following rule to the bottom of the file:
RewriteEngine on
RewriteCond %{REQUEST_URI} ^/tool/(.*)$
RewriteRule ^(.*)$ https://tools.example.com/tool/$1 [P,L]
sudo /opt/bitnami/ctlscript.sh apache restart
Is this pattern correct, or am I writing to the right file?
EDIT
I changed the redirect code above slightly to reflect feedback in the comments. It is redirecting to https not http and I changed the last bit of code to [P,L] from [R=301,L]
I just tested this change in the Bitnami solution and it worked properly, can you try it?
Remove the changes from the /opt/bitnami/apps/wordpress/conf/httpd-app.conf file
Edit the /opt/bitnami/apache2/conf/bitnami/bitnami.conf file and include the Rewrite* lines the VirtualHost of the port 80
...
<VirtualHost _default_:80>
DocumentRoot "/opt/bitnami/apache2/htdocs"
RewriteEngine on
RewriteCond %{REQUEST_URI} ^/tool/(.*)$
RewriteRule ^(.*)$ http://google.com [P,L]
...
You can also add those lines in the VirtualHost block of the port 443 in the same file.
Restart Apache
sudo /opt/bitnami/ctlscript.sh restart apache
As you can see, in my example, Apache is redirecting to google.com but you can redirect to any URL.

Solving the WordPress permalink issue on a virtual server

I have a variation on the old WordPress problem regarding permalinks failing (404 errors) when permalinks are set to anything other than 'plain' (where plain = http://example.com/?p=123 and a 'pretty' URL = http://example.com/sample-post/ - taking the URL content from the article title, for example).
For the first time I am starting a site on a virtual rather than dedicated server (Hetzner hosted), where I at least was able to easily read the httpd.conf settings and other server configurations.
To recap here, the problem is that neither WordPress nor the default server settings are usually ready for the URL rewriting that allows 'pretty' URLs out of the box. When confronted with this problem before, on dedicated servers, I would ensure that AllowOverride was set to 'all' or '[directory]' and then would put in an .htaccess file into the web's document root with this traditional solver:
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress
However this does not work on my Hetzner server. I put in the above code to an .htaccess file, set the permissions correctly and restarted. But the front page still shows links to the article lists, but the articles themselves all still throw that old 404 error.
The only access I have to the core server directives is drip-fed out in sections and radio-buttons etc via Plesk. I can't even open up the httpd settings read only to see how AllowOverride is set. Hetzner consider this a 'software problem', and therefore unsupported.
There is a section in Plesk where you can add additional Apache and Nginx directives (with duplicate boxes for http and https for Apache). I tried this in the Apache boxes and rebooted, but it didn't help (obviously this is not the actual URL I wrote):
<Directory "/var/www/vhosts/example.com/httpdocs/">
AllowOverride All
</Directory>
If anyone has any suggestions as to how I can get the usual rewrite fix in, in these circumstances, it would be much appreciated.
Okay, the problem was an obscure one, as it turned out. The virtual server was running Nginx on top of Apache, and I needed to install a plugin via Plesk which provides an 'ht access translator' for Nginx in Plesk. I pasted the rewrite directives there, they were 'translated' to Nginx-understandable commands, and the problem is solved.

CodeIgniter with Wordpress, https with http, on AWS with Load Balancer, Wordpress permalinks not working

I have the following setup. An Elastic Beanstalk Environment with a Load balancer. The web application, installed in the root, is using CodeIgniter. Wordpress is installed in the subdirectory /blog off the root. The CodeIgniter application requires https, but wordpress needs to be http. The load balancer is configured to listen on https and http, the instances behind the load balancer are http.
My first configuration to manage this is a .ebextensions file in the root. This file is deployed with the application to set a .conf to redirect all http traffic to https EXCEPT /blog. That file looks like this
files:
"/etc/httpd/conf.d/ssl_rewrite.conf":
mode: "000644"
owner: root
group: root
content: |
RewriteEngine On
<If "-n '%{HTTP:X-Forwarded-Proto}' && %{HTTP:X-Forwarded-Proto} != 'https'">
RewriteCond %{REQUEST_URI} !^/blog/
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R,L]
</If>
The next step in the configuration is an .htaccess file in the root. This controls the CI requests. It looks like this:
<FilesMatch "\.(ttf|otf|eot|woff|woff2|svg)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule>
</FilesMatch>
RewriteEngine on
RewriteBase /
RewriteCond $1 !^(index\.php|uploads|blog|assets|robots\.txt)
RewriteRule ^(.*)$ /index.php/$1 [L]
Options -Indexes
Finally in the /blog directory containing Wordpress I have this .htaccess
RewriteEngine On
RewriteBase /blog/
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /blog/index.php [L]
The CI app works fine, and http requests are sent to https correctly. The /blog root directory itself (i.e. the 'home page' such as http://example.com/blog) also works fine. Even the /blog/subdirectories such as http://example.com/blog/wp-admin/options-general.php work fine. What does not work are permalinks such as http://example.com/blog/my-article (presumably because they are not real files). If I change the permalinks setting to remove the permalinks and allow post urls to look like this http://example.com/blog/?p=123 that also works. Only permalinks do not work.
An additional problem (which should be obvious) is that if anyone tries to access the blog with https directly, they will get a mixed content warning and broken links. So I also need to redirect https://example.com/blog/* back to http.
I am sure this setup is over complicated, and I could remove both .htaccess files and place all my settings in the .ebextensions config file however I am not sure how to do that. I have been piecing together several solutions such as this and this for days and each solution creates another problem.
For anyone going to suggest that Wordpress should be https as well, I am not opposed to that, however I have been down that road for over a week with no good solution that allows me to maintain non-ssl test and development environments that will deploy to AWS properly without messy plugins, files that change in production which I cannot easily port back to test and dev, and host of other https/wordpress problems. The simplest solution seems to be running Wordpress http. I'm also open to another CMS to replace Wordpress. Bottom line is I just want a blog to live under CI on AWS, in https/http, play nice together, and deploy easily.
It should also be noted that in dev and test, everything works fine. The only significant difference between dev and test is the .ebextensions file and the https redirect.
Any help is appreciated.
Take a look on this video:
AWS solution
you need to use the correct header so that does not happend, especially if your load balancer is not using secure connections between the instance and the load balancer

Resources