时间戳

首页 > 解决方案 > 使用 ftp:/// 加载大型 json 对象的有效方法

javascript - 使用 ftp:/// 加载大型 json 对象的有效方法

问题描述

我有一个大的 json 对象（最大 200 MB 或更多）。它存储通过 plotly.js 渲染图形所需的值。

我试图将 json 对象合并到 html 中，方法是使用text/javascript和application/json/或将 json 存储在外部 javascript 代码中，并使用 script 标签加载它。这两种方法都需要花费大量时间来加载 HTML 页面（大约 20-30 秒）。

由于我无法使用协议读取本地文件，出于安全原因，由于CORS 策略ftp:///，该协议被 chrome 阻止，因此我无法将数据存储在本地文件中，稍后再读取。

有没有更有效的方法将大型 json 文件嵌入到 html 文件中？也许我们可以稍后用 json 对象评估代码？

标签： javascripthtmljsonftp-client

解决方案

我找到了解决方法。首先，global variable用js文件定义数据。其次，稍后通过单击按钮或其他事件加载js文件。

// data.js
window.data = [1, 2, 3]

// load the data with the script tag.
const scriptTag = document.createElement("script");
scriptTag.src = "./data.js";
scriptTag.onload = () => console.log("loaded")
document.head.appendChild(scriptTag);

所以现在，我可以将大数据拆分为单独的变量并稍后加载。

推荐阅读