最近、プロジェクトで作業しているときに webSocket プロトコルを使用し、WeChat アプレットで webSocket を使用しました。WeChat アプレットで wss プロトコルを使用する場合、ポートを設定できず、デフォルトのポート 443 のみを使用できます。しまった、私の https はすでにポート 443 でリッスンしていて、webSocket も 443 でリッスンしているので、これは絶対に機能しません。解決策を見つけるために、上司は私にこの問題を与え、私は喜んで(手動で混乱しながらも)この仕事を引き受けました。私は2つの解決策を考えました。 1 つの解決策は、別のサーバーに webSocket を展開することですが、これはコストがかかりすぎます。別の方法は、nginx リバース プロキシを使用することです。 webSocket プロトコルは http プロトコルに基づくアップグレードであるため (下の図を参照)、nginx を使用して webSocket をリバース プロキシできます。 ウェブソケット この図からわかるように、webSocket 接続の確立は http プロトコルに基づいています。 GET /チャット HTTP/1.1 ホスト: server.example.com アップグレード: websocket 接続: アップグレード Sec-WebSocket キー: x3JJHMbDL1EzLkh9GBhXDw== Sec-WebSocket-プロトコル: チャット、スーパーチャット Sec-WebSocket バージョン: 13 出典: http://example.com HTTP に精通している人は、このハンドシェイク要求が HTTP プロトコルに似ているが、いくつかの点が異なっていることに気付いたかもしれません。 アップグレード: websocket 接続: アップグレード これは Websocket の中核であり、Apache や Nginx などのサーバーに「Websocket プロトコルを開始します」と伝えます。 Sec-WebSocket キー: x3JJHMbDL1EzLkh9GBhXDw== Sec-WebSocket-プロトコル: チャット、スーパーチャット Sec-WebSocket バージョン: 13 まず、Sec-WebSocket-Key は Base64 でエンコードされた値で、ブラウザーによってランダムに生成され、サーバーに「騙されないでください。あなたが本当に Websocket アシスタントであるかどうかを確認したいのです」と伝えます。 最後に、Sec-WebSocket-Version は、使用している Websocket Draft (プロトコルバージョン) をサーバーに伝えます。当初、Websocket プロトコルはまだドラフト段階でした。さまざまな奇妙なプロトコルがあり、Firefox と Chrome が異なるバージョンを使用するなど、時期によって奇妙で異なるものがたくさんありました。当初は、Websocket プロトコルが多すぎることが大きな問題でした。 。でも今は大丈夫です、定着してみんな使っています。 その後、サーバーは以下を返します。これは、リクエストが受信され、Websocket が正常に確立されたことを示します。 HTTP/1.1 101 スイッチングプロトコル アップグレード: websocket 接続: アップグレード Sec-WebSocket-Accept: HSmrc0sMlYUkAGmm5OPpG2HaGWk= Sec-WebSocket-プロトコル: チャット これはHTTPが担当する最後の領域であり、プロトコルの切り替えに成功したことをクライアントに通知します。 アップグレード: websocket 接続: アップグレード これはまだ修正されており、Websocket プロトコルがアップグレードされようとしていることをクライアントに通知します。この時点で、HTTP はすべての作業を完了しており、次のステップは Websocket プロトコルに完全に従って続行することです。 プロトコルの原則を理解したら、次のステップに進むことができます。 まず、nginxはhttps証明書を設定します サーバー証明書は上司が設定したので、そのまま使用しました。必要であれば自分で確認してください。0.0 nginx設定ファイルの 場所 /wss { プロキシパス http://127.0.0.1:8888; プロキシ_http_バージョン 1.1; proxy_set_header アップグレード $http_upgrade; proxy_set_header 接続「アップグレード」; proxy_set_header X-Real-IP $remote_addr; } パラメータを説明する
ここでポイントは次のようになります: webSocket をプロキシするための主要なパラメータ
Websocket プロトコルの応答パラメータに関しては、リバース プロキシを使用する場合は気にする必要はありません。 この時点で、Nginx リバース プロキシ webSocket の設定は完了です。Nginx を再起動し、websocket で接続して、元の wss アドレスの代わりに 要約する 現在の設定は、ローカル マシンへのリバース プロキシのみを対象としています。別のホストにリバース プロキシする場合は、プロキシ時にクロス ドメインの問題が発生する可能性があります。Nginx のリバース プロキシでクロス ドメイン設定を行う必要があります。 考える このセクションはNginx設定ファイルで確認できます 場所 ~ .php$ { ルートhtml; 127.0.0.1:9000; をデフォルトとして設定します。 fastcgi_index インデックス.php; fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name; fastcgi_params を含めます。 } これは Nginx の PHP の設定ファイルです。 ああ、なぜこんなに見覚えがあるのでしょう? この設定リストは、先ほどの websocket のリバース プロキシと非常によく似ています。ネットで検索してみると、Nginx が PHP タイプのリクエストを処理する際、そのリクエストを fastcgi 管理プロセスに送って処理させていることがわかりました。fascgi 管理プロセスは、結果を処理するために cgi 子プロセスを選択し、それを nginx に返します。ただし、php-fpm は PHP FastCGI マネージャーです。Nginx 自体は PHP を処理できません。単なる Web サーバーです。リクエストを受信すると、それが PHP リクエストであれば、PHP インタープリターに送られて処理され、結果がクライアントに返されます。したがって、Nginx が PHP タイプのリクエストを処理する場合、基本的にはリバース プロキシ機能を通じて実装されます。 考え方を広げて、Nginxリバースプロキシを使用して、Tomcatのプロキシなど、より多くの機能を実現できます。 場所 /Tomcat { プロキシパス http://127.0.0.1:8080; プロキシ_http_バージョン 1.1; proxy_set_header X-Real-IP $remote_addr; } もちろん、Nginx リバース プロキシを使用して負荷分散を実現することもできます。これはまだ試していません。後で使用したときにさらに追加します。 以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 以下もご興味があるかもしれません:
|
目次序文:実装手順:完全なソースコード:詳細情報:序文: vueでは、デフォルトページを実装し、di...
目次1. 問題の背景2. 仮想マシン ネットワーク カードの接続方法は何ですか? 2.1 NAT 2...
Linuxシステムでは、dockerを新しくインストールし、次のようなコマンドを入力します。dock...
成果を達成する実装コードhtml <div>123WORDPRESS.COM</d...
EXPLAIN は、MySQL がインデックスを使用して選択ステートメントを処理し、テーブルを結合す...
序文早速本題に入りましょう。これからお話しするのは次のマインドマップです。まずは印象をつかんでくださ...
目次一般的な圧縮形式: gz .bz2 .xz .zip一般的に使用されるアーカイブは圧縮を必要とす...
問題を見つける上位の SQL ステートメントを取得すると、DB が大量のselect @@sessi...
MySQLの自動増分主キーIDは段階的に増加しません1. はじめにMySQL データベースにデータを...
div の背景を透明にする一般的な方法は 2 つあります。 1. 不透明度属性を 0 ~ 1 の値に...
key_lenの意味MySQL では、次に示すように、explain を使用して SQL ステートメ...
1. イメージをプルするまず、次のコマンドを実行して、イメージをローカル コンピューターにダウンロー...
<!--[lte IE 6の場合]> <![endif]--> IE6以下で...
導入コンピューティングのニーズが拡大し続けるにつれて、アプリケーションのメモリに対する需要も増加して...
まとめプロジェクトの説明形式<img src="..."> H2+ ...