fetch() 本地 JSON 文件中的数据

fetch() data from a local JSON file

提问人:SparkH 提问时间:9/19/2023 更新时间:9/20/2023 访问量:54

问:

即使 URL 路径看起来正确,我也对本地 JSON 文件上的 fetch 方法感到困惑。

提前致谢

   async function fetchLacsfromJSON(){
    try {
        const reponse = await fetch('/app/lacs.json', {
            method: 'GET',
            headers: {
              'Accept': 'application/json',
              'Content-Type': 'application/json',
            } })
            if (reponse.ok){
              const lacsData= await reponse.json();
              return lacsData;
          }
          else  {   
            console.error(`Erreur HTTP : ${reponse.status} - ${reponse.statusText}`);} 
    } catch (error) {
      console.error(`Une erreur s'est produite : ${error.message}`);
    }
  }

错误消息为:无法解析 /app/lacs.json 的 URL

在此处输入图像描述,我希望在控制台上收到此内容:

[{ "id":"1",
    "nom":"Lac d’Annecy",
    "region":"Auvergne-Rhône-Alpes"
    },
    {"id":"2",
     "nom":"Lac de Sainte Croix",
     "region":"Provence-Alpes-Côte d'Azur"
    },
    {"id":"3",
     "nom":"Lac du Salagou",
     "region":"Occitanie"
    }
]
JSON 解析 fetch urlfetch

评论

1赞 Dean Van Greunen 9/19/2023
您不能从磁盘加载文件,它需要由 Web 服务器提供,或者如果它是本地文件,您可以包含/导入它并直接使用它
0赞 Dean Van Greunen 9/19/2023
你可以这样做import jsonData from 'path/to/myJson.json'
0赞 Dean Van Greunen 9/19/2023
let jsonData = require('path/to/myJson.json');
0赞 Markus 9/20/2023
nodejs 情况下的交叉引用:stackoverflow.com/q/74769009/18667225

答:

0赞 SparkH 9/20/2023 #1

谢谢你的帮助!我删除了: { “type”:“模块” } 在我的package.json(因为我尝试了 node-fetch,import ...from) => 没用

以及带有 fetch on 的异步函数(本地 JSON 文件)。

刚刚输入了我的mainController:

const lacsData =require('../lacs.json'); 

在我删除了 async/fetch 组合后就足够了。

我用.map方法在我的数据上检索了我的数据,它有效