不支持 user.json 中的“id”（数字）类型。使用 json-server 时使用对象或对象数组错误，为什么？

Question

我正在开发一个 Angular 4 应用程序。我正在尝试从 JSON 文件中获取数据以构建用户仪表板。

我创建了一个 json 文件并尝试使用 JSON 服务器加载它：$ json-server --watch user.json我收到以下错误：

不支持 user.json 中的“id”（数字）类型。使用对象或对象数组。.

当我删除文件中的“id”字段时，我收到与“name”相同的错误。

我觉得我创建 json 文件的方式有问题。我是 Web 开发的新手，所以不要介意这是一个非常基本的错误。

这是我的 json 文件：

{
 "id": 1,
 "name":"Kajal Agarwal",
 "department":"Information Technology",
 "college":"Indian Institute of Engineering Science and Technology, Shibpur",
 "subjects":[
    {
        "title":"Data Structures",
        "active":true,
        "faculty":"Prasun Ghosal",
        "notifications":4,
        "color":"#9c27b0"
    },
    {
        "title":"Operating System",
        "active":true,
        "faculty":"Niharika Singh",
        "notifications":0,
        "color":"#ffc107"
    },
    {
        "title":"Algorithms",
        "active":true,
        "faculty":"Debojit Mondal",
        "notifications":1,
        "color":"#009688"
    },
    {
        "title":"Web Technologies",
        "active":true,
        "faculty":"Shantanu Saurabh",
        "notifications":2,
        "color":"#ff5722"
    },
    {
        "title":"Formal Language and Automata Theory",
        "active":true,
        "faculty":"Sudhanshu Sekhar",
        "notifications":3,
        "color":"#03a9f4"
    },
    {
        "title":"Digital Logic and Circuit Design",
        "active":false,
        "faculty":"",
        "notifications":0,
        "color":"#9e9e9e"
    }
  ]
}

Answer 1

也许我的回复迟到了，但这仅适用于未来的读者，因为在我对 json-server 有更多了解之前，我也遇到了类似的问题。

因此，您的 JSON 对象没有任何问题。您收到该错误的原因与 json-server 的工作方式有关。

在 JSON 对象的根直接公开的每个键都被视为 json-server 中的单独 URL。在您的情况下，如果您将整个 JSON 对象包装在一个键中，例如：' data '，您的错误将得到解决。您的 JSON 对象如下所示

{
"data":{
 "id": 1,
 "name":"Kajal Agarwal",
 "department":"Information Technology",
 "college":"Indian Institute of Engineering Science and Technology, Shibpur",
 "subjects":[
    {
        "title":"Data Structures",
        "active":true,
        "faculty":"Prasun Ghosal",
        "notifications":4,
        "color":"#9c27b0"
    },
    {
        "title":"Operating System",
        "active":true,
        "faculty":"Niharika Singh",
        "notifications":0,
        "color":"#ffc107"
    },
    {
        "title":"Algorithms",
        "active":true,
        "faculty":"Debojit Mondal",
        "notifications":1,
        "color":"#009688"
    },
    {
        "title":"Web Technologies",
        "active":true,
        "faculty":"Shantanu Saurabh",
        "notifications":2,
        "color":"#ff5722"
    },
    {
        "title":"Formal Language and Automata Theory",
        "active":true,
        "faculty":"Sudhanshu Sekhar",
        "notifications":3,
        "color":"#03a9f4"
    },
    {
        "title":"Digital Logic and Circuit Design",
        "active":false,
        "faculty":"",
        "notifications":0,
        "color":"#9e9e9e"
    }
  ]
}
}

现在，如果您尝试从如下所示的 URL 访问根密钥。您将能够获取整个 JSON 对象。

localhost:3000/data

如果您要在 JSON 对象的根添加另一个名为“ data2 ”的键并分配一些其他对象，那么您将拥有另一个 URL，如下所示

localhost:3000/data2

希望这是有道理的并且有帮助。您也可以访问此处查看 json-server 工作原理的示例

Answer 2

该错误告诉您该怎么做。使用对象或对象数组

Id 应该是对象或对象数组，其余属性相同。

也许你应该考虑编辑你的 user.json

建议：

{
    "about" : [{
            "id" : 1,
            "name" : "Kajal Agarwal",
            "department" : "Information Technology",
            "college" : "Indian Institute of Engineering Science and Technology, Shibpur"
        }
    ],
    "subjects" : [{
            "title" : "Data Structures",
            "active" : true,
            "faculty" : "Prasun Ghosal",
            "notifications" : 4,
            "color" : "#9c27b0"
        }, {
            "title" : "Operating System",
            "active" : true,
            "faculty" : "Niharika Singh",
            "notifications" : 0,
            "color" : "#ffc107"
        }, {
            "title" : "Algorithms",
            "active" : true,
            "faculty" : "Debojit Mondal",
            "notifications" : 1,
            "color" : "#009688"
        }, {
            "title" : "Web Technologies",
            "active" : true,
            "faculty" : "Shantanu Saurabh",
            "notifications" : 2,
            "color" : "#ff5722"
        }, {
            "title" : "Formal Language and Automata Theory",
            "active" : true,
            "faculty" : "Sudhanshu Sekhar",
            "notifications" : 3,
            "color" : "#03a9f4"
        }, {
            "title" : "Digital Logic and Circuit Design",
            "active" : false,
            "faculty" : "",
            "notifications" : 0,
            "color" : "#9e9e9e"
        }
    ]
}