如何强制“另存为”、“下载链接”不忽略活动服务工作者？

Question

如何强制“另存为”、“下载链接”不忽略活动服务工作者？

javascripthyperlinkdownloadservice-worker

3

我有一个带有活动服务工作者的网页。该页面具有带有 <a> 的链接，当单击时，请求会被服务工作者拦截，如预期所示。但是，当用户右键单击链接并选择“另存为...”时，服务工作者将被忽略（并发送到服务器的正常请求，就像没有服务工作者一样）。

如何强制“另存为”功能通过服务工作者进行？

答案应该依靠将链接更改为按钮或更改非服务工作者客户端部分。

- Walle Cyril

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- guest271314 · Accepted Answer

你可以将href设置为javascript:void(0)，使用data-*属性存储应该获取的URL，在<a>元素的click事件中使用fetch()方法，这将发出ServiceWorker可以拦截的请求。

<!DOCTYPE html>
<html>

<head>
</head>

<body>
<a href="javascript:void(0)" 
  data-href="placehold.it/1x1" 
  title="placehold.it">placehold.it</a>
<script>
  document.querySelector("a").onclick = function(e) {
    e.preventDefault();
    var request = fetch(location.protocol + "//" + this.dataset.href);
    request.then(response => response.blob())
    .then(blob => console.log(blob))
  }
</script>
</body>

</html>