Solve the cross-domain problem when running the project in the local browser-Access to XMLHttpRequest at'file:///D:/WebPracties/newSmartCity/data/funData.json

Problem Description

When working on projects these days, I encountered such a problem. I wrote a page and dynamically created a series of li using js to display it on the page. The way to obtain data is through json simulation. When the result is running the interface , There was an error. I thought the code was written incorrectly. I checked it carefully and found that there was no problem with the code. I checked the reason for the error. I checked it on the Internet and found that it was an ajax cross-domain problem.
Let's take a look at the error report

Solution one

First of all, this method is only temporary and will not work once the browser is closed. Take Google Chrome as an example.
First, find the location where your browser is installed. Generally, the default installation location is C:\Program Files\Google\Chrome\Application.
Then, open the command line in the directory and enter cmd directly in the folder navigation bar. After hitting enter

, you enter the cmd command line.

Finally, you only need to enter a command like
chrome.exe --disable-web-security --user-data-dir=C:\MyChromeUserFata

and then hit enter, it will automatically enter On a page,

when you see the browser interface that automatically pops up above and the sentence in the red box appears, it means that your operation is correct. The next step is to copy the page link that you have run in the original browser and put it in this browser. The interface of the device is running, everything is normal.

Solution two

First, declare that you can open the browser directly in this way, and then run the interface that needs to be run in the browser. Take the Chrome browser as an example.
First find the browser icon, make a copy, change its name to Google-Debug,

and then right-click the changed browser, select properties, and open it.

Then enter the original characters in the target input box immediately-user-data-dir= "c:\ChromeDebug" --test-type --disable-web-security
Note, it is very important
Remember-there must be a space in front

Then open the modified browser and open the webpage that needs to be run again, and it's ok.

Solution three

First of all, if you are using the VsCode compiler, then this problem can be solved through a plug-in. The name of this plug-in is Live Server. By installing this plug-in, you can use the http protocol to open the file local file page.
First go to the plug-in market to install the plug-in,

then find the terminal at the top, and select New Terminal

Then enter the command line.

Note that the –port=8082 in the red box above is to use a free port. If you don't add this sentence, the default port is 8080, and conflicts may occur. After typing the command and pressing Enter, the browser will automatically open and

then select the interface you need to run.
Note that when you click the html folder, it opens index.html by default. If you want to open other html pages, you need to add index.html Move to another place first, and then you can go in and select the page you need to open.

The three methods are all pro-test and effective, hoping to help IT people who need help struggling on the road