この記事は機械翻訳のミラー記事です。元の記事にジャンプするにはこちらをクリックしてください。

眺める: 4712|答える: 2

[HTML/HTML5] HTML5 PostMessage クロスウィンドウ通信

[リンクをコピー]
掲載地 2022/07/30 22:07:04 | | | |
PostMessageはhtml5で導入された新しいクロスオリジン通信APIで、メインページおよび任意のフレームクラスページやwindow.openで開かれたページと双方向で通信できるようにします。 その一般的な運用プロセスは以下の通りです。



JSは現在のページがiframeかポップアップウィンドウかを判断します
https://www.itsvse.com/thread-10342-1-1.html


postMessage(data,origin)メソッドは2つのパラメータを受け付けます:

(1) データ:渡すデータ、HTML5仕様ではパラメータは任意の基本的なJavaScriptタイプや再現可能なオブジェクトでよいと述べられていますが、すべてのブラウザがこれを行っているわけではなく、一部のブラウザは文字列パラメータのみを扱えるため、パラメータを渡す際にオブジェクトパラメータをシリアライズするためにJSON.stringify()メソッドを使う必要があり、同様の効果を得るためにIEの下位バージョンの json2.jsを参照する必要があります。

(2) origin:文字列パラメータ、ターゲットウィンドウのソースを示すプロトコル + host + ポート番号[+URL]。URLは無視されるため書き込むことはできません。このパラメータはセキュリティ上の理由です。postMessage()メソッドは指定されたウィンドウにのみメッセージを渡します。もちろん、もし望むならパラメータを「*」に設定することもでき、任意のウィンドウに渡すことができます。現在のウィンドウと同じオリジンを指定する場合は「/」に設定します。


自分でメッセージを送り受けて受信する

コードは以下の通りです:



親ウィンドウは子ウィンドウにメッセージを送信し、子ウィンドウはメッセージを受け取ります

コードは以下の通りです:




子ウィンドウは親ウィンドウにメッセージを送信し、親ウィンドウはメッセージを受け取ります

コードは以下の通りです:



さらに、以下のアドレスでドメイン間メッセージング用のシンプルなリスナー/クライアントモードがクライアントに接続されています:ハイパーリンクのログインが見えます。

(終わり)




先の:JSは現在のページがiframeかポップアップウィンドウかを判断します
次に:DockerはコンテナのCPU、メモリ、その他のリソースを変更・制限します
掲載地 2022/07/30 22:46:07 |
学ぶことを...
 地主| 掲載地 2023/02/18 21:25:31 |
ポストロボットによるブラウザウィンドウ通信の例
https://www.itsvse.com/thread-10428-1-1.html
免責事項:
Code Farmer Networkが発行するすべてのソフトウェア、プログラミング資料、記事は学習および研究目的のみを目的としています。 上記の内容は商業的または違法な目的で使用されてはならず、そうでなければ利用者はすべての結果を負うことになります。 このサイトの情報はインターネットからのものであり、著作権紛争はこのサイトとは関係ありません。 ダウンロード後24時間以内に上記の内容を完全にパソコンから削除してください。 もしこのプログラムを気に入ったら、正規のソフトウェアを支持し、登録を購入し、より良い本物のサービスを受けてください。 もし侵害があれば、メールでご連絡ください。

Mail To:help@itsvse.com