You need to enable JavaScript to run this app. 如何使用REST API从json-server获取指定嵌套JSON数据?
优惠活动
大模型
产品
解决方案
定价
更多

如何使用REST API从json-server获取指定嵌套JSON数据?

问题根源说明

首先你之前的请求未生效,核心原因是两点:

  • 你当前托管的JSON顶层仅包含data键,对应的值是普通对象而非数组,不符合json-server的标准REST资源设计逻辑
  • json-server的查询过滤参数(如?xxx=yyy)仅支持筛选数组类型的集合资源,当目标资源是普通对象时,查询参数不会触发过滤逻辑,会直接返回整个资源对象

可行解决方案

方案1:调整JSON结构适配原生查询逻辑(推荐)

json-server原生过滤能力仅对数组类型的资源生效,你可以把原本嵌套在data.program下的训练日数据调整为顶层数组结构,给每个训练日添加dayName标识字段,示例结构如下:

{
  "user": [{"username": "Pedro", "id":1 }],
  "program": [
    {
      "dayName": "Day 1",
      "content": [
        {
          "muscleGroup": "Chest",
          "warmUp": ["parallel bar dips"],
          "main": ["Bench Press", "Inclined Bench press", "Decline Bench press"],
          "secondary": ["Dumbbell Flys", "Cable Crossover Flys", "Pec-deck Fly"]
        },
        {
          "muscleGroup": "Biceps",
          "main": ["Barbell Curl", "Preacher Curl"],
          "secondary": ["Hammer Curls", "Cable Curl", "Dumbbell Curl"]
        }
      ]
    },
    {
      "dayName": "Day 2",
      "content": [
        {
          "muscleGroup": "Shoulders",
          "warmUp": ["parallel bar dips"],
          "main": ["Bench Press", "Inclined Bench press", "Decline Bench press"],
          "secondary": ["Dumbbell Flys", "Cable Crossover Flys", "Pec-deck Fly"]
        },
        {
          "muscleGroup": "Abs",
          "main": ["Crunch", "Leg raises"]
         }
      ]
    }
  ]
}

调整后直接发起请求即可精准获取对应训练日内容:
http://localhost:3004/program?dayName=Day%201
后续还可以直接复用json-server的分页、排序、模糊搜索等原生能力,扩展性更强。

方案2:自定义路由(无需修改原有JSON结构)

如果不想改动现有JSON结构,可以通过自定义路由配置定向映射嵌套路径:

  1. 新建配置文件json-server.json,写入路由映射规则:
    {
      "routes": {
        "/program/:dayName": "/data/program/:dayName"
      }
    }
    
  2. 启动json-server时加载该配置文件,执行命令:
    json-server --watch 你的JSON文件名.json --config json-server.json
  3. 直接请求对应路径即可获取目标内容:
    http://localhost:3004/program/Day%201

临时兜底方案

如果只是临时调试不想改动任何配置,可以先请求http://localhost:3004/data拿到全量数据,再在前端代码中提取data.program["Day 1"]字段的内容即可,这种方式不符合定向获取的需求,仅适合临时调试使用。

内容的提问来源于stack exchange,提问作者João Pedro

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.11.09 03:15:04