location / {try_files $ uri /index.html; } Это помогло человеку. Спасибо

аюсь развернуть мойcreate-react-app SPA на капельке Digital Ocean с Ubuntu 14.04 и Nginx. По статическому серверуинструкции по развертываниюЯ могу заставить его работать, когда я бегуserve -s build -p 4000, но приложение закрывается, как только я закрываю терминал. Мне не понятно изcreate-react-app РЕПО РЕДЕМЕ, как сохранить его вечным, похожим на что-то вроденавсегда.

Без бегаserveЯ получаю ошибку 502 Bad Gateway от Nginx.

Nginx Conf

server {
  listen 80;
  server_name app.mydomain.com;
  root /srv/app-name;
  index index.html index.htm index.js;
  access_log /var/log/nginx/node-app.access.log;
  error_log /var/log/nginx/node-app.error.log;
  location ~* ^.+\.(jpg|jpeg|gif|png|ico|css|zip|tgz|gz|rar|bz2|pdf|txt|tar|wav|bmp|rtf|js|flv|swf|html|htm|svg)$ {
    root   /srv/app-name/build;
  }
  location / {
    proxy_pass http://127.0.0.1:4000;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection 'upgrade';
    proxy_set_header Access-Control-Allow-Origin *;
    proxy_set_header Host $host;
    proxy_cache_bypass $http_upgrade;
  }
}
 Kwhitejr23 окт. 2017 г., 04:01
Я бы, но ... это не работает. Получение ошибки 502, непонятно почему. Журналы ошибок показывают только «111: соединение отказано»
 Ginkoid23 окт. 2017 г., 03:44
Почему бы вам просто не обслуживать статические файлы напрямую с помощью nginx?
 Tarun Lalwani23 окт. 2017 г., 08:27

Ответы на вопрос(1)

Решение Вопроса

что вам не нужны накладные расходы на работу Node-сервера (или проксирование к нему с помощью Nginx); Вы можете обслуживать статические файлы напрямую.

ИзДокументация по развертыванию Вы создали ссылку на приложение «Создать React»:

npm run build создаетbuild каталог с производственной сборкой вашего приложения. Настройте свой любимый HTTP-сервер так, чтобы посетитель вашего сайта обслуживалсяindex.htmlи запросы на статические пути, такие как/static/js/main.<hash>.js подаются с содержанием/static/js/main.<hash>.js файл.

В твоем случае бегиnpm run build создатьbuild/ каталог, а затем сделать файлы доступными в месте, где Nginx может получить к ним доступ. Ваша сборка, вероятно, лучше всего выполняется на локальном компьютере, и тогда вы можете безопасно скопировать файлы на свой сервер (через SCP, SFTP и т. Д.). Вымог бегатьnpm run build на вашем сервере, но если вы это сделаете, не поддавайтесь искушению напрямую служитьbuild/ каталог, как в следующий раз, когда вы запустите сборку, клиенты могут получить несогласованный набор ресурсов во время сборки.

Какой бы метод сборки вы ни выбрали, один раз вашbuild/ на вашем сервере, затем проверьте его разрешения, чтобы Nginx мог читать файлы и настраивать вашиnginx.conf вот так:

server {
  listen 80;
  server_name app.mydomain.com;
  root /srv/app-name;
  index index.html;
  # Other config you desire (TLS, logging, etc)...
  location / {
    try_files $uri /index.html;
  }
}

Эта конфигурация основана на том, что ваши файлы находятся в/srv/app-name, Короче говоря,try_files директива сначала пытается загрузить CSS / JS / images и т.д., а для всех других URI загружаетindex.html файл в вашей сборке, отображающий ваше приложение.

Для заметки, вы должны развертывать, используя HTTPS / SSL для обслуживания, а не с небезопасным HTTP на порту 80.Certbot предоставляет автоматический HTTPS для Nginx с бесплатными сертификатами Let's Encrypt, если в противном случае стоимость или процесс получения сертификата будут вас сдерживать.

 Shinto Joseph14 мая 2018 г., 09:41
location / {try_files $ uri /index.html; } Это помогло человеку. Спасибо

Ваш ответ на вопрос