Reputation: 441
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?
Upvotes: 8
Views: 42797
Reputation: 2044
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
Upvotes: 0
Reputation: 792
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/
Upvotes: 1
Reputation: 32490
A mixed content error happens when:
https
) on a page served insecurely (http
) servedOr the opposite
http
) on a page served securely SSL(https
) servedYour 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
About your specific resource:
I tried loading:
and
https://example.com/index.html
The result was the same. I got a simple page with the message:
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.
Upvotes: 12