Ajax using https on an http page

Question

My site uses http and https protocol; it doesn't affect the content. My site uses jQuery ajax calls, which fills some areas on the page, too.

Now, I would like to do all ajax calls over https. (please dont ask me why :)) When I am on a page with https protocol, ajax requests are working. When I'm on a page with http protocol, I get a javascript error: Access to restricted URI denied

I know that this is a cross domain problem (in fact, it's a cross protocol problem), and I know that I should use the same protocol in ajax calls as on the current page.

Still, I want to all ajax calls to be https, and call them on a page that was served over http. Is there any workaround to achieve this (some json/proxy solution?), or is it simply impossible?

Resale

Why not match the ajax to the loading page protocol? – Grasshopper

They specifically said "Please don't ask me why." – Pemphigus

Why do you need AJAX with HTTPS though..... – Portiaportico

For example for a more dynamical checkout form which is connecting to a payment gateway like paypal in the background so people can see what is happening.. Just one of more possibilities – Wilding

Answer 1

Add the Access-Control-Allow-Origin header from the server

Access-Control-Allow-Origin: https://www.mysite.com

http://en.wikipedia.org/wiki/Cross-Origin_Resource_Sharing

Pierce

Great respond - but not supported by some used browsers like Opera (not at all) and Internet Explorer (supported since version 8) caniuse.com/#search=cors – Geraldine

Seems like Opera supports it now: en.wikipedia.org/wiki/… Only not Opera Mini though... – Regularly

Answer 2

Try JSONP.

most JS libraries make it just as easy as other AJAX calls, but internally use an iframe to do the query.

if you're not using JSON for your payload, then you'll have to roll your own mechanism around the iframe.

personally, i'd just redirect form the http:// page to the https:// one

Once

hmm i have tried jquery .ajax with jsonp:'jsonp_callback' option set, but still same js error. – Resale

maybe you have to add the callback parameter in the URL – Once

@Resale Does the endpoint you're sending the query to support JSONP in the first place? – Receivership

For the sake of my sanity I'm going to go with your last option... Simple redirect to https: – Retractor

Answer 3

http://example.com/ may resolve to a different VirtualHost than https://example.com/ (which, as the Host header is not sent, responds to the default for that IP), so the two are treated as separate domains and thus subject to crossdomain JS restrictions.

JSON callbacks may let you avoid this.

Tricho

dead link on JSON callbacks :( – Piatt

@Piatt This answer is ten years old tomorrow, and broken links are why we ask that questions include enough information to survive one. – Tricho

just noticed the 10 years ha... and yes good point. Its okay, will google around for this one & edit answer if I find anything – Piatt

Answer 4

Check out the opensource Forge project. It provides a JavaScript TLS implementation, along with some Flash to handle the actual cross-domain requests:

http://github.com/digitalbazaar/forge/blob/master/README

In short, Forge will enable you to make XmlHttpRequests from a web page loaded over http to an https site. You will need to provide a Flash cross-domain policy file via your server to enable the cross-domain requests. Check out the blog posts at the end of the README to get a more in-depth explanation for how it works.

However, I should mention that Forge is better suited for requests between two different https-domains. The reason is that there's a potential MiTM attack. If you load the JavaScript and Flash from a non-secure site it could be compromised. The most secure use is to load it from a secure site and then use it to access other sites (secure or otherwise).

Please

Answer 5

You could attempt to load the the https page in an iframe and route all ajax requests in/out of the frame via some bridge, it's a hackaround but it might work (not sure if it will impose the same access restrictions given the secure context). Otherwise a local http proxy to reroute requests (like any cross domain calls) would be the accepted solution.

Tabard

After reading this thread, I'd stick with JSONP dslreports.com/forum/r21425467-IFrame-With-HTTPS-on-HTTP-Page – Tibia

This can be done, but be sure to set P3P headers if you need sessions cookies from the iFrame... otherwise MSE will say "nu uh uh" – Linger

Answer 6

Here's what I do:

Generate a hidden iFrame with the data you would like to post. Since you still control that iFrame, same origin does not apply. Then submit the form in that iFrame to the ssl page. The ssl page then redirects to a non-ssl page with status messages. You have access to the iFrame.

Zolly

This can be done, but be sure to set P3P headers if you need sessions cookies from the iFrame... otherwise MSE will say "nu uh uh" – Linger