Как запустить сайт React с HTTPS в производстве?

Question

Можно ли обслуживать веб-сайт React в производстве по протоколу https? В процессе разработки эта команда запускает сервер с https

HTTPS=true SSL_CRT_FILE=cert.crt SSL_KEY_FILE=cert.key npm start

, но, похоже, он не работает, когда вы пытаетесь обслуживать проект следующим образом

sudo HTTPS=true SSL_CRT_FILE=cert.crt SSL_KEY_FILE=cert.key serve -s build -l 80

, я делаю что-то неправильно или Разве невозможно настроить https в React, не находясь в разработке и не используя виртуальный веб-сервер, такой как apache?

Кстати. Я использую Ubuntu в качестве сервера.

Answer 1

В процессе производства вы не хотите обслуживать свое приложение React с помощью Webpack. Вместо этого вам нужно создать приложение React с использованием npm run build, а затем передать содержимое вашей папки public или out с помощью веб-сервера, такого как Nginx / Apache.

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

https://www.nginx.com/blog/using-free-ssltls-certificates-from-lets-encrypt-with-nginx/

Answer 2

Если вы используете create-реагировать-приложение или npx для создания приложения. затем создайте производственную сборку с помощью команды npm run build. Он создаст каталог dist / в каталоге проекта root.

Вы можете использовать certbot для создания SSL-сертификата и nginx для хостинга.

common nginx config будет выглядеть примерно так:

server {  listen 80;
  server_name yourdomain.com;
  server_name **.**.**.**; //your public ip
  root /var/apps/reactApp; //build directory
  index index.html;
   location / {
    try_files $uri /index.html =404;
  }}