JSON.parse 在 JSON 数据的第 1 行开头引发意外字符错误答案

【问题标题】：JSON.parse throws unexpected character error at start of line 1 of the JSON dataJSON.parse 在 JSON 数据的第 1 行开头引发意外字符错误
【发布时间】：2018-02-01 03:07:47
【问题描述】：

我对整个 JavaScript 环境还是比较陌生，我需要帮助将 JSON 文件解析为 JSON 对象以读取文件的内容。我一直在阅读很多其他问题和文档，但到目前为止我还没有看到任何与我的问题相关的内容。

首先情况：我有一个名为 test.json 的文件，它应该是从服务器传送的。但出于测试目的，它在本地存储为clusters.json，与我的 html 文档位于同一文件夹中。 HTML 文件的代码：

<!DOCTYPE html>
<meta charset="utf-8">
<html>
<head>
    <title>JSON THINGIE</title>
</head>
<body>
    <h1>A Header</h1>
    <p id="textone">sample text</p>
    <script>
        var jsonFile = "/clusters.json";
        var jsonObj = JSON.parse(jsonFile);
    </script>
</body>
</html>

代码执行到JSON.parse(jsonTest);，然后抛出这个错误（来自mozilla调试工具）：

SyntaxError：JSON.parse：JSON 数据的第 1 行第 1 列出现意外字符

JSON 文件 (clusters.json)

{
    "occupation":{
      "employment":[
         {
            "id":1,
            "cluster_name":"Tekenaar",
            "weight":0.5,
            "similarity":0.1,
         },
         {
            "id":4,
            "cluster_name":"Tekenaar Constructeur",
            "weight":0.6,
         }
      ],
      "education":[
         {
            "id":2,
            "cluster_name":"HBO",
            "weight":1,
         },
         {
            "id":3,
            "cluster_name":"HBO",
            "weight":1,
         }
      ]
   }
}

显然{ 左括号是错误的，但 JSON 文档指出可以使用 { 或 [ 打开文件。

我已经使用多个验证器工具检查了我的 JSON，甚至使用了来自 JSON Example 页面的复制粘贴，但一切都给出了相同的错误。

同样根据this问题的答案，我先尝试使用JSON.stringify(jsonTest)，但无济于事。

我可能做错了什么？感谢任何帮助，因为我已经在这个错误上花费了太多时间。谢谢。

编辑 1： 认为使用字符串会使解析器自动加载文件确实是我自己的错误。

无服务器修复： 我使用this question 的答案成功地从文件中加载了文本。当我在寻找如何使用file://时，我到达了。

实施修复以供将来参考：

// URL to the file
var jsonFile = 'file:///C://Users//Daan//Projects//Temp Name//clusters.json'

function readTextFile(file) {
    var rawFile = new XMLHttpRequest();
    rawFile.open("GET", file, false);
    rawFile.onreadystatechange = function () {
        if (rawFile.readyState === 4) {
            if (rawFile.status === 200 || rawFile.status == 0) {
                var allText = rawFile.responseText;
                // Show alert with the read text.
                alert(allText);
            }
        }
    }
    rawFile.send(null);
}

readTextFile(jsonFile);

【问题讨论】：

标签： javascript json parsing syntax-error character

【解决方案1】：

var jsonFile = "/clusters.json"; 行不加载文件，它只是创建一个字符串。下一行尝试将字符串解析为 JSON 对象，但事实并非如此。在尝试解析其内容之前，您必须以某种方式加载文件。

如果您还没有，您可能需要一个网络服务器来运行您的网站，然后使用 AJAX 加载文件。

【讨论】：

不使用XMLHttpRequest()函数可以加载文件吗？
是的，我相信是的。你应该这样做：jsonFile = 'file://c:/my/dir/structure/clusters.json'。只有当 HTML 文件从磁盘提供并且 json 文件在磁盘上时，它才有效。
或者您可以使用 FileReader，请参阅此处了解更多信息：html5rocks.com/en/tutorials/file/dndfiles。但我认为只有当负载由用户交互触发时才有效，比如点击按钮。我认为 AJAX 调用将是您最好的选择。
谢谢@Thijs，我修好了。我会尽快更新帖子以显示我的修复。

【解决方案2】：

尝试不使用JSON.parse(xxx)

您可以删除var jsonObj = JSON.parse(jsonFile);

JSON.parse 正在尝试将您的文件转换为 JSON 格式，该格式已经是 JSON。

只需在您的代码中使用jsonFile。

【讨论】：

【解决方案3】：

从您的代码看来，您正试图为 JSON.parse() 提供一个文件名作为参数。 JSON.parse() 接受一个字符串。您必须掌握文件内容，然后将其传递给 JSON.parse()。 This answer 可能会有所帮助。

JSON.parse() documentation

【讨论】：