在Chrome扩展中存储静态JSON数据的位置在哪里?

5

我的扩展程序中有大约350行静态JSON数据。这些数据在内容脚本中使用,且全部都是必需的。它们是一组键值对列表。每当用户点击页面时,就会检查所有键是否符合条件,并执行相应的操作。类似于:

{
    "ABC": 323.32,
    "BDS": 23.12,
    "GTO": 96.52
}

最好把它放在哪里?我想到了三个主意:

  • 直接在内容脚本中包含它。
  • 在事件页中加载并使用消息传递来检索数据。
  • 将其存储在JSON文件中并通过XHR“某种方式”检索它。但我认为那个不可能。

我知道localStorage,也看过Chrome的各种其他类型的存储。但是,它们似乎是用于在用户使用扩展时生成的数据。

我的数据是静态的。一旦安装了扩展程序,它就不会改变。也就是说,直到扩展程序接收到更新并最终修改它为止。

现在,数据在内容脚本内部。我认为这不太好,因为它每次打开页面时都会被加载,但它根本不会改变。出于这个原因,事件页似乎更合适。然而,是否有针对这种数据类型的“设计”?


它实际上是JSON还是对象字面量? - Makyen
@Makyen 编辑过。 - dodov
1
如果每次加载内容脚本时都需要全部数据,那么将其保留为内容脚本中的“对象字面量/对象初始化程序”即可。其他任何操作都会增加复杂性和额外的处理要求。如果您实际的数据源是JSON,则可以将其作为JSON字符串放在内容脚本中,并使用JSON.parse()进行解析,但即使如此也会增加一些开销。 - Makyen
1
不,那样并没有更好。这些数据在内部以JSON格式存储,加载它需要更多的处理。你说过你需要所有的数据,在用户每次点击页面时都需要。这足以接近于在每个内容脚本中始终需要所有的数据,因此在相对较少的用户不点击页面的情况下,不在内容脚本中拥有该对象所带来的任何可能节省都被额外的处理所抵消。 - Makyen
1
如果您想在后台脚本中执行比较(将点击信息发送到后台页面并获取响应),那可能会更加节省内存,但这真的取决于您需要进行此类比较的频率以及是否愿意让比较发生在后台脚本中。对于350x 3个字符字符串和一个数字,这仍然可能不是更有效的方法。无论如何,您都比那些为了在自己的脚本中节省一些字符而在每个页面加载85kiB jQuery的扩展开发人员做得好多了。 - Makyen
显示剩余2条评论
1个回答

7

您可以使用XHR或fetch来检索它。使用chrome.extension.getURL获取文件的URL。

以下代码应该有效:

fetch(chrome.extension.getURL('/data.json'))
    .then((resp) => resp.json())
    .then(function (jsonData) {
        console.log(jsonData);
    });

您还需要将其添加到您的manifest.json文件中:

"web_accessible_resources": [
  "data.json"
],

只有在数据很少被访问时,这才有所帮助。如果每个内容脚本都需要每次访问它,那么与将其存储为内容脚本中的对象文字相比,这并没有任何优势。 - Makyen
1
@Makyen同意,我主要是在回答这个问题的第三点,即OP认为根本不可能。在我看来,最好将这些数据存储在chrome.storage.local中,在扩展程序首次安装或更新时,在chrome.runtime.onInstalled事件中将数据移动到那里。然后,您可以在需要时逐个检索信息片段。或者将其存储为对象文字在后台脚本中,并使用消息从内容脚本中按需检索其部分(尽管它会占用RAM)。我不太自信建议哪种特定方法是最好的。 - Walk

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接