For security reasons, the browser loading engine must follow the same origin policy when loading resources. That is, XmlHttpRequest only allows requests (protocol, domain name, port number, etc.) to be sent from the current source of resources. However, in real development, data or document structures may need to be from different servers. In the case that the background does not solve the spanning, the front-end cross-domain problem arises. The following lists the common cross-domain means of the front-end:
- **JSONP:** The principle is to dynamically insert a script tag to introduce a Js file that brings back the callback function. The Js file will execute the address requested by the file after loading successfully, and pass in the JSON parameter we need. In the callback function, we can get the requested data.
Color {#d00}{Advantages:} Advantages: Good compatibility, support browser and server bidirectional communication. Cons: \color{#d00}{cons:} Cons: only support GET requests
-
Access-control-allow-origin = access-Control-allow-origin = access-Control-allow-origin = access-Control-allow-origin
-
**document.domain:** to cross the domain, through document.domain to set to the same primary domain, the premise is the base domain name, port number must be consistent
-
**window.name:** That is, all pages loaded by a window share the same window.name during the lifetime of a window, and each page is persistent to window.name.
-
** Iframe :** This is a new technology in H5, browsers may not support this method, or there may be a delay in the situation, the idea is to create an iframe tag in the document, the resource path to be requested to assign to the SRC attribute of the tag, the parent page or sibling page can be implemented. To achieve cross-domain effect, ensure that the basic domain name and port number are consistent.