logo标签列表

服务工作者图像状态码

javascriptservice-worker
3

我尝试使用Service Worker检测图片的404错误。 有没有一种方法可以获取图片获取的状态码？

self.addEventListener('fetch', function(event) {

    console.log('Handling fetch event for %s', event.request.url);

    event.respondWith(
        fetch(event.request).then(function(response) {

            if (response.status == 200) {
                return response;                    
            }
            else {
                /* return some default image */
            }

        })        
    );

});

这段代码在处理html文件时表现良好，但当它获取图片时，状态码始终为0。有没有办法获取图像的状态码？为了让示例更简单，我移除了缓存和其他一切。

这是我尝试加载的示例页面：

<body>
    <!-- This image is working -->
    <img src="http://www.google.ca/images/srpr/logo11w.png">
    <!-- This image returns 404 -->
    <img src="http://www.google.ca/images/srpr/00000.png">
</body>

所以HTML页面本身的状态为200，但两个图像的状态都为0。
2个回答
5

当您的请求不使用CORS时，您将得到一个不透明的过滤响应，这是预期的。在这种情况下，0状态是有意模糊的--如果使用真实的状态代码，则会泄漏没有CORS时无法获得的信息。

在这个fetch规范的问题中有一些背景信息。

2
根据获取规范，状态码0表示错误。您可能需要检查状态消息。我猜测这是一个CORS相关的错误，因为您正在从第三方站点获取数据。来自Matt Gaunt的Service Worker入门：

默认情况下，从第三方URL获取资源将失败，如果它不支持CORS。您可以在请求中添加一个非CORS选项来克服此问题，尽管这将导致'opaque'响应，这意味着您将无法确定响应是否成功。

请按照他在那里建议的设置mode：'no-cors'。
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接