Working With and Around the Same-Origin Policy - SitePoint

Let us run the following from http://www.mysite.com (or 127.0.0.1 XMLHttpRequest http://www.mysite.com Why does this happen? Didn’t we do everything right? Same-origin Policy The same-origin policy permits scripts running in a browser to only make requests to pages on the same domain. This means that requests must have the same URI scheme, hostname, and port number. This post on the Mozilla Developer Network clearly defines the definition of an origin and when requests result in failure. If you send a request from http://www.mysite.com/ https://www.mysite.com/ http://www.mysite.com:

Using JSONP

Another way of implementing cross browser requests is by using JSONP, or “JSON with padding.” JSONP takes advantage of the fact that <script> tags are not subject to the same-origin policy. For example, you can include a library like jQuery on your page even if it is hosted on Google’s CDN.

JSONP requests are made by dynamically requesting a <script> tag. The interesting part is that the response is JSON wrapped in a function call. When making the request, you specify the function name as a callback function. When the server responds, the callback function (which must exist on your page) is executed with the data returned from the server.

Read full article from Working With and Around the Same-Origin Policy - SitePoint