skip to Main Content

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]

6

Answers


  1. 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 …

    Login or Signup to reply.
  2. 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>
    
    Login or Signup to reply.
  3. 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.

    Login or Signup to reply.
  4. I used cloudflare’s plugin as described in their guide here.

    Login or Signup to reply.
  5. Experienced similar error in Drupal 8.0.1

    ErrorMixed 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;”

    Login or Signup to reply.
  6. You may also need to check your
    WordPress Address (URL) and Site Address (URL) under General Settings and make sure your URLs are https://www.yourdomain.com

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search