create-react-app: как использовать https вместо http?

Ответ 1

Перед запуском команды запуска установите HTTPS=true.

Документация

Реализация использует переменную среды HTTPS для определения того, какой протокол следует использовать при запуске сервера.

Ответ 2

Вы можете отредактировать свой раздел сценариев package.json, чтобы читать:

"scripts": { "start": "set HTTPS=true&&react-scripts start",... }

или просто запустить set HTTPS=true&&npm start

Просто для меня, для меня, это изменение нарушает горячую перезагрузку по какой-то причине....

- Примечание: OS === Windows 10 64-бит

Ответ 3

В случае MAC/UNIX сделать

export HTTPS=true
npm start

Или просто один вкладыш

export HTTPS=true&&npm start

Или обновите стартовый скрипт в package.json, чтобы

"start": "export HTTPS=true&&PORT=3000 react-scripts start",

Вы должны быть в состоянии ударить https.

Ответ 4

Вы также можете создать файл с именем .env в корне вашего проекта, а затем написать

HTTPS=true

После этого просто запустите "npm start", как обычно, чтобы запустить свое приложение.

Документы: https://facebook.github.io/create-react-app/docs/advanced-configuration

Работает как в Linux, так и в Windows, в отличие от некоторых других ответов, опубликованных здесь.

Ответ 5

Пожалуйста, используйте это в командной строке

 set HTTPS=true&&npm start

Ответ 6

может потребоваться установка самоподписанной цепочки CA на сервере и в браузере. Разница между самоподписанным ЦС и самозаверяющим сертификатом

Ответ 7

set HTTPS=true&&react-scripts start в скриптах> start: package.json, как показано ниже.

"сценарии" в package.json:

"scripts": {
    "start": "set HTTPS=true&&react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

• Пожалуйста, не оставляйте пробел между командами, т.е. HTTPS=true && npm start не будет работать.

Направьте это в официальный документ. Использование HTTPS в разработке

(Примечание: отсутствие пробелов является преднамеренным.)

Ответ 8

Я думаю, что стоит упомянуть, чтобы установить PORT=443, стандартный порт HTTPS умолчанию. Вы можете избежать :PORT в конце адреса каждый раз.

Мой package.json похож (протестирован с Ubuntu Server 18.04):

{
  ...
  "scripts": {
    "start": "HTTPS=true PORT=443 react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  ...
}

Ответ 9

HTTPS=true npm start

у меня в терминале работало на Create-React-App

Ответ 10

Я не мог заставить это работать (установка HTTPS = true), вместо этого я использовал

реагируют-HTTPS-перенаправление

Простая обертка вокруг вашего компонента App.

Ответ 11

если он по-прежнему не работает должным образом из-за проблем "ваше соединение не является частным" (в chrome), это работает для меня просто отлично:

https://github.com/facebook/create-react-app/issues/3441

Короче:

1. Сначала я экспортировал сертификат из Chrome (посмотреть это).
2. Импортировал сертификат в Windows (используя certmgr.msc).
3. Разрешено chrome://flags/# allow-insecure-localhost flag. Как разрешить небезопасный локальный хост

Ответ 12

В среде Windows добавьте следующие строки в package.json:

  "scripts": {
    "start-dev": "set HTTPS=true&&set PORT=443&&react-scripts start"
  },

Начнется разработка сервера с https и портом 443. В настоящий момент NodeJs знают ошибку для правильного запуска, но она работала с nodeJs v8.11.3 - https://nodejs.org/dist/v8.11.3/node-v8.11.3-x64.msi для меня.

Ответ 13

Вы можете создать прокси. HTTPS-> HTTP

Создайте ключ и сертификат.

openssl req -nodes -new -x509 -keyout server.key -out server.cert

Создайте файл с именем proxyServer.js

var httpProxy = require('http-proxy');
let fs = require('fs');

httpProxy.createServer({
    target: {
      host: 'localhost',
      port: 3000
    },
    ssl: {
      key: fs.readFileSync('server.key', 'utf8'),
      cert: fs.readFileSync('server.cert', 'utf8')
    }
  }).listen(3000);

Из терминала беги

node proxyServer.js