The back-end cross-domain permission could not be opened, so I went to the Internet to find out if I could solve it
Current browsers are not allowed to cross domains due to security policy restrictions, but they often require interfaces from other domains during development, especially when some interfaces are not under their own control, which often causes development difficulties.
There are many ways to solve cross-domain problems, such as: Nginx proxy, through the HTTP header to solve, etc., I found a relatively simple way in the front-end separation development stage, configure the browser to solve cross-domain problems. The records are as follows:
Today, I accidentally knew that the chrome browser can solve the cross-domain problem through settings.
If the Chrome version is before 49 , the setting method is as follows:
1. Click the right mouse button on the shortcut icon of Chrome (if there is no shortcut, you can find the file path, send the shortcut to the desktop)
2. Select "Properties"
[In addition to right-click to select the property to view, you can also hold down alt and double-click the icon to directly open the property panel]
3. Select the shortcut label
4. In the "target", add --disable-web-security on the basis of the original chrome path [note-there is a space before]
5. Click "Apply"
6. Click "OK" to close the properties window
7. Close all open chrome and restart (must click the shortcut to open)
8. Seeing the small yellow bar under the address bar, you are using the unsupported command tag –disable-web-security
If the version is more than 49 : the
steps are the same as above, but the parameters of step 4 are slightly different.
--disable-web-security --user-data-dir = C: \ chromedata
[Note -there are spaces before]
C: \ chromedata is a directory on your local hard drive. You'd better create a new one by yourself. Just change the directory path above to your newly created directory.
The property configuration screenshot is as follows:
After configuration, the screenshot of the warning that pops up is as follows (because I have a version above 49, so the warning content is --disable-web-security):
[Remarks: This method is more suitable for the case where the front-end and back-end development are not in the same web server in the early stage. The front-end can also be accessed to the back-end interface through the browser configuration method. In the container, naturally there will be no similar problems. This method is only suitable for use during development, not for a formal cross-domain solution]
As a test, I wrote a piece of code (using ajax to access Baidu locally, and obtained the source code of Baidu's web page and displayed it on a div), as follows:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Ajax跨域demo</title>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
</head>
<body>
<div id="myDiv">
</div>
</body>
<script>
$(function(){
$.get("http://www.baidu.com",function(data){
$("#myDiv").text(data);
});
});
</script>
</html>
The execution result is as follows, which shows that the configuration is successful:
