JavaScript - 检查 Object URL 是否已被使用

Question

我可以像这样创建 object URL ：

let pixel = "iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==";
let data = atob(pixel);
let buffer = new ArrayBuffer(data.length);
let array = new Uint8Array(buffer);
for (var i = 0;i<data.length;i++){
    array[i]=data.charCodeAt(i);
}
let blob = new Blob([buffer], {type: 'image/jpeg'});
let url = URL.createObjectURL(blob);

我可以像这样撤销 object URL ：

URL.revokeObjectURL(url);

但我想做的是在一次使用后自动撤销 URL。

有没有办法检查 object URL 是否已被访问？

先感谢您。

编辑：

在这种情况下，当我使用 URL 时，我不能只触发 function。 相反，我希望能够检查它是否已在页面之外使用。 例如，如果有人在地址栏中键入 URL，则无法调用 javascript AFAIK。

Answer 1

如果您没有 API 来执行此操作，您可以使用localStorage进行跟踪。

你可以有两种方法，

• addUrlStatus - 将 url 作为输入并检查它是否在过去被访问过。

• updateUrlStatus - 一旦用户使用了 url（不确定在您的代码中定义了什么操作），它将在localStorage中将 url 的状态设置为true 。

所以你可以做类似的事情，

let pixel = "iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==";
let data = atob(pixel);
let buffer = new ArrayBuffer(data.length);
let array = new Uint8Array(buffer);
for (var i = 0;i<data.length;i++){
    array[i]=data.charCodeAt(i);
}
let blob = new Blob([buffer], {type: 'image/jpeg'});
let url = URL.createObjectURL(blob);
addUrlStatus(url);


function addUrlStatus(url) {
  var _url = localStorage.getItem(url);
  if(!_url) {
    localStorage.setItem(url, false); // false indicates it hasn't been used yet.
    return;
  }
}


// this function needs to be called when the user has used the url.
function updateUrlStatus(url) {
  localStorage.setItem(url, true);
  URL.revokeObjectURL(url);
}