Detailed explanation of JS's same-origin policy and cross-domain access practice

This time I will bring you a detailed explanation of JS's same-origin policy and cross-domain access. What are the precautions for JS's same-origin policy and cross-domain access? The following is a practical case, let's take a look.

The examples in this article describe the JavaScript origin policy and cross-domain access. Share it with everyone for your reference, the details are as follows:

1. What is the same origin policy

To understand cross-domain, you must first understand the same origin Strategy. The Same Origin Policy is a very important security policy implemented on browsers for security reasons.

What is the same origin:

URL consists of protocol, domain name, port and path. If the protocol, domain name and port of two URLs are the same, it means that they have the same origin. .

Same origin policy:

The browser's same origin policy restricts "documents" or scripts from different sources from reading or setting the current "document" certain attributes. (White hat talks about web security [1])

Scripts loaded from one domain are not allowed to access document attributes of another domain.

For example:

For example, a malicious website page embeds a bank’s login page through an iframe (the two are from different sources). If there is no same-origin restriction, the javascript script on the malicious webpage will The username and password can be obtained when the user logs into the bank.

In the browser, tags such as