javascript - 在 Chrome/Chromium 插件中检查互联网连接；加载的图像已缓存

Question

我正在尝试检查 Chrome 插件中是否存在互联网连接。虽然有可用的 API 调用建议进行检查，但理论上它只检查是否有可能的互联网连接。 为了获取此信息，我尝试加载图像

checkConnection() {
    var newImg = new Image;
    newImg.src = url;
    newImg.onload = function() { ... }
    newImg.onerror = function() { ... }
}

我确实使用 Image 对象来避免在使用带有 JavaScript 的 get 请求时发生的所有这些同源策略问题(我使用的是插件中的代码，因此没有地址与我的代码:/)。原则上，我上面的代码有效。我有一个每隔一段时间调用 checkConnection 的 setTimeout。但是，当图像成功加载一次(每次插件重新加载)时，它会存储在缓存中，并在连接失败时从那里加载。

你知道如何绕过这个问题吗？或者您是否知道一种聪明的方法可以从 Chrome 插件检查互联网连接，而无需设置可能容忍我的请求来源的服务器？

Answer 1

我知道你有 3 个选项......

正在检查互联网连接

快速谷歌搜索后，我找到了 navigator.onLine .看起来您可以使用它来检查互联网连接，但它并不总是完全准确。

停止缓存图片

如果您可以控制托管图像的域，您可以设置 header 告诉浏览器不要缓存图像。

Cache-Control: no-cache, must-revalidate // HTTP/1.1
Expires: Sat, 26 Jul 1997 05:00:00 GMT // Date in the past

如果您无法控制域，请在加载图像时尝试使用随机数或当前时间戳将 GET 变量附加到 URL。

例如

https://example.com/image.png?time=1496222683
https://example.com/image.png?time=1496223323
https://example.com/image.png?time=1496222313

这可以诱使浏览器认为您正在请求新资源。