Mixed Content Page: requested an insecure stylesheet error

mixed content: the page at was loaded over https, but requested an insecure resource
bypass mixed content error
was loaded over https, but requested an insecure stylesheet
allow http content on https page
meta http-equiv=content-security-policy'' content=upgrade-insecure-requests
how to fix a website with blocked mixed content
mixed content: the page at was loaded over https, but requested an insecure xmlhttprequest endpoint
allow mixed content jquery

I have a website working on it. when i open any page with http:// protocol, every thing is loaded correctly, but when i try to load the page with https protocol, the page loaded but without css and javascript file. The console shows the following errors.

Mixed Content: The page at 'https://www.example.com/index.php?main_page=login' was loaded over HTTPS, but requested an insecure stylesheet 'http://www.example.com/site_map.html'. This request has been blocked; the content must be served over HTTPS.

I figured that the problem is the browser can not load any css files when it requested by https protocol.
The problem is with htaccess file, because when i removed it, the css files loaded correctly.

The page and css files loaded to browser with https in their urls like this

<link rel="stylesheet" type="text/css" href="https://www.example.com/includes/templates/classic/css/style1.css">
<link rel="stylesheet" type="text/css" href="https://www.example.com/includes/templates/classic/css/style2.css">

when the browser tries to load the css files, it is redirected to

http://www.example.com/site_map.html  

How can i make htaccess allow https to open the css and js files in a specific folder? Thanks

UPDATE The htaccess file content

RewriteEngine On
RewriteCond %{SERVER_PORT} ^443$
RewriteRule (.*) http://www.example.com/$1 
###############################################################################
# Common directives
###############################################################################
# NOTE: Replace /shop/ with the relative web path of your catalog in the "Rewrite Base" line below:

Options +FollowSymLinks
RewriteEngine on

RewriteCond %{HTTP_HOST} ^example\.com$ [NC]
RewriteRule ^(.*)$ http://www.example.com/$1 [R=301,L]

RewriteCond %{THE_REQUEST} ^[A-Z]{3,9}\ /index\.php\ HTTP/
RewriteRule ^index\.php$ http://www.example.com/ [R=301,L]

#RewriteBase /

###############################################################################
# Start Ultimate SEO URLs
###############################################################################

# Original (unchanged) URL formats
RewriteRule ^(.*)-p-([0-9]+)(.*)$ index\.php?main_page=product_info&products_id=$2&%{QUERY_STRING} [L]
RewriteRule ^(.*)-c-(.*)-p(.*)\.html$ /index.php?main_page=$4&cPath=$2&sort=$5&page=$3
RewriteRule ^(.*)-c-([0-9_]+)(.*)$ index\.php?main_page=index&cPath=$2&%{QUERY_STRING} [L]
RewriteRule ^(.*)-ez-(.*).html$ index.php?main_page=page&id=$2 [L]

# All other pages
# Don't rewrite real files or directories
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index\.php?main_page=$1&%{QUERY_STRING} [L]


# Block out any script trying to base64_encode data within the URL.
RewriteCond %{QUERY_STRING} base64_encode[^(]*\([^)]*\) [OR]
# Block out any script that includes a <script> tag in URL.
RewriteCond %{QUERY_STRING} (<|%3C)([^s]*s)+cript.*(>|%3E) [NC,OR]
# Block out any script trying to set a PHP GLOBALS variable via URL.
RewriteCond %{QUERY_STRING} GLOBALS(=|\[|\%[0-9A-Z]{0,2}) [OR]
# Block out any script trying to modify a _REQUEST variable via URL.
RewriteCond %{QUERY_STRING} _REQUEST(=|\[|\%[0-9A-Z]{0,2})
RewriteRule   index.html$  index.php [QSA] 


# 480 weeks
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=290304000, public"
</FilesMatch>

# 2 DAYS
<FilesMatch "\.(xml|txt)$">
Header set Cache-Control "max-age=172800, public, must-revalidate"
</FilesMatch>

# 2 HOURS
<FilesMatch "\.(html|htm)$">
Header set Cache-Control "max-age=7200, must-revalidate"
</FilesMatch>
# compress text, html, javascript, css, xml:
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript

RewriteEngine on
RewriteBase /

ErrorDocument 404 /index.php
RewriteRule   index.html$  index.php [QSA]

Here's your problem:

RewriteCond %{SERVER_PORT} ^443$
RewriteRule (.*) http://www.example.com/$1 

You don't allow SSL requests (443 port number is used for HTTPS requests). Try removing these lines.

Preventing Mixed Content | Web Fundamentals, Mixed Content: The page was loaded over HTTPS, but requested an insecure image. dangerous content by default and display an error in the JavaScript console. Active mixed content includes scripts, stylesheets, iframes, flash resources,� Thanks for contributing an answer to Stack Overflow! Please be sure to answer the question.Provide details and share your research! But avoid …. Asking for help, clarification, or responding to other answers.

If you are able to serve CSS etc over HTTPS, the best solution is to use // as the scheme for asset URLs.

That means "use the same scheme (sometimes called protocol) as the parent document", i.e. use https if the page uses https. For example:

<link rel="stylesheet" href="//mysite.com/styles.css">
<script src="//mysite.com/app.js"></script>

What Is Mixed Content? | Web Fundamentals, We are getting an error on the page above: The page at 'xxx' was loaded over HTTPS, but requested an insecure stylesheet 'xx/wp-content/plugins/search-filter/ � Active mixed content interacts with the page as a whole and allows an attacker to do almost anything with the page. Active mixed content includes scripts, stylesheets, iframes, flash resources, and other code that the browser can download and execute. Passive mixed content. Passive mixed content still poses a security threat to your site and

Most probably inside your html code you have something like

<link href="http://someSite.com/css/someStyle.css" rel="stylesheet" type="text/css" />

you should change this to

<link href="https://someSite.com/css/someStyle.css" rel="stylesheet" type="text/css" />

also the page you are referring to is .html not css, but i guess that is a typo ...

Issue with linking to css over https – mixed content, Starting with Firefox 23, Firefox blocks active mixed content by default. Join the MDN community � Report a content problem � Report an issue If your website delivers HTTPS pages, all active mixed content delivered via mcdetect to check your website recursively and find links to insecure content. mixed content: The page at .. was loaded over https but requested an insecure script. this request has been blocked the content must be served over https and mixed content: The page at .. was

I used cloudflare's plugin as described in their guide here.

How to fix a website with blocked mixed content, ssl mixed content insecure stylesheet 'http://fonts.googleapis.com/css? (index): 53Mixed Content: The page at 'https://pinupchart.com/’ was loaded over HTTPS, but requested an insecure stylesheet Installation question asked by Bruce Reyes-Chow � Ultimate member integration not working asked by AlexZ21 � [Closed] Mixed Content: was loaded over HTTPS, but requested an insecure stylesheet This is the technical support forum for WPML - the multilingual WordPress plugin. Everyone can read, but only WPML clients can post here.

Experienced similar error in Drupal 8.0.1

Error - Mixed Content: The page at '' was loaded over HTTPS, but requested an insecure stylesheet ''. This request has been blocked; the content must be served over HTTPS.

Solution - Open .htaccess file and add the following line Header always set Content-Security-Policy "upgrade-insecure-requests;"

ssl mixed content insecure stylesheet 'http://fonts.googleapis.com , Mixed Content: The page at 'https://pinupchart.com/' was loaded over HTTPS, but requested an insecure stylesheet 'http://fonts.googleapis.com/css?family=Oswald % Hello, I realize this is an older thread, but I am having the same problem. Passive mixed content is displayed by default, but users can set a preference to block this type of content, as well. Note that since mixed content blocking already happens in Chrome and Internet Explorer, it is very likely that if your website works in both of these browsers, it will work equally well in Firefox with mixed content blocking.

ssl font loaded over HTTPS, but requested an insecure stylesheet , Mixed content warnings are common occurrences after an HTTPS problem website owners encounter afterward is “mixed content Plugin developers sometimes use absolute paths ( http://yourdomain.com/style.css ) in their plugins or It scans an individual page and shows you all of the insecure� Installing the SSL Insecure Content Fixer plugin will solve most insecure content warnings with little or no effort. The remainder can be diagnosed with a few simple tools. When you install SSL Insecure Content Fixer, its default settings are activated and it will automatically perform some basic fixes on your website using the Simple fix level.

How to Quickly Fix WordPress Mixed Content Warnings (HTTPS/SSL), Many otherwise secure sites suffer from the problem of mixed content. HTTPS, all requests to page assets need to be made over a secure channel. or <object > tags, CSS values that use url and anything requested using� New to nginx. Played with it for 2 days and cannot figure out how to solve this: I have a bunch of VMs running in one box, the box is behind my router obviously, one of the VMs is running nginx(my

Fixing the mixed content problem with Automatic HTTPS Rewrites, I get an error in my wordpress when loading the page : mixed content: The page at .. was Duration: 1:56 Posted: Mar 27, 2017 Pressing enter will do a search and show more information about the location of the image. This search will usually find mixed content in .css and .js files too. Manual Method. Some mixed content cannot be found by the advanced search. To manually find the cause of the mixed content, right click on the page and click on “view source”.

Comments
  • Can you post the contents of .htaccess?
  • I updated the question
  • You missed URL's domain
  • " i.e. use https if the page uses https" confused me for a sec, but your examples did the trick: just replaced all http:// by //
  • When the page is loaded with https and css files url also used https. for when the browser oped it, the server response with redirect page which is 'example.com/site_map.html' in my case
  • i had a http in my css file. changing to htpps also worked. thanks!
  • @loannis Loukeris, 'http' and 'hhtps' should be dynamic. User can browse using any one. Thanks
  • That's exactly what the problem was. It also makes the page loads faster as well. So that helps me kills two birds with one stone.