How to solve the problem of cross-domain requests

Methods to solve cross-domain requests include: jsonp uses the loading of script tags in the page to implement cross-domain requests; cors matches the current source point through the source point specified in the response header. To implement cross-domain requests

The cross-domain requests we often talk about are requesting resources from other domain names in one domain. The other domain names here not only refer to domain names, but also include many contents such as protocols, domain names, and ports. If the two domains are different, the two domains will also be regarded as different. Therefore, in the following article, we will introduce in detail how to solve the cross-connection problem. Domain request issue.

【Recommended course: JavaScript Tutorial】

Same Origin Policy

Sometimes we get errors during operation because we violate the Same Origin Policy, which is a security measure implemented by the browser for Limit interactions between documents with different origins. The origin of a page is defined by its protocol, host and port number. Resources with the same origin have full access to each other. However, access will be denied if the source is not the same.

http://www.a.com/a.js 
http://www.b.com/a.js 
这两个之间就不可以互相访问，因为域名的不相同

Domain name composition

If the above two domain names want to access each other, they need cross-domain requests. Generally speaking, the same-origin policy stipulates that cross-origin writes are allowed but cross-origin reads are not allowed. This means that the same-origin policy does not prevent data from being written to the domain, but only prohibits them from reading data from the domain, or from its Do nothing with the response received by the domain.

Cross-domain request method

JSONP

JSONP is called a JavaScript object representation with padding and is a Cross-domain requests can be implemented by using script tags in HTML pages to load code from different sources. JSONP relies on the fact that the <script> tag can come from different sources. When the browser parses the <script> tag, it fetches the script content and executes it within the context of the current page. Typically, the service will return HTML or some data represented in a data format such as XML or JSON. However, when making a request to a JSONP-enabled server, it returns a script block that, when executed, calls the page-specified callback function and provides the actual data as a parameter. </script>

NOTE: It does not Same origin restrictions, good compatibility even in older browsers but JSONP can only be used to perform cross-domain GET requests, the server must explicitly support JSONP requests.

CORS method

provides a mechanism for the server to tell the browser that it can request domain A to read the data from domain B. data. This is done by including a new Access-Control-Allow-Origin HTTP header in the response. When the browser receives a response from a cross-origin origin, it will check the CORS header. If the origin specified in the response header matches the current origin, read access to the response is allowed, otherwise an error is reported.

Compared with jsonp, CORS has the following advantages:

It not only supports GET requests, but also supports other requests such as POST

It can send and receive data using XMLHttpRequest, and Has a better error handling mechanism

Summary: The above is the entire content of this article, I hope it will be helpful to everyone

The above is the detailed content of How to solve the problem of cross-domain requests. For more information, please follow other related articles on the PHP Chinese website!