ajax如何请求本地txt文件时

这个坑还是要记录一下。

在使用ajax请求本地的txt文件时，发现不能获取本地的文件，以为自己的代码有问题，经过几番捣鼓发现原来是跨域请求的问题。只有火狐浏览器允许获取本地文件，Chrome浏览器以及IE等浏览器默认状态下是不允许获取的,个人对Chrome浏览器太执着，于是又搜索了一下Chrome如何处理跨域请求的问题，开始入坑~~~

看到有好多网友说在Google的快捷方式右键属性，

然后在目标一栏加上 –allow-file-access-from-files，

再点击 应用和确定就好。

然而我就傻傻地以为这样没问题了，又开始怀疑是我的代码有问题，于是我就借用了网友们贡献的代码做了测试，我的乖乖，还是不行。这下要崩溃了，难道是我的电脑问题？感觉自己像个傻子。傻哭。

几经搜索发现是Chrome浏览器版本更新之后的问题

解决方案来自包子源的博客http://blog.csdn.net/ziwoods/article/details/51062206

在之前版本的Chrome浏览器中使用 –args –disable-web-security

（当然我也没去验证 –allow-file-access-from-files在之前的版本是否也可以，反正现在的版本不行）

2016年3月之后的Chrome新版本需要使用 –args –disable-web-security –user-data-dir（注意空格）

终于把问题解决了。

感叹一下：在这个快速更新的时代，要掌握及时的信息啊。

附上ajax请求代码：（不考虑IE的情况下）

var btn = document.getElementById("btn");
btn.addEventListener("click",
function() {
var xhr =new XMLHttpRequest()
xhr.open("GET", "data.txt", true);//注意路径问题读取data.txt文件的内容。
xhr.send(null);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
if (xhr.status == 200||xhr.status==0) {//请求本地txt文件时状态码是0。
alert(xhr.responseText);
} else {
alert(xhr.status);
}
}
}
}, false)

另外需要注意的是ajax请求要依赖DOM事件的触发才能请求到文件，如上例中的click事件。

另外还有一种解决所有浏览器都能跨域访问文件的方法：

详见：http://www.lhysky.com/2017/03/14/problem-cross-domain/