During local development, when trying to load a JavaScript file from an HTML file, I encountered a CORS policy error. The error message is as follows:
Access to script at 'file:///C:/Users/Administrator/Desktop/zodiac-dev/zodiac-dev/main.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, isolated-app, chrome-extension, chrome, https, chrome-untrusted.
This issue prevents the JavaScript file from loading properly, which affects the functionality of the page.
Steps to Reproduce
Place the HTML file and JavaScript file in a local folder.
Open the HTML file by double-clicking it or directly opening the file path file:///C:/Users/Administrator/Desktop/zodiac-dev/zodiac-dev/zodiac.html in the browser.
Observe the browser console to find the aforementioned CORS error.
Expected Behavior
The HTML file should be able to load and execute the local JavaScript file without interference from CORS policies.
Actual Behavior
The browser blocks the loading of the JavaScript file, throwing a CORS policy error.
Possible Solutions
It is recommended to set up a local development server, such as using Python's HTTP server module, or host the files through a web server software like Apache or Nginx. This can prevent CORS issues associated with opening files directly from the file system.
Environment Information
Operating System: Windows 10
Browser: Google Chrome Version 125.0.6422.142
File Path: C:/Users/Administrator/Desktop/zodiac-dev/zodiac-dev
Description
During local development, when trying to load a JavaScript file from an HTML file, I encountered a CORS policy error. The error message is as follows:
Access to script at 'file:///C:/Users/Administrator/Desktop/zodiac-dev/zodiac-dev/main.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, isolated-app, chrome-extension, chrome, https, chrome-untrusted.This issue prevents the JavaScript file from loading properly, which affects the functionality of the page.
Steps to Reproduce
Place the HTML file and JavaScript file in a local folder. Open the HTML file by double-clicking it or directly opening the file path file:///C:/Users/Administrator/Desktop/zodiac-dev/zodiac-dev/zodiac.html in the browser. Observe the browser console to find the aforementioned CORS error.
Expected Behavior
The HTML file should be able to load and execute the local JavaScript file without interference from CORS policies.
Actual Behavior
The browser blocks the loading of the JavaScript file, throwing a CORS policy error.
Possible Solutions
It is recommended to set up a local development server, such as using Python's HTTP server module, or host the files through a web server software like Apache or Nginx. This can prevent CORS issues associated with opening files directly from the file system.
Environment Information
Operating System: Windows 10 Browser: Google Chrome Version 125.0.6422.142 File Path: C:/Users/Administrator/Desktop/zodiac-dev/zodiac-dev