有没有办法从 chrome 的存储映像中获取 url？

Question

我正在构建一个 Chrome 应用程序，我从 XMLHTTPREQUEST 获取一个 .png 文件，该文件稍后使用 chrome.storage API 所以我可以稍后使用它，以防要使用该应用程序的人可以在没有连接到互联网的情况下访问它。问题是，在 html 中，你总是需要一个 url 来指定图像的存储位置，我已经尝试了所有方法从存储在 [= 中的 .png 文件中获取 url 31=] 存储但没有任何作用。

我正在寻求一种方法来从存储的图像中获取 url 以用于 html img。

这是我获取 .png 文件并将其存储在 chrome 存储中的代码。

var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://siteurl.com/image.png', true);
xhr.responseType = 'image/png';
xhr.onload = function(e) {
    chrome.storage.local.set({'iconImage':this.response}, function() {
        console.log('Image Saved');
    });
};
xhr.send();

这是从存储中获取图像的代码。

chrome.storage.local.get(function(image){
    var img = image.iconImage;

    //here is where I need to create the url so I can use it to 
      display the image in a <img>
});

谢谢你，如果我的英语看不懂，请见谅。

Answer 1

chrome.storage.local 只是一家 key:value 商店。它不提供任何使用 URL 访问值的方法。

如果您需要将图像存储在 URL 可以引用它的地方，您可以执行以下两种操作之一：

如果想保留在chrome.storage，临时做一个URL（关闭app会丢失），可以读取数据放入 ArrayBuffer 中，并从中构造一个 Blob 对象。

您可以从 Blob 中获取 URL，但它只是代表内存中对象的句柄，所以不要指望您可以保存该 URL 并永远使用它。应用关闭时内存会被回收，旧的BlobURL下次就失效了。
如果你想把它永久保存在某个地方，以便你可以保存 URL 并在将来使用它，那么你可以使用文件 API 来写入它到文件系统。

文件对象有一个 .toURL 方法，可以返回可用的 URL。 URL 将指向一个实际文件，即使在您重新启动应用程序后它仍然有效（直到您选择删除该文件。）

有没有办法从 chrome 的存储映像中获取 url？

Is there a way to get an url out of a chrome's storage image?

html

javascript

css

google-chrome-app