☰

サービスワーカーに「エラー - 安全なオリジンのみが許可されています」と表示されるのはなぜですか? 質問する

tag-icon • tag-icon javascript jquery progressive-web-apps
サービスワーカーに「エラー - 安全なオリジンのみが許可されています」と表示されるのはなぜですか? 質問する

プログレッシブ ウェブ アプリ ページにサービス ワーカーを追加しようとすると、ブラウザー コンソールに次のエラーが表示されるのはなぜですか?

ERROR "Uncaught (in promise) DOMException: Only secure origins are allowed

JS コード:

(function () {
    'use strict';

    // TODO add service worker code here
    if ('serviceWorker' in navigator) {
        navigator.serviceWorker
            .register('service-worker.js')
            .then(function () {
                console.log('Service Worker Registered');
            });
    }
})();

ベストアンサー1

からサービスワーカーに関するよくある質問:

Q: 「安全なオリジンのみが許可されます」というエラー メッセージが表示されます。なぜですか?

答え:サービスワーカーは、強力な新機能のために安全なオリジンを優先するというポリシーに沿って、「安全なオリジン」（基本的にはHTTPSサイト）でのみ利用可能です。ただし、http://ローカルホストも安全なオリジンと見なされるため、可能であれば、localhost で開発すると、このエラーを簡単に回避できます。

コマンドライン フラグを使用することもできます--unsafely-treat-insecure-origin-as-secure。このフラグはフラグと組み合わせる必要があります--user-data-dir。例:

$ ./chrome --user-data-dir=/tmp/foo --unsafely-treat-insecure-origin-as-secure=http://your.insecure.site

テストしたい場合https://ローカルホスト自己署名証明書の場合は、次の操作を実行します。

$ ./chrome --allow-insecure-localhost https://localhost

フラグも役に立つかもしれません--ignore-certificate-errors。

おすすめ記事