CODEWITHSUNDEEP
javascriptxmlhttprequestresourcesmixed
hemant rao
hemant rao

Reputation: 3195

Mixed Content The page at was loaded over HTTPS but requested an insecure resource This request has been blocked the content must be served over HTTPS

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

Upvotes: 39

Views: 150707

Answers (7)

chujudzvin
chujudzvin

Reputation: 1303

I tried two things and one of them (or both) eventually has worked:

In my index.html:

I replaced %PUBLIC_URL% with ./, For exmaple

<link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> replaced with <link rel="icon" href="./favicon.ico" />

AND in package.json:

Replaced "homepage": "http://." with "homepage": "."

Upvotes: 0

Tanya Thomas
Tanya Thomas

Reputation: 11

I've found that quite often it's simply old links that were obtained awhile ago. Check your project for any links that are "http://" and try changing them to "https://" Most sites have updated to https and this will instantly fix your problem

Upvotes: 1

MohammadMahdi Javid
MohammadMahdi Javid

Reputation: 81

to allow Mixed Content:
1- add this meta tag to the page (HTML File)

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

2- add unsafe_url for referrerPolicy to your fetch requests if you get ERR_CONNECTION_REFUSED
example:

fetch('http://URL', {
    // ...
    referrerPolicy: "unsafe-url" 
});

Warning: This policy will leak potentially-private information from HTTPS resource URLs to insecure origins. Carefully consider the impact of this setting.

for more info check these 2 documentations:

  1. https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Referrer-Policy
  2. https://javascript.info/fetch-api

Upvotes: 6

Feryat Figan
Feryat Figan

Reputation: 61

I had a similar problem with HTTPS page requesting detecting Ajax folder existence https://domanin.name/folder get mix-content with 301 redirect error with header location changed to http: works fine with https://domanin.name/folder/ if you don't use / end of the file server redirect destination with adding / but why http: instead https: strange behavior!

Upvotes: 1

James Newton
James Newton

Reputation: 777

In Chrome, you can treat a url as safe via this flag:

chrome://flags/#unsafely-treat-insecure-origin-as-secure

You can enter multiple protocol and urls, even using local IP addresses in a comma delimited list. E.g. http://192.168.1.142, ws://192.168.1.142

Problems: 1. Requires trust or knowledge on part of the user (browser starts with a warning message about degraded functionality), 2. Chrome specific. 3. Slightly reduces security.

Upvotes: 6

Peter.Wang
Peter.Wang

Reputation: 2211

Add below to .htaccess

Header add Content-Security-Policy "upgrade-insecure-requests"

This will let the browser try to load HTTP content on the HTTPS page in HTTPS.

Upvotes: 7

hemant rao
hemant rao

Reputation: 3195

There's no way to disable mixed content using javascript but you can add this tag

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

to your HTML to allow mixed content

Upvotes: 59

Related Questions