web-dev-qa-db-ja.com

異なるサブドメインからService Workerを登録する方法

https://abc.xxxx.comhttps://xyz.xxxx.com の2つのサブドメインがあります。だから私の質問:

1)。 https://abc.xxxx.com から https://xyz.xxxx.com のService Workerを登録することは可能ですか?はいの場合、どのように?

2)。 if http://abc.xxxx.comhttpinsecure)とにかくサービスワーカーを登録 https://xyz.xxxx.com from http://abc.xxxx.com iframeなどのように...

これは実際の状況です。複数のサブドメインに直面しています。助けてくれてありがとう。前もって感謝します。

20
Yogendra

あなたの質問であなたが提起するさまざまなポイントに対処する必要があると私が思ういくつかの一般的な答えはここにあります:

  • 登録された各Service Workerには、関連付けられた scope があり、Service Workerが制御できるWebページのセットを指示します。 Service WorkerのscopeはURLであり、そのURLはService Workerを登録するページと同じオリジンである必要があり、ページと同じパスレベルに対応するURLまたは1つ以上のレベルのパス。既定のscopeは、Service Workerスクリプトの場所と同じパスレベルに対応しています。この制限のため、1つの(サブ)ドメインのページからnavigator.serviceWorker.register(...)を呼び出して、別の(サブ)ドメインのページを制御するService Workerを作成することはできません。

  • _https:_ページで_<iframe>_ _http:_をスローし、それを使用してService Workerを登録できないようにするための制限があります。 https iframe内にService Workerを登録するときに DOMExceptionを参照してください

  • それがあなたの質問に直接関連していることはわかりませんが、サービスワーカーコード内で_http:_リソースに対して明示的にfetch()を呼び出すと、現在のバージョンのChromeでエラーが発生します。 content fetch() sは、Service Worker内では許可されていません。全面的に100%解決されているかどうかはわかりませんが、 この未解決のバグ は依然として関連しています。

_abc.123.com_と_xyz.123.com_の両方に存在するページがあり、両方のページセットをService Workerで制御する場合は、2つの個別のService Worker登録が必要です。各登録は、トップレベルページに対応するそれぞれのドメインでホストされているService Worker JSファイルのコピーに対するものである必要があり、すべてのページとService Workerスクリプトは_https:_経由でアクセスする必要があります。

つまり、あなたはcanページにクロスドメイン_<iframe>_を含めることにより、別のドメインのService Worker登録を開始しますが、ホストページと_<iframe>_の両方を_https:_を介して提供する必要があります。通常のService Workerスコープ制限が適用されるため、たとえば、_https://other-domain.com/_スコープ全体をカバーする他のドメインのService Workerを登録する場合は、Service Workerスクリプトの場所を確認する必要があります登録されているのはトップレベルです、例えば_https://other-domain.com/service-worker.js_ではなく_https://other-domain.com/path/to/service-worker.js_。これは、たとえば、 _<amp-install-serviceworker>_ element を介して AMPプロジェクト によって使用されるアプローチです。

16
Jeff Posnick

Service Worker scripts must be hosted at the same Origin (Protocol + Domain name + Port).各サブドメインは異なるオリジンと見なされるため、それぞれにService Workerを登録する必要があります。これらの各ワーカーには、独自のcacheおよびscopeがあります。

4

Nginx proxy_passを使用してみてください。この仕事は私にとって。

0
Rick