Обратный прокси-сервер nginx для передачи поддомена в URL-адресе на бэкэнд

Question

Возможно ли с помощью nginx проксировать входящий URL-адрес для моего приложения React, чтобы оно «видело» его иначе, чем пользователь для обработки переменных данных через React Router?

Например, пользователь перейдет на сайт, 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

Вы можете сделать это, используя директиву rewrite с флагом break в блоке location. В вашем случае это будет:

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;
}