ajax（XMLHttpRequest）加载不了本地的文件，Cross origin requests are only supported for protocol schemes: ...

Access to XMLHttpRequest at 'file:///E:/test.txt' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

我原本是做一个flappy bird的，但到加载本地文件的时候，一直报上面的错，就又写了一个简单的ajax请求来看看是怎么回事，看图

目录结构：（够简单了吧，两个数据文件，只用了一个txt文件）

下面是index.html的内容，完全是抄菜鸟教程里的XMLHttpRequest的例子

    
    
    
    
    
    


    请求数据
    
多次点击按钮，可以看到时间变化。
    

    

 

运行后，下面是错误提示。

Access to XMLHttpRequest at 'file:///E:/test.txt' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

 

说明不支持file协议的。

解决之一：

    弄一个本地服务器。

因为我是用vscode编写的，这个比较强大。所以，只需要安装插件就可以了。

1、首先，先安装debugger for chrome

2、先根据符号开始，然后在2步骤里选择chrome，就会弹出launch.json文件，

在json文件中添加（一般写完file会自动帮你补全的，如果你有index.html文件）

"file": "${workspaceFolder}/index.html"

选择4中的下拉框的 Launch Chrome against localhost 选项，就会在chrome浏览器弹出一个新的页面，

地址是 "url": "http://localhost:8080"中的地址，显示的页面是index.html这个页面

3、在控制台输入

npm install -g live-server

然后继续输入

live-server

就会弹出一个窗口（这是自动运行的，url地址会被改变，不再是file协议的地址），画线的是从test.txt中获取的数据