如何在不编辑的情况下使用原始数据文件答案

【问题标题】：How to use raw data file without editing it如何在不编辑的情况下使用原始数据文件
【发布时间】：2021-08-02 21:22:06
【问题描述】：

我有一个 JSON 文件，其中包含多维信息数组。我想用它来填充网页，但我不想手动修改文件的内容。由于内容，我无法包含文件的 sn-p，但它看起来像：

{"something":{"value1":0,"value2":0,"value3":10000,"value4":"*"}}

如果文件格式如下，我可以使用数据：

var data = [{"something":{"value1":0,"value2":0,"value3":10000,"value4":"*"}}]

但如上所述，我不想手动添加“数据”的声明（和方括号）。

如何在我的 html 页面中执行此操作？我需要找到一种方法来添加和追加、保存在新文件中，还是有其他方法？

感谢您的帮助。

【问题讨论】：

您可以使用 JS 将文件作为文本/字符串读取，然后将方括号附加/添加到该文件中。然后使用 JSON.parse(json_string);将其转换为 JSON 对象。
@ShanieMoonlight 我可以在不使用服务器的情况下做到这一点吗？该文件将在同一个文件夹中，我似乎无法看到没有服务器（XMLHTTP 请求）的方式。
这里有一些答案：stackoverflow.com/questions/14446447/…
该页面的浏览量为 140 万 - 我想我是其中的一半！我在该页面上尝试的每个选项都会给我“CORS”错误。您还有其他方法可以推荐吗？
文件是在服务器上还是在用户PC上？

标签： javascript html arrays json

【解决方案1】：

这是一种基于此从用户 PC 读取文件的方法：SO Answer

HTML：

  <input type='file' accept='text/plain' onchange='openFile(event)'>

JS：

var openFile = function(event) {

  var input = event.target
  var reader = new FileReader()

  reader.onload = function(e) {

    const jsonTxt = e.target.result.toString()
    const jsonTxtArray = '[' + jsonTxt + ']'
    console.log('obj', JSON.parse(jsonTxtArray))

  }

  reader.readAsText(input.files[0]);

}

这是一个工作示例：fiddle

【讨论】：

.toString() 是不必要的，。既然可以使用[JSON.parse(text)]，为什么还要用括号括起来？以及为什么还要使用 FileReader：[await new Response(file).json()]
在页面加载时是否有办法做到这一点 - 所以自动设置文件名 - 例如，要使用的文件将始终称为“thisfile.txt” - 或其他像那样？这样，当文本文件更新时，他们只需刷新网页，就会使用该文件的最新版本。
@Endless 你能发布你的答案吗？我没用过Response(file)。我希望看到更好的解决方案。 ToString 可能是不必要的，我只是谨慎
@ShanieMoonlight 我不确定这个或我的答案是否是正确的答案......但这里有一个 jsfiddle 几乎可以做你正在做的事情：jsfiddle.net/1n3f7pmx
@Endless 我喜欢！