Homology and cross domain

One 、 The same-origin policy

1、 Same as Source （origin）

• Homology ： If it's in the address agreement 、 Domain name and port number all identical It belongs to homology .
• The following is relative to http://www.a.com:8080/test/index.html  Homology detection of ：

http://www.a.com/dir/page.html ---- success （http Default port number bit 8080）

http://www.child.a.com/test/index.html ---- Failure , domain name Different

https://www.a.com/test/index.html ---- Failure , agreement Different

http://www.a.com:8089/test/index.html ---- Failure , Port number Different

2、 The same-origin policy

• Homology policy is a security function of browser , Client scripts from different sources are not explicitly authorized , Can't read and write to each other's resources . therefore a.com Under the js The script uses ajax Read b.com The file data in it will report an error .
• Not subject to the same origin policy ：

① Links in the page , Redirection and form submission are not restricted by the same origin policy .

② Cross domain resources can be introduced . however js Can't read or write the loaded content . As embedded in the page <script src="..."></script>,<img>,<link>,<iframe> etc. .

Two 、 Cross domain

1. Cross domain ：

as long as agreement 、 domain name 、 Port number There is a difference It's cross domain .

2. Cross domain reasons ：

Cross domain problems arise from JavaScript The same origin strategy , That is, only agreement + Host name + Port number ( If it exists ) identical , Then mutual access is allowed . In order to prevent the interface under a domain name from being illegally called by web pages under other domain names , It 's the browser JavaScript Safety restrictions imposed . in other words JavaScript You can only access and operate resources under your own domain , Cannot access and operate resources under other domains . The cross domain problem is aimed at JS and ajax Of ,html There is no cross domain problem in itself , such as a label 、script label 、 even to the extent that form label （ You can send and receive data directly across domains ） etc. .

3、 ... and 、 Cross domain problem solution

1、jsonp

utilize script The tag can be cross domain , In the cross domain script, you can directly call back the function of the current script .

2、cors

server setting HTTP In the response header Access-Control-Allow-Origin value , Remove cross domain restrictions .

Be careful ： Both cross domain solutions have a fatal flaw , Heavily dependent on back-end assistance .

3、 Reverse proxy （Reverse Proxy）：

A cross domain solution that can be solved independently of the front end .

To accept as a proxy server internet Connection request on , Then forward the request to the server on the internal network , And return the results from the server to the internet Clients requesting connections on , At this time, the proxy server acts as a reverse proxy server .