当前位置: 首页 > news >正文

vue-cli3项目本地启用https,并用mkcert生成证书

在项目根目录下的vue.config.js文件中:

// vue.config.js
module.exports = {devServer: {host:'dev.nm.cngc'// 此处开启 https,并加载本地证书(否则浏览器左上角会提示不安全)https:  {cert: fs.readFileSync(path.join(_dirname,'./cert.crt')),key: fs.readFileSync(path.join(_dirname,'./cert.key')),},// 注意: https的端口必须是443port: 443}
}

mkcert生成证书

1、安装命令:npm install -g mkcert
判断是否安装成功,输入命令:mkcert --version,如果能看到版本号,说明安装成功,可以进行下一步
2、生成一个ca证书,mkcert create-ca,生成之后会看到一个ca.crt和ca.key文件
利用刚刚生成的ca证书,再生成cert证书,mkcert create-cert,会在刚刚的路径下生成cert.crt和cert.key文件( 还可以指定ip或域名:mkcert create-cert --domain 127.0.0.1,dev.nm.cngc )

3、在浏览器中导入ca.crt
chrome点击设置,搜索证书,找到管理证书:
在这里插入图片描述
导入ca.crt,然后选择受信任的根证书颁发机构
在这里插入图片描述

4、在vue项目中使用cert.crt和cert.key

https:  {cert: fs.readFileSync(path.join(_dirname,'./cert.crt')),key: fs.readFileSync(path.join(_dirname,'./cert.key')),},

相关文章:

vue-cli3项目本地启用https,并用mkcert生成证书

在项目根目录下的vue.config.js文件中: // vue.config.js module.exports {devServer: {host:dev.nm.cngc// 此处开启 https,并加载本地证书(否则浏览器左上角会提示不安全)https: {cert: fs.readFileSync(path.join(_dirname,./cert.crt)…...

包装类笔记

包装类 5.1 概述 Java 提供了两个类型系统,基本类型与引用类型,使用基本类型在于效率,然而很多情况,会创建对象使用,因为对象可以做更多的功能,如果想要我们的基本类型像对象一样操作,就可以使…...

TC和TG油封有什么区别?

油封是各种机械系统(包括发动机和工业机械)中的重要部件,因为它们可以防止润滑剂和污染物的泄漏。在可用的不同类型的油封中,常用的是TC和TG密封件。在本文中,我们将讨论TC和TG油封之间的差异,帮助您了解它们的独特特性和应用。 …...

大数据之MapReduce

MapReduce概述 是一个分布式的编程框架,MapReduce核心功能是将用户编写的业务逻辑代码和自带默认组件整合成一个完整的分布式运算程序,并发运行在一个Hadoop集群上。 优点: 易于编程,简单的实现一些接口,就可以完成一…...

《机器人学一(Robotics(1))》_台大林沛群 第 5 周【机械手臂 轨迹规划】 Quiz 5

我又行了!🤣 求解的 位置 可能会有 变动,根据求得的A填写相应值即可。注意看题目。 coursera链接 文章目录 第1题 Cartesian space求解 题1-3 的 Python 代码 第2题第3题第4题 Joint space求解 题4-6 的 Python 代码 第5题第6题其它可参考代…...

嵌入式面试/笔试C相关总结

1、存储 单片机端编译后分为code ro rw zi几个区域,其中code是执行文件,ro(read only)只读区域,存放const修饰常量、字符串。rw(read write)存放已初始化变量。zi存放未初始化变量。编译完成后bin大小为coderorw。运行时所需内存为rwzi。 在电…...

支付宝使用OceanBase的历史库实践分享

为解决因业务增长引发的数据库存储空间问题,支付宝基于 OceanBase 数据库启动了历史库项目,通过历史数据归档、过期数据清理、异常数据回滚,实现了总成本降低 80%。 历史数据归档:将在线库(SSD 磁盘)数据归…...

accelerate 分布式技巧(一)

accelerate分布式技巧 简单使用 Accelerate是一个来自Hugging Face的库,它简化了将单个GPU的PyTorch代码转换为单个或多台机器上的多个GPU的代码。 Accelerate精确地抽象了与多GPU/TPU/fp16相关的模板代码,并保持Pytorch其余代码不变。 import torchim…...

密码找回安全

文章目录 密码找回安全任意秘密重置 密码找回安全 用户提交修改密码请求;账号认证:服务器发送唯一ID (例如信验证码)只有账户所有者才能看的地方,完成身份验证;身份验证:用户提交验证码完成身份验证;修改密码:用户修改密码。 任意秘密重置 登录metinfo4…...

Spring Boot + Vue的网上商城之商品管理

Spring Boot Vue的网上商城之商品管理 在网上商城中,商品管理是一个非常重要的功能。它涉及到商品的添加、编辑、删除和展示等操作。本文将介绍如何使用Spring Boot和Vue来实现一个简单的商品管理系统。 下面是一个实现Spring Boot Vue的网上商城之商品管理的思路…...

B站:提高你的词汇量:如何用英语谈论驾驶

视频链接:提高你的词汇量:如何用英语谈论驾驶_哔哩哔哩_bilibili 英文音标中文hood/hʊd/n. 汽车的引擎盖go over仔细检查;认真讨论;用心思考There are plenty of videos go over this.有很多关于这个的视频unlockvt. 发现;揭开&…...

大前端面试注意要点

前端面试:从IT专家角度全面解析 在数字时代,前端开发工程师的角色变得越来越重要。随着网站和应用程序的复杂性和交互性越来越高,对具有专业技能的前端开发人员的需求也在不断增长。对于正在寻找前端开发职位的开发者,或者正在寻…...

稻盛和夫-如是说(读书笔记)

本书解答的核心问题: “今天,我们需要的不是短期有效的处方。作为人,何谓正确?作为人,应该如何度过人生?这才是一切问题的根源。 有几个要点和认知比较深的地方谈一谈。 1、利他 类似于阳明心学&#xff0…...

Jmeter是用来做什么的?

JMeter是一个开源的Java应用,主要用于性能测试和功能测试。它最初由Apache软件基金会设计用于测试Web应用程序,但现在已经扩展到其他测试功能。JMeter的主要功能如下: 性能测试:性能测试是JMeter的核心功能,主要分为两…...

Docker基础教程

Docker基础教程 Docker简介 Docker基本操作 Docker应用 Docker自定义镜像 Docker compose 为什么使用DockerDocker简介安装DockerDocker的中央仓库Docker镜像操作Docker容器操作准备一个web项目创建MySQL容器创建Tomcat容器将项目部署到TomcatDocker数据卷DockerfileDock…...

Linux命令200例:who用于显示当前登录到系统的用户信息

🏆作者简介,黑夜开发者,CSDN领军人物,全栈领域优质创作者✌。CSDN专家博主,阿里云社区专家博主,2023年6月csdn上海赛道top4。 🏆数年电商行业从业经验,历任核心研发工程师&#xff0…...

HGDB-修改分区表名称及键值

瀚高数据库 目录 环境 文档用途 详细信息 环境 系统平台:N/A 版本:4.5.7 文档用途 使用存储过程拼接SQL,修改分区名称、分区键值、并重新加入主表,适用于分区表较多场景。 详细信息 说明:本文档为测试过程&#xff1…...

1分钟了解音频、语音数据和自然语言处理的关系

机器学习在日常场景中的应用 音频、语音数据和自然语言处理这三者正在不断促进人工智能技术的发展,人机交互也逐渐渗透进生活的每个角落。在各行各业包括零售业、银行、食品配送服务商)的多样互动中,我们都能通过与某种形式的AI(…...

线性代数的学习和整理20,关于向量/矩阵和正交相关,相似矩阵等

目录 1 什么是正交 1.1 正交相关名词 1.2 正交的定义 1.3 正交向量 1.4 正交基 1.5 正交矩阵的特点 1.6 正交矩阵的用处 1 什么是正交 1.1 正交相关名词 orthogonal set 正交向量组正交变换orthogonal matrix 正交矩阵orthogonal basis 正交基orthogonal decompositio…...

OpenCV之ellipse函数

ellipse函数用来在图片中绘制椭圆、扇形,有两个重载函数。 函数原型1: void cv::ellipse( InputOutputArray img,Point center,Size axes,double angle,double startAngle,double …...

wordpress后台更新后 前端没变化的解决方法

使用siteground主机的wordpress网站,会出现更新了网站内容和修改了php模板文件、js文件、css文件、图片文件后,网站没有变化的情况。 不熟悉siteground主机的新手,遇到这个问题,就很抓狂,明明是哪都没操作错误&#x…...

Java 语言特性(面试系列2)

一、SQL 基础 1. 复杂查询 (1)连接查询(JOIN) 内连接(INNER JOIN):返回两表匹配的记录。 SELECT e.name, d.dept_name FROM employees e INNER JOIN departments d ON e.dept_id d.dept_id; 左…...

学校招生小程序源码介绍

基于ThinkPHPFastAdminUniApp开发的学校招生小程序源码,专为学校招生场景量身打造,功能实用且操作便捷。 从技术架构来看,ThinkPHP提供稳定可靠的后台服务,FastAdmin加速开发流程,UniApp则保障小程序在多端有良好的兼…...

基于数字孪生的水厂可视化平台建设:架构与实践

分享大纲: 1、数字孪生水厂可视化平台建设背景 2、数字孪生水厂可视化平台建设架构 3、数字孪生水厂可视化平台建设成效 近几年,数字孪生水厂的建设开展的如火如荼。作为提升水厂管理效率、优化资源的调度手段,基于数字孪生的水厂可视化平台的…...

精益数据分析(97/126):邮件营销与用户参与度的关键指标优化指南

精益数据分析(97/126):邮件营销与用户参与度的关键指标优化指南 在数字化营销时代,邮件列表效度、用户参与度和网站性能等指标往往决定着创业公司的增长成败。今天,我们将深入解析邮件打开率、网站可用性、页面参与时…...

算法笔记2

1.字符串拼接最好用StringBuilder&#xff0c;不用String 2.创建List<>类型的数组并创建内存 List arr[] new ArrayList[26]; Arrays.setAll(arr, i -> new ArrayList<>()); 3.去掉首尾空格...

Angular微前端架构:Module Federation + ngx-build-plus (Webpack)

以下是一个完整的 Angular 微前端示例&#xff0c;其中使用的是 Module Federation 和 npx-build-plus 实现了主应用&#xff08;Shell&#xff09;与子应用&#xff08;Remote&#xff09;的集成。 &#x1f6e0;️ 项目结构 angular-mf/ ├── shell-app/ # 主应用&…...

【从零学习JVM|第三篇】类的生命周期(高频面试题)

前言&#xff1a; 在Java编程中&#xff0c;类的生命周期是指类从被加载到内存中开始&#xff0c;到被卸载出内存为止的整个过程。了解类的生命周期对于理解Java程序的运行机制以及性能优化非常重要。本文会深入探寻类的生命周期&#xff0c;让读者对此有深刻印象。 目录 ​…...

华为OD机考-机房布局

import java.util.*;public class DemoTest5 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseSystem.out.println(solve(in.nextLine()));}}priv…...

莫兰迪高级灰总结计划简约商务通用PPT模版

莫兰迪高级灰总结计划简约商务通用PPT模版&#xff0c;莫兰迪调色板清新简约工作汇报PPT模版&#xff0c;莫兰迪时尚风极简设计PPT模版&#xff0c;大学生毕业论文答辩PPT模版&#xff0c;莫兰迪配色总结计划简约商务通用PPT模版&#xff0c;莫兰迪商务汇报PPT模版&#xff0c;…...