I have this problem. In external web site I have a script like this:

<div id="idtest"></div>
<script src="//example/widget.js" type="text/javascript"></script>

example is in https (allow both http and https). In the server in the script widget.js I have:

 $('#idtest').load(".html")

I get this error: Mixed Content: The page at 'thepage' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint '.html'. This request has been blocked; the content must be served over HTTPS.

I don't understand: why the error and why the endpoint is in "http"? thanks

EDIT

More information:

if in the widget.js I do this:

 $('#idtest').load("./index.html")

the content is load and all works perfectly if I load the script in my site.

If I do something like:

 x = ""
 $('#idtest').load(x + "/index.html")

or

 $('#idtest').load(".html")

I get the error (if I put the script in my site or in external site). Why?

EDIT 2

more informations:

my site is in django

EDIT 3

In firefox I load the page in https and http. It doesn't work in Chrome. I see this situation in firefox net analyzer when call the url :

302 .html 200 .html [mixed content]

What understand this situation (https to http)? Could be a Django redirect problem?

I have this problem. In external web site I have a script like this:

<div id="idtest"></div>
<script src="//example.com/widget.js" type="text/javascript"></script>

example.com is in https (allow both http and https). In the server in the script widget.js I have:

 $('#idtest').load("https://example.com/index.html")

I get this error: Mixed Content: The page at 'thepage' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://example.com/index.html'. This request has been blocked; the content must be served over HTTPS.

I don't understand: why the error and why the endpoint is in "http"? thanks

EDIT

More information:

if in the widget.js I do this:

 $('#idtest').load("./index.html")

the content is load and all works perfectly if I load the script in my site.

If I do something like:

 x = "https://example.com"
 $('#idtest').load(x + "/index.html")

or

 $('#idtest').load("https://example.com/index.html")

I get the error (if I put the script in my site or in external site). Why?

EDIT 2

more informations:

my site is in django

EDIT 3

In firefox I load the page in https and http. It doesn't work in Chrome. I see this situation in firefox net analyzer when call the url :

302 https://example.com/index.html 200 http://example.com/index.html [mixed content]

What understand this situation (https to http)? Could be a Django redirect problem?

• javascript
• jquery
• http
• https

• I'm sorry, doesn't work – RoverDar Commented Jun 5, 2015 at 10:01
• Have you checked that the entire page being requested uses https? Are you sure there is nothing on the index.html that links to something insecure? – freefaller Commented Jun 7, 2015 at 13:51
• Yes I'm sure that in idex.html there isn't http links – RoverDar Commented Jun 7, 2015 at 13:53

3 Answers 3

A mixed content error happens when:

• you try to load secure content SSL(https) on a page served insecurely (http) served

Or the opposite

• you try to load insecure content (http) on a page served securely SSL(https) served

Your error message is warning that your calling page has been loaded in insecure mode

You haven't explicitly explained this, but your error indicated your page is being served without SSL. When you try to load a protected resource this becomes a mixed mode problem of protected resources and insecure.

If possible, you try to serve the reference file the same way

• You can serve your main page in SSL (https)

• You can request the partial page in http

  $('#idtest').load("http://example.com/index.html")

or

• Just as you have resolved it, request the partial page without protocol. Now your loaded file will be loaded using the protocol used by your page.

About your specific resource:

I tried loading:

http://example.com/index.html

and

https://example.com/index.html

The result was the same. I got a simple page with the message:

Example Domain

This domain is established to be used for illustrative examples in documents. You may use this domain in examples without prior coordination or asking for permission.

More information...

I think it is more a problem of cross origin domain.

the $.load function of jquery use ajax to load the url and so you cannot do cross domain call if the target URL does not implement CORS headers.

In your example, the server example.com must return a header

Access-Control-Allow-Origin: *

You can also replace * with the domain of the page that want to load the content by AJAX.

A good blog post on how to use CORS: http://www.html5rocks.com/en/tutorials/cors/

I had this issue on Ruby on Rails webpage and the the mistake was to use "_url" helper instead of "_path" helper, on a https webpage:

in a view: wrong: borrar_linea_factura_url(l)

ok: borrar_linea_factura_path(l)

As a recap of said before:

"_url" helper generates /controller/action/params

"_path" helper generates https://controller/action/params