如何使用 create-react-app 提供 SSL 证书?

2024-04-01


我正在尝试托管一个我使用 Facebook 样板在本地创建和测试的 React 应用程序。
客户端应用程序与我使用 node.js 制作的 API 进行交互,并且我在设置安全连接时没有遇到任何问题(使用 node.js 客户端发送我的 SSL 证书进行测试)。
但是,当我使用 React 发送 SSL 证书而不是自签名证书时,我遇到了困难,这导致我使用 chrome 并尝试访问时遇到此错误https://example.net:3000 https://example.net:3000 :

您的连接不是私有的 (NET:ERR_CERT_AUTHORITY_INVALID)

该文档对我没有太大帮助:

请注意,服务器将使用自签名证书,因此您的网络浏览器几乎肯定会在访问该页面时显示警告。https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#using-https-in-development https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#using-https-in-development

如何使用我自己的 SSL 证书(我已经在我的域中的另一个应用程序上使用该证书,并且效果非常好)而不是这个自签名证书?我错过了什么 ?


我能够获得本地证书工作without修改webpack-dev-server文件使用react-scripts 3.4.1(技术上添加在3.4.0但我有一些可能不相关的问题)。我将这两个环境变量添加到我的.env.development:

SSL_CRT_FILE=.cert/server.crt
SSL_KEY_FILE=.cert/server.key

Notes:

  • .cert是我在项目根目录中创建的文件夹
  • 我的生成 SSL 证书的脚本 https://gist.github.com/ptvandi/5a33c28d74ccc5100d7fe2bf5de96deb
  • 关于这两个环境变量的官方文档 https://create-react-app.dev/docs/using-https-in-development/#custom-ssl-certificate
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用 create-react-app 提供 SSL 证书? 的相关文章

  • 节点无法抓取某些页面

    我不知道这是否与冷融合页面有关 但我无法刮掉这些 cfm pages 在目录中的命令行中request run node gt var request require request node gt var url http linguis
  • JavaMail Gmail 问题。 “准备启动 TLS”然后失败

    mailServerProperties System getProperties mailServerProperties put mail smtp port 587 mailServerProperties put mail smtp
  • React 在同一组件中渲染多个模态

    我对 React 和一般编码都很陌生 我试图在同一组件中渲染多个模态 但它们都是同时渲染的 因此看起来所有链接都在最后一个模态中渲染文本 这是状态设置的地方 class Header extends React Component cons
  • 在react-admin中通过REST API进行基于cookie的身份验证

    我是反应管理新手 我已经阅读了 stackoverflow 中的所有问题 也用谷歌搜索了我的问题 但没有找到任何有用的解决方案 我正在设置 React admin 来替换我的一个项目的现有管理页面 我通过 REST API 使用基于 coo
  • ReactCSSTransitionGroup 组件WillLeave 未调用

    我尝试使用 ReactCssTransition 但不知何故该事件没有被调用 componentWillLeave 这是我的组件 import React Component from react import TransitionGrou
  • 在linux上安装python ssl模块,无需重新编译

    是否可以在已经安装了 OpenSSL 的 Linux 机器上安装 python 的 SSL 模块 而无需重新编译 python 我希望它就像复制几个文件并将它们包含在库路径中一样简单 Python版本是2 4 3 谢谢 是否可以在已经安装了
  • 找不到“节点”的类型定义文件

    更新 Angular Webpack 和 TypeScript 后出现奇怪的错误 知道我可能会错过什么吗 当我使用 npm start 运行应用程序时 出现以下错误 at loader Cannot find type definition
  • nodemon 安装错误“没有可用于超时的有效版本”

    尝试在全新的节点项目中安装 nodemon 时出现此错误 我创建了一个名为 my project 的空白文件夹 然后 在其中 我执行了创建一个 package json 文件 npm init f 然后当尝试运行时 npm install
  • 如何获取所有喜欢 Facebook 帖子的人?

    我有脸书post https www facebook com Eventinarea posts 336638873112346 我可以点击 77 人这样 并获得我需要的所有人员 问 有没有办法通过FB API获取这些人 PS 我想从这些
  • 如何使用Create React App安装React

    嗨 我对反应真的很陌生 我不知道如何实际安装它 也不知道我需要做什么才能在其中编写代码 我下载了node js并且安装了v12 18 3以及NPM 6 14 6 但是每次我尝试在许多网站上提到的create react app安装方法中输入
  • 如何在超级测试中模拟中间件?

    我想测试中间件是否在app js叫做 虽然我嘲笑该模块work js 它仍然运行原始代码 app js const work require work const express require require const app expr
  • 如何测试 jest Node JS 中 AWS 内置方法中使用的 .promise() 方法

    我想对其进行完整的单元测试 下面给出了我的函数的代码 function js async function sesSendEmail message var ses new aws SES apiVersion 2020 12 01 var
  • 使用 React.forwardRef 与自定义 ref prop 的价值

    我看到React forwardRef从反应文档来看 似乎是将引用传递给子功能组件的认可方式 const FancyButton React forwardRef props ref gt
  • 如何使用draft.js更改光标位置?

    我想知道在键盘命令上完成文本插入后如何更改 Draft js 中的光标位置 因此我目前正在使用 handleKeyCommand cmd 每当用户按下特定按钮时插入自定义文本块 接下来我尝试了以下操作 currentState this s
  • 可下载文件 - 盖茨比

    由于某种原因 尝试下载文件时失败 我尝试了几种不同的方法 但都失败了 我读过一些关于 pdf word 文件在盖茨比中被 禁止 的内容 默认 a href route to file a 好像不行 显示下载失败 任何帮助表示赞赏 See 将
  • 如何在 React 中测试表单提交?

    我有以下 React 组件 export default class SignUpForm extends React Component doSignupForm event Some API call render return div
  • Plesk Windows 部署 Node.js

    我创建了一个以 Node js 作为后端的 Angular 项目 这是服务器文件结构 Home directory httpdocs node hm dist browser folder server folder server js p
  • Node.js - console.log 不显示数组中的项目,而是显示 [Object]

    我在注销对象内数组的内容时遇到问题 实际的物体看起来像这样 var stuff accepted item1 item2 rejected response Foo envelope from The sender to new item1
  • Cloudfoundry:如何组合两个运行时

    cloundfoundry 有没有办法结合两个运行时环境 我正在将 NodeJS 应用程序部署到 IBM Bluemix 现在 我还希望能够执行独立的 jar 文件 但应用程序失败 APP 0 bin sh 1 java not found
  • Redux-saga 从操作中获取数据返回patternOrChannel 未定义

    我需要将动态数据从屏幕发送到操作 减速器 并使用该数据从 API 获取数据 但是当我在我的rootSaga我会收到这样的错误 在检查 take patternOrChannel 时未捕获 patternOrChannel 未定义未捕获在 r

随机推荐

  • pandas 在多列上搜索子字符串

    我有一个 df 这样 c name f name 0 abc abc12 1 xyz abc1 2 mnq mnq2 目标是在两列中找到一个子字符串并知道它属于哪一列 优先选择应该是c name 就像子字符串在两列中一样c name获得优先
  • 学习 XQuery 的简单工具? [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我开始玩XQuery 在 w3schools 1 上 这是一个很好的教程 我只是遇到一些问题 我无法测试网站上的内容 我在网上找到了一个X
  • **正确地**从字符串创建 lambda 函数

    给定一个字符串 例如 2 i j lt 100 我想生成相应的lambda函数 fn lambda i j 2 i j lt 100 我可以这样做eval 但我正在寻找一种不那么邪恶的方法 我已经发现 import ast f ast La
  • Firebase 重置密码链接不起作用

    我正在使用 firebase 对我的 Android 应用程序中的用户进行身份验证 我为用户提供了在登录窗口中重置密码的选项 当用户单击按钮时 它会成功发送电子邮件 但是 当用户单击链接时 它总是显示 再次尝试重置密码 您重置密码的请求已过
  • 调用堆栈不说“你从哪里来”,而是说“你下一步要去哪里”?

    在上一个问题中 获取对象调用层次结构 https stackoverflow com questions 6583883 get object call hierarchy 我有这个有趣的答案 https stackoverflow com
  • 如何在 WPF 中拉伸位图而不平滑像素

    我正在开发用 WPF 编写的 SEM 图像处理应用程序 我有一个源自 Canvas 的图像显示控件 它使用 DrawingVisuals 显示图像和叠加层 每个 层 一个 它还使用应用于 DrawingVisuals 的缩放和平移变换来实现
  • 使用Imagemagick,如何裁剪白色背景?

    假设我有一个充满标志的目录 大约 200 个 每个标志都有这个边框 上下 12 像素 左右 1 像素 像这样 我如何使用 imagemagick 来 将每个 PNG 图像从 64x64 裁剪到 60x40 你有自动裁剪 mogrify tr
  • 程序类型已存在:com.google.common.util.concurrent.ListenableFuture 重复类

    我无法构建我的项目 因为我尝试添加的每个新依赖项都会充满新错误 我尝试使用 IDE 将我的项目迁移到 androidx 库 但这并没有解决任何问题 现在我有这些库 dependencies implementation fileTree d
  • 更新虚拟机选项后 Android Studio 无法启动

    我最近在运行 OSX 10 11 的 Mactop pro 上安装了 android studio 使用标准 Apple JRE JDK 我遇到了 IDE 速度慢和模拟器挂起的问题 经过一些研究后 建议我将 VM 选项设置为 Xmx2048
  • Symfony2 Jobeet 教程第 3 天错误无效映射

    当我用代码生成捆绑实体时 php app console doctrine generate entities EnsJobeetBundle 我收到这个错误 学说 通用 持久性 映射 映射异常 类 Ens JobeetBundle Ent
  • NullReferenceException 尝试读取连接字符串

    我有两个项目 一种是 Web 另一种是 Windows 窗体 Web项目连接到数据库 但Windows项目在读取连接字符串时抛出异常NullReferenceException 我使用相同的类来连接两个项目 使用 LINQTOSQL 建立连
  • Visual Studio Code clang 错误:Mac 上的链接器命令失败,退出代码 1

    我是编程新手 想尝试使用 VS Code 进行 C 开发 我收到此错误 但无法在线找到解决方案 clang 错误 链接器命令失败 退出代码为 1 使用 v 查看调用 终端进程终止并退出代码 1 我得到了一个包含函数定义的 cpp 文件和一个
  • 如何从字符串中删除“http://”部分?

    我有这个方法 private List
  • Facebook API:Instagram 帐户丢失

    每当创建或更新Ad很有创意 但我收到此错误 error message Invalid parameter type OAuthException code 100 error subcode 1772103 is transient fa
  • 在 AVPlayer 中播放网络状况不佳的流媒体

    当 AVPlayer 播放来自网络流的资源时 它会在到达下载内容的末尾时暂停 所以 我的问题是 如何知道它是因为网络不好而停止的 下载后如何播放 比如说 接下来的 10 秒资源 当 AVPlayer 的缓冲区为空时 您可以添加一个观察者 s
  • 如何替换不可打印的 unicode 字符 (Javascript)

    我已经浪费了大量的时间来处理字符串 由其他一些源生成 并且我发现问题在于字符串具有不可打印的字符 今天我正在处理 javascript 有谁知道如何替换javascript中不可打印的unicode字符 我在这里发现了类似的东西 如何在 J
  • 以适度可扩展的方式交付活动提要项目

    我正在开发的应用程序有一个活动源 每个用户都可以在其中看到他们朋友的活动 很像 Facebook 我正在寻找一种适度可扩展的方式来动态显示给定用户的活动流 我说 适度 是因为我希望只用一个数据库 Postgresql 来做到这一点并且may
  • 在 Ubuntu 上使用 R 获取抗锯齿图

    我升级了系统并重新安装了 R 现在我的标准 X 11 绘图没有抗锯齿 它们看起来呈锯齿状 而且字体看起来很糟糕 我似乎记得过去有过这样的问题 但不记得我做了什么 其他一些信息 qplot也出来了非抗锯齿 绘制到一个png设备也产生非抗锯齿输
  • 如何在 Flutter 中添加文件选择器插件?

    我正在创建一个 Flutter 项目 其中有一段数据 JSON 我想将其导入和导出到用户想要的位置 为了实现这一目标 我需要一个File PickerFlutter 中的插件 现在 我搜索了Dart Packages存储库 file pic
  • 如何使用 create-react-app 提供 SSL 证书?

    我正在尝试托管一个我使用 Facebook 样板在本地创建和测试的 React 应用程序 客户端应用程序与我使用 node js 制作的 API 进行交互 并且我在设置安全连接时没有遇到任何问题 使用 node js 客户端发送我的 SSL