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 を返します。

4

2 に答える 2

2

fetch specによると、 のステータスは0エラーを表します。ステータス メッセージを確認することをお勧めします。サードパーティのサイトから取得しているため、これは CORS 関連のエラーであると思います。Matt Gaunt's Introduction to Service Worker から:

デフォルトでは、CORS をサポートしていない場合、サード パーティの URL からのリソースのフェッチは失敗します。これを克服するためにリクエストに非 CORS オプションを追加できますが、これにより「不透明な」レスポンスが発生し、レスポンスが成功したかどうかを判断できなくなります。

mode: 'no-cors'彼がそこに提案するように設定してみてください。

于 2015-09-02T17:22:09.940 に答える