ストレージイベント、JSページ間の通信方法の紹介

ページを書いていると、2つのページ間でデータやイベントを転送する必要があるという要件に遭遇することがあります。このとき、今日説明するストレージ イベントを使用する必要があります。このイベントを学習する前に、localStorage の使用方法を理解する必要があります。具体的な使用方法については、他のドキュメントを参照してください。ストレージ イベントをトリガーする条件は次のとおりです:

1. 同じブラウザが同じオリジンを持つ 2 つのページを開く

2. localStorageが 1 つの Web ページで変更されるlocalStorage

3. 另一网页注册了storage

storage イベントは同じソースページにのみ影響し、異なるソースには影響しません。では、相同性とは何でしょうか?

URL はプロトコル、ドメイン名、ポート、パスで構成されます。2 つの URL のプロトコル、ドメイン名、ポートが同じである場合、それらは同じ生成元であることを意味します。例:

http://www.wszdaodao.cn/demo/index.html //这个网址，协议是http://域名是www.wszdaodao.cn，端口是80（默认端口可以省略） //对比URL： http://www.wszdaodao.cn/demo2/other.html //同源 http://www.wszdaodao.cn:81/demo/index.html //不同源 http://sxh.wszdaodao.cn/demo/index.html //不同源 http://www.mamama.cn/demo/index.html //不同源

したがって、テストするときは、必ず同じソースページであることを確認してください。

以下は、PageA と pageB の間で通信するインタラクション コードです。

ページ A: localStorage をセットアップする

    
  click   

ページ B: ストレージ イベントをリッスンする

以上がストレージイベント、JSページ間の通信方法の紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。