mkcert的安装和使用,5分学会在本地开启localhost的https访问方式

mkcert官方仓库地址:https://github.com/FiloSottile/mkcert#installation

mkcert 是一个简单的工具,用于制作本地信任的开发证书。它不需要配置。

简化我们在本地搭建 https 环境的复杂性,无需操作繁杂的 openssl 实现自签证书了,这个小程序就可以帮助我们自签证书,在本机使用还会自动信任 CA,非常方便。

使用来自真实证书颁发机构 (CA) 的证书进行开发可能很危险或不可能(对于example.test、localhost或 之类的主机127.0.0.1),但自签名证书会导致信任错误。管理您自己的 CA 是最好的解决方案,但通常涉及神秘的命令、专业知识和手动步骤。

mkcert 在系统根存储中自动创建并安装本地 CA,并生成本地信任的证书。mkcert 不会自动配置服务器以使用证书,但这取决于您。

下载安装

我使用Windows 10 操作系统进行演示说明。mkcert也支持其他平台的安装与使用,自行下载对应的版本安装即可,下载地址:

windows大部分都是amd架构:https://github.com/FiloSottile/mkcert/releases

安装mkcert。将CA证书加入本地可信CA,使用此命令,就能帮助我们将mkcert使用的根证书加入了本地可信CA中,以后由该CA签发的证书在本地都是可信的。下载后到下载目录中安装:

mkcert-v1.4.4-windows-amd64.exe -install

 会提示你,点击是即可:

安装成功成功。提示创建一个新的本地CA,本地CA现在已安装在系统信任存储中。 

查看根证书位置

如果你想查看根证书位置,可以输入命令:

mkcert-v1.4.4-windows-amd64.exe -CAROOT

 或者到我的电脑信任证书中查看也是可以的,按“Windows键+R”调出运行框,输入 certmgr.msc 命令。打开证书控制台:

在受信任的证书颁发机构中可以看到: 

生成自签证书

直接跟多个要签发的域名或 ip 就行了,比如签发一个仅本机访问的证书(可以通过127.0.0.1localhost,以及 ipv6 地址::1访问):

mkcert-v1.4.4-windows-amd64.exe localhost 127.0.0.1 ::1 192.168.2.25

需要在局域网内测试 https 应用,这种环境可能不对外,因此也无法使用像Let's encrypt这种免费证书的方案给局域网签发一个可信的证书,而且Let's encrypt本身也不支持认证 Ip。

证书可信的三个要素:1.由可信的 CA 机构签发。2.访问的地址跟证书认证地址相符。3.证书在有效期内。如果期望自签证书在局域网内使用,以上三个条件都需要满足。很明显自签证书一定可以满足证书在有效期内,那么需要保证后两条。我们签发的证书必须匹配浏览器的地址栏,比如局域网的 ip 或者域名,此外还需要信任 CA。

在mkcert软件同目录下,生成了自签证书。如图所示:

通过输出,我们可以看到成功生成了localhost+3.pem证书文件和localhost+3-key.pem私钥文件,只要在 web server 上使用这两个文件就可以了。

前端项目配置证书

如果你是前端项目,可以在项目根目录下创建certs文件夹,将刚创建的证书添加进去,然后配置webpack或者vite的配置文件,然后重新启动项目就可以了:

配置文件代码: 

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
import fs from 'fs'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  server: {
    host: '0.0.0.0',
    https: {
      key: fs.readFileSync('certs/127.0.0.1+1-key.pem'),
      cert: fs.readFileSync('certs/127.0.0.1+1.pem')
    }
  },
  resolve: {
    alias: {
      '@': path.resolve(__dirname, 'src')
    }
  }
})

 重新启动项目就可以看到是https了:但是因为只配置了localhost,所以只能localhost使用https访问,其它的ip地址需要重新使用命令配置到你的证书里面才可以访问。

并且访问的时候浏览器也认可:

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

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

相关文章

风速编辑一下

clear clc % 假设已知的南北和东西风速分量时程 time 0:1:999; % 时间步长为1秒 north_south_wind_speed 8 2 * sin(2 * pi * 0.1 * time); % 南北风向分量 east_west_wind_speed 6 1 * sin(2 * pi * 0.1 * time); % 东西风向分量 % 计算合风速和风向 total_wind_spe…

Node.js的学习1

Node.js简介 浏览器是JavaScript的前端运行环境Node.js是JavaScript的后端运行环境Node.js中无法调用DOM和BOM等浏览器内置API 终端中的快捷键 使用向上箭头,可以快速定位到上一次执行的命令使用tab键,可以快速补全路径使用esc键,可以快速清…

django 访问后台数据库管理程序报错:CSRF verihcation failed. Request aborted.

解决方案 在 settings.py 最后加上这个 CSRF_TRUSTED_ORIGINS ["https://<你自己 heroku 的项目部署地址>.herokuapp.com" ]注意下面的事项&#xff1a; https 前面和 .com 后面不要带空格&#xff0c;因为你在复制的时候可能引入空格.com 后面不要加斜杠&a…

Rust循环和函数

下面聊聊以下主题&#xff1a; 基于条件的分支循环函数属性测试 基于条件的分支 基于条件的分支&#xff0c;可以通过常见的 if、if else 或 if else if else 构造来完成&#xff0c;例如下面的示例&#xff1a; fn main() { let dead false; let health 48; if dead { p…

第十八章 Redis查看配置文件和数据类型

文章目录 前言1、查看配置2、修改配置项2.1、配置项说明2.2、配置支持远程访问 3、数据类型3.1、String3.1.1、string扩容规则3.1.2、字符串命令3.1.3、string 常用命令 3.2、Hash3.2.1、数据存储3.2.2、常用命令 3.3、list3.3.1、常用命令 3.4、set3.4.1、常用命令 3.5、zset有…

SpringCloud-高级篇(十六)

前面学习了Lua的语法&#xff0c;就可以在nginx去做编程&#xff0c;去实现nginx类里面的业务&#xff0c;查询Redis&#xff0c;查询tomcat等 &#xff0c;业务逻辑的编写依赖于其他组件&#xff0c;这些组件会用到OpenResty的工具去实现 &#xff08;1&#xff09;安装OpenRe…

第十三章认识Ajax(四)

认识FormData对象 FormData对象用于创建一个表示HTML表单数据的键值对集合。 它可以用于发送AJAX请求或通过XMLHttpRequest发送表单数据。 以下是FormData对象的一些作用&#xff1a; 收集表单数据&#xff1a;通过将FormData对象与表单元素关联&#xff0c;可以方便地收集表…

DjangoURL调度器(二)

一、默认值与额外参数 1.1、默认值 1.1.1、urls.py from django.urls import pathfrom . import viewsurlpatterns [# http://127.0.0.1:8000/polls/blog/ 等同于 # http://127.0.0.1:8000/polls/blog/1/path(blog/, views.page),# http://127.0.0.1:8000/polls/blo…

解读BEVFormer,新一代自动驾驶视觉工作的基石

文章出处 BEVFormer这篇文章很有划时代的意义&#xff0c;改变了许多视觉领域工作的pipeline[2203.17270] BEVFormer: Learning Birds-Eye-View Representation from Multi-Camera Images via Spatiotemporal Transformers (arxiv.org)https://arxiv.org/abs/2203.17270 BEV …

架构篇19:单服务器高性能模式-Reactor与Proactor

文章目录 ReactorProactor小结上篇介绍了单服务器高性能的 PPC 和 TPC 模式,它们的优点是实现简单,缺点是都无法支撑高并发的场景,尤其是互联网发展到现在,各种海量用户业务的出现,PPC 和 TPC 完全无能为力。今天我将介绍可以应对高并发场景的单服务器高性能架构模式:Rea…

第18章_JDK8-17新特性(下)(新语法结构,API的变化,其它结构变化,小结与展望)

文章目录 第18章_JDK8-17新特性&#xff08;下&#xff09;6. 新语法结构6.1 Java的REPL工具&#xff1a; jShell命令6.2 异常处理之try-catch资源关闭6.3 局部变量类型推断6.4 instanceof的模式匹配6.5 switch表达式6.6 文本块6.7 Record6.8 密封类 7. API的变化7.1 Optional类…

MarkDown快速入门-以Obsidian编辑器为例

直接上图&#xff0c;左右对应。 首先是基础语法。 # 标题&#xff0c;几个就代表几级标题&#xff1b;* 单个是序号&#xff0c;两个在一起就是斜体&#xff1b;- [ ] 代表任务&#xff0c;注意其中的空格&#xff1b; 然后是表格按钮代码 | 使用中竖线代表表格&#xff0c…

SparkSql---用户自定义函数UDFUDAF

文章目录 1.UDF2.UDAF2.1 UDF函数实现原理2.2需求:计算用户平均年龄2.2.1 使用RDD实现2.2.2 使用UDAF弱类型实现2.2.3 使用UDAF强类型实现 1.UDF 用户可以通过 spark.udf 功能添加自定义函数&#xff0c;实现自定义功能。 如&#xff1a;实现需求在用户name前加上"Name:…

【QT+QGIS跨平台编译】之十四:【webp+Qt跨平台编译】(一套代码、一套框架,跨平台编译)

文章目录 一、webp介绍二、webp下载三、文件分析四、pro文件五、编译实践一、webp介绍 WebP 是一种现代的图像格式,由 Google 开发。它能够提供更好的压缩率和图像质量,相比于传统的 JPEG 和 PNG 格式。WebP 图像通常具有更小的文件大小,同时保持高质量的图像细节,这使得它…

总结6(循环(for))

循环 定义&#xff1a; 某些代码会被重复执行 分类&#xff1a; for 1.格式 for(1; 2; 3) 语句A; 2.执行的流程&#xff08;1,2,A,3 2,A,3 2,A,3..........&#xff09; 单个for循环的使用 多个for循环的嵌套使用 1). for&#xff08;1; 2; 3&#xff09; for&#xff0…

【数据分析】numpy基础第二天

文章目录 前言数组的形状变换reshape的基本介绍使用reshapereshape([10, 1])运行结果reshape自动判断形状reshape([-1, 1])运行结果 合并数组使用vstack和hstackvstack和hstack的运行结果使用concatenateconcatenate运行结果 分割数组array_split运行结果 数组的条件筛选条件筛…

qemu单步调试arm64 linux kernel

一、背景和目的 qemu搭建arm64 linux kernel环境-CSDN博客 之前介绍了qemu启动kernel的配置步骤和方法&#xff0c;现在开始我们的调试&#xff0c;这篇文章主要讲解如何单步调试内核&#xff0c;所有的实验还是基于ARM64&#xff1b; 二、环境准备 需要准备hostx86 target…

VirtualBox:安装提示缺少python core和win32 api

最近升级了Ubuntu22.04&#xff0c;查了一下&#xff0c;VirtualBox的增强功能&#xff0c;居然用时5分钟。 5min 18ms vboxadd.service 据说升级VirtualBox的增强功能能解决这个问题&#xff0c;于是先升级VirtualBox&#xff0c;但是安装VirtualBox却报缺少python core及win3…

Android App开发-简单控件(4)——按钮触控和图像显示

3.4 按钮触控 本节介绍了按钮控件的常见用法&#xff0c;包括&#xff1a;如何设置大小写属性与点击属性&#xff0c;如何响应按钮的点击事件和长按事件&#xff0c;如何禁用按钮又该如何启用按钮&#xff0c;等等。 3.4.1 按钮控件Button 除了文本视图之外&#xff0c;按钮…

【GAMES101】Lecture 11 贝塞尔曲线

曲线这部分基本上就单讲了贝塞尔曲线 目录 贝塞尔曲线&#xff08;Bezier curves&#xff09; De Casteljau’s algorithm B-splines 贝塞尔曲线&#xff08;Bezier curves&#xff09; 很早之前说过的这种矢量图是不会随着放大而失真的&#xff0c;像这种字体&#xff0c…