What is the same origin policy?

One 、 What is the homology strategy ？

One URL There are three parts ： agreement 、 domain name ( Point to host )、 port , Only these three are exactly the same URL Can be called homology . as follows , Energy and harmony http://www.example.com/dir/index.html Homologous is ？

| URL                                      |  result    |  reason                                |
| ---------------------------------------- | ------ | ---------------------------------- |
| `http://www.example.com/dir2/other.html` |  Homology    |  Only the path is different                        |
| `https://www.example.com/secure.html`    |  Different sources  |  Different agreements                            |
| `http://www.example.com:81/dir/etc.html` |  Different sources  |  Different ports  ( `http://`  The default port is 80) |
| `http://news.example.com/dir/other.html` |  Different sources  |  Domain name is different                            |

Two 、 Parent domain name and child domain name

Can be set by document.domain, Let the child domain name and the parent domain name pass the detection of homology policy .

// 1、 The page below the subdomain name 
http://store.company.com/dir/other.html 

// 2、 Modify... In script code 
document.domain = "company.com";

// 3、 Then go to the page under the parent domain name , Can not be intercepted across domains 
fetch("http://company.com/dir/page.html")

remarks ： But if the port is not the default 80, It will also fail , because document.domain = "company.com"; Will set the port to null

3、 ... and 、 Cross domain access

The solution for cross domain access is CORS, details , Look here ！

Four 、window.postMessage( Not recommended )

Cross domain access can also be through window.postMessage To achieve , But I don't recommend it , It can easily cause security problems .window.postMessage - Detailed instructions ！

5、 ... and 、 Reference documents

• The same-origin policy (Same-origin policy) What is it? ？