首先，创建一个json文件。在这个例子中，我的文件是words.json

[(“点名”:“艾”,“id”:“533”), (“点名”:“kiy”、“id”:“33”)、 (“点名”:“报告”、“id”:“33”)、 (“点名”:“报告”、“id”:“3”), (“点名”:“kiy”、“id”:“35”)、 (“点名”:“kiy”、“id”:“34”)]

这是我的代码，也就是node。js。请注意readFileSync的'utf8'参数:这使得它返回的不是Buffer(尽管JSON。Parse可以处理它)，但是一个字符串。我正在创建一个服务器来查看结果…

var fs=require（'fs'）; var data=fs.readFileSync（'words.json'， 'utf8'）; var words=JSON.parse（data）; var bodyparser=require（'body-parser'）; 控制台.log（字）; var express=require（'express'）; var app=express（）; var server=app.listening（3030，listening）; 函数侦听（）{ console.log（“聆听..”）; } app.use（express.static（'website'））; app.use（bodyparser.urlencoded（{extended：false}））; app.use（bodyparser.json（））;

当你想读取特定的id细节时，你可以把代码提到..

应用程序。得到(' /得到/ res:函数(req, id’)( var的; for (i = 0; i < words . length; + + i) ( if (words [i]。id = = id req params。)( 发送(words [res]); ) ) 游戏机。log(“成功”); ');

当您作为localhost:3030/get/33输入url时，它将给出与该id相关的详细信息....你也念名字。我的json文件有类似的名称与这段代码，你可以得到一个名称详细信息....它并没有打印所有相似的名字

应用程序。得到(' /得到/ res:函数(req, name’)( var的; for (i = 0; i < words . length; + + i) ( if (words [i]。id = = req . params名称)( 发送(words [res]); ) ) 游戏机。log(“成功”); ');

如果希望读取类似的名称详细信息，可以使用这段代码。

app.get(/ /名称/:名称,功能(要求,res) { Word = words.filter(函数(val){ 返回val.name === req.params.name; })； res.send(词); console.log(“成功”); })；

如果您想读取文件中的所有信息，请使用下面的代码。

app.get (' / ', sendAll); 函数sendAll(请求、响应){ response.send(单词); ｝

您可以使用fetch()在async await的帮助下完成此操作。这是从url获取数据的最新和最安全的方式。

const url = "../asset/videoData.json";

const fetchJson = async () => {
  try {
    const data = await fetch(url);
    const response = await data.json();  
  } catch (error) {
    console.log(error);
  }
 };

你也可以使用它从外部url获取数据。

要使用javascript读取外部本地JSON文件(data. JSON)，首先要创建数据。json文件:

data = '[{"name" : "Ashwin", "age" : "20"},{"name" : "Abhinandan", "age" : "20"}]';

然后,

在脚本源代码中提到json文件和javascript文件的路径 <script type="text/javascript" src="data.json"></script> .json . <script type="text/javascript" src="javascript.js"></script> .js 从json文件中获取Object var mydata = JSON.parse(data); 警报(mydata [0] . name); alert (mydata [0] .age); 警报(mydata [1] . name); alert (mydata [1] .age);

有关更多信息，请参阅此参考资料。

一个简单的解决方法是将JSON文件放在本地运行的服务器中。为此，从终端转到您的项目文件夹，并在某些端口号上启动本地服务器，例如8181

python -m SimpleHTTPServer 8181

然后浏览到http://localhost:8181/应该会显示您的所有文件，包括JSON。如果您还没有安装python，请记住安装python。

上面提到的所有解决方案只有在本地主机上运行本地web服务器时才有效。如果你想要在没有web服务器的情况下实现这一点，你可能需要通过使用文件上传控制来手动上传JSON文件。由于安全风险，如果没有本地服务器，浏览器将不提供此功能。

你也可以在没有本地服务器的情况下解析上传的文件。这里是示例代码，我已经实现了一个解决类似的问题。

 <div id="content">
    <input type="file" name="inputfile" id="inputfile">
    <br>

    <h2>
        <pre id="output"></pre>
    </h2>
</div>
<script type="text/javascript">
    document.getElementById('inputfile')
        .addEventListener('change', function () {

            let fileReader = new FileReader();
            fileReader.onload = function () {
                let parsedJSON = JSON.parse(fileReader.result);
                console.log(parsedJSON);
                // your code to consume the json                    
            }
            fileReader.readAsText(this.files[0]);
        }) 
</script>

在我的情况下，我想读取一个本地JSON文件，并在桌面上的html文件中显示它，这就是我所要做的。

注意:不要尝试使用JavaScript自动上传文件，由于浏览器施加的安全限制，即使这样做也是不允许的。

你可以像ES6模块一样导入它;

import data from "/Users/Documents/workspace/test.json"