jquery.load('file:///')加载本地文件跨域

3,427 阅读1分钟

背景

客户发来一份jq写的前端文件,html中有个用法是$dom.load('本地html文件'),在chrom浏览器中直接打开,浏览器会报错:has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.也就是跨域了。

解决方案一

一劳永逸的方案是,本地搭建一个静态文件服务器,让本地文件在同一服务下,解决跨域。

推荐个好用的可以随时启用静态服务的NodeJS插件:anywhere

// anywhere: 随时随地将你的当前目录变成一个静态文件服务器的根目录。
npm i anywhere -g
cd xxx  // xxx你的项目
anywhere -p 8000

解决方案二

尝试了广大网友推荐的火狐浏览器,发现仍然报错跨域。控制台点开跨域提示,跳转到MDN的详细说明:

大意是:火狐68版本以前本地跨域是允许的,被一个人提了bug之后后面版本不再允许跨域了。

后来检查下自己的火狐版本,发现是Firefox 74, 尝试着下载了火狐67版本,再刷新浏览器,就可以成功跨域了。

附: 火狐会自动更新版本,需自己勾掉,因此更推荐方案一。

火狐低版本下载地址可跳转 火狐ftp服务器