create-react-app:如何使用https而不是http？

Question

我想知道是否有人知道如何在dev上使用https来实现'create-react-app'环境.我在README或快速谷歌搜索中看不到任何相关内容.我只想要https:// localhost:3000工作,或者https:// localhost:3001.

Answer 1

HTTPS=true在运行start命令之前设置.

文档

该实现使用HTTPS环境变量来确定启动服务器时使用的协议.

Answer 2

您可以编辑package.json脚本部分以阅读:

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

或者只是跑步 set HTTPS=true&&npm start

只是一个旁注,对我来说,由于某种原因,这个改变打破了热重装......

- 注意:操作系统=== Windows 10 64位

Answer 3

set HTTPS=true&&react-scripts start在script > start: of 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

（注意：缺少空格是有意的。）

Answer 4

在MAC/UNIX的情况下

export HTTPS=true
npm start

或简单的一个班轮

export HTTPS=true&&npm start

或者将package.json中的启动脚本更新为

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

你应该能够点击https.

Answer 5

Windows (cmd.exe)

set HTTPS=true&&npm start

（注意：缺少空格是有意的。）

Windows (Powershell)

($env:HTTPS = "true") -and (npm start)

Linux、macOS (Bash)

HTTPS=true npm start

请注意，服务器将使用自签名证书，因此您的 Web 浏览器几乎肯定会在访问该页面时显示警告。

自定义 SSL 证书

HTTPS=true SSL_CRT_FILE=<SSLCert.crt> SSL_KEY_FILE=<SSLCert.key> npm start

Linux、macOS (Bash)

HTTPS=true SSL_CRT_FILE=<SSLCert.crt> SSL_KEY_FILE=<SSLCert.key> npm start

为了避免每次都这样做： 您可以像这样在 npm start 脚本中包含：

{
  "start": "HTTPS=true react-scripts start"
}

或者您可以使用HTTPS=true创建一个.env文件

Answer 6

您还可以在项目的根目录中创建一个名为.env的文件，然后编写

HTTPS=true

之后，只需像平常一样运行“ npm start”来启动应用程序即可。

文件：https：//facebook.github.io/create-react-app/docs/advanced-configuration

作品无论在Linux和Windows，不像在这里发布了一些其他的答案。

Answer 7

我认为值得一提的是设置PORT=443默认HTTPS标准端口。可以避免:PORT每次浏览时在地址末尾添加附件。

su
export HTTPS=true 
export PORT=443
export SSL_CRT_FILE=/PATH/TO/cert.pem     # recommended
export SSL_KEY_FILE=/PATH/TO/privkey.pem  # recommended
npm start

或者

你可以将它们全部放入package.json：

  "scripts": {
    "start": "HTTPS=true PORT=443 react-scripts start",

然后，无需exporting：

su
npm start

Answer 8

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

如果您需要更改端口并将其设置为 https。

Answer 9

添加到文件 .env（或 .env.local）行：HTTPS=true

Answer 10

请在命令提示符下使用

 set HTTPS=true&&npm start