配置https环境

为什么要配置https环境

在使用 HTML5API 时,很多 API 只能在 https 保证安全的情况下才能开启。这就要求我们在本地开发环境也能够配置 https,否则你需要每次部署到配有 https 的测试环境中才能看到预览效果,这对开发的敏捷度造成了极大的干扰。

一、下载 mkcert

mkcert 是一个用 GO 写的零配置专门用来本地环境 https 证书生成的工具。

1、安装

文档地址:https://gitcode.net/mirrors/FiloSottile/mkcert?utm_source=csdn_github_accelerator

macOS、Linux、Windows 均可安装。

此处使用的是mac

  1. 直接使用 Homebrew 安装mkcert:
brew install mkcert
  1. 安装一个证书中心
mkcert -install

该命令会在您的本机安装一个证书中心,用于颁发证书,示例如下:

image-20220507195530536
  1. 查看证书中心的存放位置
mkcert mkcert --CAROOT

可以查看证书中心的存放位置,如下图所示:

image-20220507195554118

至此,我们的证书中心就搞定了,之后可以在具体的项目中生成证书文件和私钥。

2、在具体项目中生成证书文件和私钥

通过上面的步骤,我们在本机上安装了 CA(刚才的证书中心),接下来 cd 到需要生成凭证的目录下,通过 mkcert 命令来生成证书文件和私钥。示例如下:

image-20220507195616470

在上面的操作中,我们针对 localhost、127.0.0.1、192.168.101.263 个地址生成了证书文件和私钥,其中 ./localhost+2.pem 就是证书文件,./localhost+2-key.pem 就是私钥文件。并且这两个文件都有过期时间。

我们也可以打开生成证书的目录,可以看到在该目录下已经存在了这 2 个文件。

image-20220507195632327

二、在 live server 中配置 https 环境

因为我们的项目很多时候是以 live server 的形式打开,因此我们可以在 live server 中配置以 https 打开项目。

image-20220507195648343

在扩展中找到 live server 对应的配置项:

image-20220507195710916

enable 修改为 true,然后填写 certkey 的地址即可,填写完成后最好重启一下 vscode

image-20220507195729079

配置完成后,之后使用 live server 重新打开项目时,就会以 https 的形式来打开项目。

三、其他

其他环境中要配置 https,可以参阅:https://www.codingsky.com/m/doc/2021/8/24/116.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/259461.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

机器学习--线性回归

目录 监督学习算法 线性回归 损失函数 梯度下降 目标函数 更新参数 批量梯度下降 随机梯度下降 小批量梯度下降法 数据预处理 特征标准化 正弦函数特征 多项式特征的函数 数据预处理步骤 线性回归代码实现 初始化步骤 实现梯度下降优化模块 损失与预测模块 …

【C++】对象特性:无参有参构造函数,拷贝构造函数,析构函数

目录 对象的初始化和清理1.1 构造函数和析构函数1.2 构造函数的分类及调用1.3 拷贝构造函数调用时机1.4 构造函数调用规则1.5 深拷贝与浅拷贝 对象的初始化和清理 生活中我们买的电子产品都基本会有出厂设置,在某一天我们不用时候也会删除一些自己信息数据保证安全。…

智慧食堂餐卡充值文件生成器使用说明

智慧食堂餐卡充值文件生成器 下载地址: https://download.csdn.net/download/boysoft2002/88646277 或者百度网盘下载: https://pan.baidu.com/s/16cxOa5aq0CU0T0xOr2A7-A 操作使用说明 一、文件结构 下载.rar文件后,释放到非系统盘符的…

数据库故障Waiting for table metadata lock

场景:早上来发现一个程序,链接mysql数据库有点问题,随后排查,因为容器在k8s里面。所以尝试重启了pod没有效果 一、重启pod: 这里是几种在Kubernetes中重启Pod的方法: 删除Pod,利用Deployment重建 kubectl delete pod mypodDepl…

【小呆的力学笔记】弹塑性力学的初步认知二:应力分析(1)

文章目录 1.1 一点的应力状态1.2 一点主应力状态1.3 应力偏张量、球张量、应力不变量 1.1 一点的应力状态 物体在受到外力或者自身不均匀的温度场等作用时,在其内部会产生内力,物体的内力与方向和截面都有关系。假设有一个受到外力作用的变形体&#xf…

Java经典面试题:冒泡算法的使用

Hi i,m JinXiang ⭐ 前言 ⭐ 本篇文章主要介绍Java经典面试题:冒泡算法的使用以及部分理论知识 🍉欢迎点赞 👍 收藏 ⭐留言评论 📝私信必回哟😁 🍉博主收将持续更新学习记录获,友友们有任何问题…

nodejs连接mongodb报错SyntaxError: Unexpected token .

nodejs连接mongodb报错SyntaxError: Unexpected token 如下图 经过排查,原因是npm默认安装的mongodb插件是最新版6.3.0 ,而mongodb数据库版本是4.0.0 ,两者版本不同导致nodejs报错。 解决方法是npm卸载新版本的mongodb插件,再安…

comfyUI + animateDiff video2video AI视频生成工作流介绍及实例

原文:comfyUI animateDiff video2video AI视频生成工作流介绍及实例 - 知乎 目录 收起 前言 准备工作环境 comfyUI相关及介绍 comfyUI安装 生成第一个视频 进一步生成更多视频 注意事项 保存为不同的格式 视频宽高设置 种子值设置 提示词与负向提示词…

uml用例图是什么?有哪些要素?

UML用例图是什么? UML用例图(Unified Modeling Language Use Case Diagram)是一种用于描述系统功能和用户之间交互的图形化建模工具。它是UML的一部分,主要用于识别和表示系统中的各个用例(用户需求或功能点&#…

EMNLP 2023 亮点回顾:大模型时代下的 NLP 研究

作为自然语言处理(NLP)领域的顶级盛会,EMNLP 每年都成为全球研究者的关注焦点。2023 年的会议在新加坡举行,聚集了数千名来自世界各地的专家学者,也是自疫情解禁以来,中国学者参会最多的一次。巧的是&#…

阿赵UE学习笔记——2、新建项目和项目设置

阿赵UE学习笔记目录 大家好,我是阿赵。继续来学习虚幻引擎的使用。这次介绍一下新建项目和项目设置。 一、新建项目 通过桌面快捷方式,或者EPIC Games Loader,启动虚幻引擎。 启动完成后,会打开项目管理的界面,可以看…

运算放大电路的输入偏置电流和输入失调电流

一般运放的datasheet中会列出众多的运放参数,有些易于理解,我们常关注,有些可能会被忽略了。在接下来的一些主题里,将对每一个参数进行详细的说明和分析。力求在原理和对应用的影响上把运放参数阐述清楚。由于本人的水平有限&…

软件测试中如何测试算法?

广义的算法是指解决问题的方案,小到求解数学题,大到制定商业策略,都可以叫做算法。而我们今天讨论的软件测试中的算法,对应的英文单词为 Algorithm,专指计算机处理复杂问题的程序或指令。 随着最近几年人工智能等领域…

【C语言初阶】数组

目录 一、一维数组的创建和初始化 1.1 数组的创建 1.2 数组的初始化 1.3 一维数组的使用 1.4 一维数组在内存中的存储 二、二维数组的创建和初始化 2.1 二维数组的创建 2.2 二维数组的初始化 2.3 二维数组的使用 2.4 二维数组在内存中的存储 三、数组越界 四、数组作…

每日一博 - Protobuf vs. Protostuff:性能、易用性和适用场景分析

文章目录 历史区别联系性能差异最佳实践场景分析小结 历史 对于Protostuff和Protobuf的关系,需要了解它们的起源和发展。 Protobuf(Protocol Buffers)是由Google开发的一种数据序列化格式,用于结构化数据的存储和交换。它最初是…

【✅Java中有了基本类型为什么还需要包装类?】

✅Java中有了基本类型为什么还需要包装类? ✅Java中有了基本类型为什么还需要包装类✅Java的8中基本数据类型 ✅知识拓展✅基本类型和包装类型的区别✅如何理解自动拆装箱?✅拆箱与装箱✅自动拆装箱✅自动拆装箱原理 ✅哪些地方会自动拆装箱?…

C++20形式的utf-8字符串转宽字符串,不依赖编译器编码形式

默认的char[]编码都是要看编译器编译选项的,你选了ANSI那它就是ANSI,你选了UTF8那它就是UTF8. 【注意:经典DevC只支持ANSI编码(痛苦);上图是小熊猫DevC,则有这个选项】 这一点对我的代码造成了…

【教3妹学编程-算法题】循环移位后的矩阵相似检查

插: 前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到网站。 坚持不懈,越努力越幸运,大家一起学习鸭~~~ 3妹:“太阳当空照,花儿对我笑&…

Ubuntu 常用命令之 apt-get 命令用法介绍

apt-get是Ubuntu系统下的一个命令行工具,用于处理包。这个命令可以自动下载和安装软件包及其依赖项。它是Advanced Packaging Tool (APT)的一部分,APT是处理包的高级工具,可以处理复杂的包关系,如依赖关系等。 apt-get命令的常见…

linux: ip route 与 route 用法详解与对比

文章目录 1. 引言2. ip route2.1 描述2.2 语法2.3 参数2.4 例子 3. route3.1 描述3.2 语法3.3 参数3.4 例子 4. 对比5. 参考 1. 引言 本文主要介绍 ip route 以及 route 的用法和区别。 2. ip route 2.1 描述 用于管理静态路由表。linux 系统中,可以自定义从 1&…