Мне было интересно, знает ли кто, как использовать https на dev для среды "create-react-app". Я ничего не вижу об этом в README или быстрому поиску в Google. Я просто хочу, чтобы https://localhost: 3000 работал, или https://localhost: 3001.
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
Короче:
- Сначала я экспортировал сертификат из Chrome (посмотреть это).
- Импортировал сертификат в Windows (используя certmgr.msc).
- Разрешено 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