URL 内のサブドメインをバックエンドに渡す nginx リバース プロキシ

Question

nginx を使用すると、React ルーター経由でデータ変数を処理するために、React アプリケーションの受信 URL をユーザーとは別に「見る」ようにプロキシすることは可能ですか?

たとえば、ユーザーが にアクセスするhttps://foo.app.live.comと、アプリは受信したリクエストを として認識しますhttp://localhost:3000/foo。

さらにいくつかの例:

• https://foo.app.live.com===http://localhost:3000/foo
• https://foo.app.live.com/login===http://localhost:3000/foo/login
• https://foo.app.live.com/event/1===http://localhost:3000/foo/event/1

このブロックでテストしたところ、URI 全体がドメインの末尾に追加されました。

location /(.*)$ {
  proxy_pass http://localhost:3000/$1;
  proxy_http_version 1.1;
  proxy_set_header Upgrade $http_upgrade;
  proxy_set_header Connection "";
  proxy_set_header Host $host;
  proxy_cache_bypass $http_upgrade;
  proxy_set_header X-Real-IP $remote_addr;
  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

何が足りないのでしょうか?

Answer 1

これは、ロケーション ブロックで break フラグ付きの rewrite ディレクティブを使用することで実現できます。あなたの場合は次のようになります。

rewrite (.*) /foo$1 break;

この設定により、URI はアップストリーム サーバーに対してのみ変更され、ユーザーはそれに気付かないでしょう。詳細については、次の nginx ドキュメントを参照してください。http://nginx.org/en/docs/http/ngx_http_rewrite_module.html ありがとう

Answer 2

このバージョンをお試しください:

location / {
    proxy_pass http://localhost:3000/foo$uri;
    proxy_http_version 1.1;      
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "";
    proxy_set_header Host $host;
    proxy_cache_bypass $http_upgrade;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}