Javascript &引用;JSON输入意外结束“;从本地文件系统加载JSON文件时出错

Javascript &引用;JSON输入意外结束“;从本地文件系统加载JSON文件时出错,javascript,json,ajax,Javascript,Json,Ajax,您好,我正在尝试使用AJAX调用将title.JSON文件中的数据检索到index.html文件中。这两个文件都位于我的本地文件系统中。我创建了一个新的chrome实例,并将其目标属性设置为“C:\Program files(x86)\Google\chrome\Application\chrome.exe”-禁用web安全性--user data dir=“C:/chromedev”(我知道这不是一个好的做法。只是尝试一种无服务器的方式)。下面是我的代码 <h1><a id=

您好,我正在尝试使用AJAX调用将title.JSON文件中的数据检索到index.html文件中。这两个文件都位于我的本地文件系统中。我创建了一个新的chrome实例,并将其目标属性设置为
“C:\Program files(x86)\Google\chrome\Application\chrome.exe”-禁用web安全性--user data dir=“C:/chromedev”
(我知道这不是一个好的做法。只是尝试一种无服务器的方式)。下面是我的代码

<h1><a id="headName" href="#">Name</a></h1>
<p onclick="spaLoad()">NameChange</p>

function spaLoad(){
            var xhr = new XMLHttpRequest();
            xhr.open('GET','title.json',true);
            xhr.send();

                xhr.onreadystatechange=function () {
                    //var obj=xhr.responseText;
                     var obj = JSON.parse(xhr.responseText);
                    console.log(obj);
                    console.log(xhr.readyState);
                    console.log(xhr.status);
                    console.log(xhr.statusText);
                    //document.getElementById('headName').innerHTML = obj;
                    document.getElementById('headName').innerHTML = obj.name;

                }
            }
我通过一个ajax调用将我的h1更新为“stackoverflow”,并伴有错误

未捕获的语法错误:JSON输入意外结束 在JSON.parse()处 在XMLHttpRequest.xhr.onreadystatechange

以下是我的疑问: 1.我希望AJAX用于客户端和服务器之间的通信。虽然我通过修改浏览器设置避免了使用服务器,但是ajax调用对我来说是如何工作的呢?是否合乎逻辑? 2.JSON文件包含作为对象的数据,那么我为什么要使用JSON.parse(responseText)?(JSON.parse()是为了将服务器的字符串转换为客户端的对象,我希望是这样)。如果我直接给出
var obj=xhr.responseText我没有定义。
3.readystate正在更改为4,但状态始终为0。为什么会这样?我如何解决它


请简要说明此无服务器ajax调用的工作原理。我对ajax非常陌生,对此感到困惑。

这是因为readystate change会触发多次,而您希望它触发一次。您需要检查readystate是否等于4,状态是否为200(或者在您的情况下为零,因为您使用的是文件协议)。或者改用onload和onerror事件

如果仍然出现解析错误,则需要调试返回的内容

//see what is returned
console.log(xhr.responseText)
//Look to see if you have hidden characters in the file.
console.log(escape(xhr.responseText))

解析错误发生的原因可能是您正在加载的文件返回了错误页之类的其他内容,或者它具有特殊的隐藏字符,导致解析器阻塞

这是因为readystate change会触发多次,而您希望它触发一次。您需要检查readystate是否等于4,状态是否为200(或者在您的情况下为零,因为您使用的是文件协议)。或者改用onload和onerror事件

如果仍然出现解析错误,则需要调试返回的内容

//see what is returned
console.log(xhr.responseText)
//Look to see if you have hidden characters in the file.
console.log(escape(xhr.responseText))

解析错误发生的原因可能是您正在加载的文件返回了错误页之类的其他内容,或者它具有特殊的隐藏字符,导致解析器阻塞

我尝试使用if(xhr.readyState==4)触发它一次。状态仍然是0,我得到了相同的错误:JSON.parse()处JSON输入的意外结束状态将是零,因为您在文件protocal上,而不是服务器上。你真的应该运行一个本地服务器,这并不难做到。第二个问题要求您调试它
console.log(escape(xhr.responseText))
并查看它失败的原因。但我仍然对没有服务器的ajax如何工作感到困惑。我曾经尝试使用if(xhr.readyState==4)启动过它。状态仍然为0,我得到了相同的错误:JSON.parse()处的JSON输入意外结束状态将为零,因为您在文件协议上,而不是服务器上。你真的应该运行一个本地服务器,这并不难做到。第二个问题要求您调试它
console.log(escape(xhr.responseText))
并查看它失败的原因。但我仍然不清楚没有服务器的ajax是如何工作的