The same-origin policy is a browser safety restriction: JavaScript cannot call a resource at another origin unless that web API explicitly permits access. section 29.3 section 29.2
Two URLs share an origin only when their scheme, domain, and port match. Different paths do not matter, but changing any of those three parts makes the origins different. section 29.3
For JavaScript running from http://example.com:
- Allows http://example.com/home to request http://example.com/site.css because both URLs use the same scheme, domain, and port. section 29.3
- Blocks https://example.com because the scheme differs. section 29.3
- Blocks http://www.example.com because the domain differs. section 29.3
- Blocks http://example.com:5000 because the port differs from HTTP’s default port 80. section 29.3
This restriction protects web APIs from arbitrary browser scripts, but it affects legitimate applications such as a shopping site loading product data from a separate API. Cross-origin resource sharing (CORS) lets an API explicitly allow those requests. section 29.3 section 29.2
Figure 29.6 The console log for a failed cross-origin request. Chrome has blocked a cross-origin request from the app http://shopping.com:6333 to the API at http://api.shopping.com:5111.
Use the browser console example to see a request blocked when the application and API differ in domain and port. section 29.3
