Secure xmlhttprequest from insecure page

Question

I want to make XMLHttpRequest a secure uri ( https://site.com/ajaxservice/ ) from javascript running on an insecure page ( http://site.com/page.htm ). I have tried all sorts of nutty things like iframes and dynamic script elements still not working. I know that I am violating the "same origin policy", but there must be some way to make this work.

I will take any stupid solution without having the SSL protocol written in javascript.

Answer 1

This will not work by default due to the same origin policy as you mentioned. Modern browsers implement CORS (Cross-Origin Resource Sharing), which you could use to work around this problem. However, this will only work in Internet Explorer 8+, Firefox 3.5+, Safari 4+ and Chrome and requires server-side operation. You can read the following article for further reading on this topic:

• Cross-Domain Ajax with Cross-Resource Access Nicolas K. Zakas

You can also use JSONP as Dan Beam in another answer . This requires some extra JavaScript work, and you may need to “populate” your web service response, but this is another option that works in all current browsers.

Answer 2

You cannot get around cross-domain origin with XHR (well, only in Firefox 3.5 with user permission, not with a good solution). Technically, switching from port 80 (http) to 443 (https) violates this policy (it must be the same domain and port). Here is an example of the specification sites themselves - http://www.w3.org/Security/wiki/Same_Origin_Policy#General_Principles .

Have you looked at JSONP ( http://en.wikipedia.org/wiki/JSON#JSONP ) or CSSHttpRequests ( http://nb.io/hacks/csshttprequest )?

JSONP is a way to add a <script> to a page with a predefined global domain callback (since you can put <script> src anywhere on the Internet). Example:

 <script> function globalCallback (a) { /* do stuff with a */ } 

And then you paste the <script> into your other domain, for example:

  var jsonp = document.createElement('script'); json.setAttribute('src','http://path.to/my/script'); document.body.appendChild(jsonp); </script> 

And in the source of the external script, you should call the globalCallback function with the data you want to pass, for example:

  globalCallback({"big":{"phat":"object"}}); 

And you will get the data you need after running the script!

CSSHttpRequests is a bit more hack, so I never had to use it, but feel free to try it if you don't like JSONP, :).

Answer 3

You said you would take anything other than the SSL protocol written in JavaScript ... but I assume that you had in mind if you had to write it yourself.

The open-source Forge project provides an implementation of JavaScript TLS as well as Flash for handling cross-domain requests:

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

Check out the blog entries at the end of README for a more detailed explanation of how this works.

Answer 4

I do not think that's possible. Previously asked: Ajax using https on the http page