vite项目如何在本地启动https协议

vite项目如何在本地启动https协议

  • 本地启动正常配置在vite.config.js文件中默认启动http协议的请求,如何改成https呢?今天的开发中遇到了这个问题
      • 项目需求: 本地启动https协议的前端页面并且正常访问后台https协议的接口
    • 解决方法:

本地启动正常配置在vite.config.js文件中默认启动http协议的请求,如何改成https呢?今天的开发中遇到了这个问题

项目需求: 本地启动https协议的前端页面并且正常访问后台https协议的接口

解决方法:

1、获取到ssl证书秘钥和ca颁发机构,由于此项目用的是自建的ssl证书,所以没有ca证书,将这两个文件放到src根目录下路径为 ‘src/ssl/ssl_key.key’和’src/ssl/ssl_chain.crt’ 如下:
在这里插入图片描述

2、在vite.config.js文件中的server对象中添加如下配置

  https: {key: fs.readFileSync('src/ssl/ssl_key.key'),cert: fs.readFileSync('src/ssl/ssl_chain.crt'),},

3、由于此处使用的是自建的证书,没有ca颁发机构,Node.js默认不信任它,因此需要关闭证书验证:

proxy: {'^/anylysis/.*': {target: `https://${env.VITE_APP_BASE_API}:${env.VITE_APP_PORT}`, // 代理接口地址changeOrigin: true,rewrite: (path) => path.replace(/^\/anylysis/, ''),secure: false, // 禁用 SSL 证书验证},},

致此解决问题,重新启动即可,全部配置如下:

server: {// 服务配置open: true, //配置自动启动浏览器  open: 'Google Chrome'-默认启动谷歌port: 9201,https: {key: fs.readFileSync('src/ssl/ssl_key.key'),cert: fs.readFileSync('src/ssl/ssl_chain.crt'),},proxy: {'^/anylysis/.*': {target: `https://${env.VITE_APP_BASE_API}:${env.VITE_APP_PORT}`, // 代理接口地址changeOrigin: true,rewrite: (path) => path.replace(/^\/anylysis/, ''),secure: false, // 禁用 SSL 证书验证},},},

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

private修饰的方法或属性能被子类继承嘛?

先说结论:能。 这是一个反直觉的问题,毕竟大家在学习阶段接收到的知识就是:被privaite修饰的方法和成员变量不能被继承。 证明过程可参考文档:private修饰的变量如何调用_你真的熟悉java继承关系?那你知道父类private…

Elasticsearch:Runtime fields - 运行时字段(二)

这是继上一篇文章 “Elasticsearch:Runtime fields - 运行时字段(一)” 的续篇。 在查询时覆盖字段值 如果你创建的运行时字段与映射中已存在的字段同名,则运行时字段会隐藏映射字段。在查询时,Elasticsearch 会评估运…

MySQL 8.0新特性INTERSECT和EXCEPT用于集合运算

MySQL8.0.31 新版本的推出,MySQL增加了对SQL标准INTERSECT和EXCEPT运算符的支持。 1、INTERSECT INTERSECT输出多个SELECT语句查询结果中的共有行。INTERSECT运算符是ANSI/ISO SQL标准的一部分(ISO/IEC 9075-2:2016(E))。 我们运行两个查询,第一个会列…

Python基础小知识问答系列-获取列表中最大或最小N个元素

1. 问题: 怎么从数值列表中获取最大或最小几个元素? 怎么从字典元素列表中,获取字典中某个值最大或最小的几个字典元素? 2. 解决方法: 使用heapq模块中的nlargest、nsmallest。 示例: import heapqtest_list [1, 3…

事务性消息

事务性消息是一种保证消息在传递和处理过程中具有一致性、原子性、隔离性和持久性的消息传递机制。事务性消息确保在消息的发送和消费过程中,要么所有操作全部成功,要么全部失败回滚,从而保持数据的一致性和完整性。事务性消息通常用于需要严…

java基于ssm+vue 病人跟踪治疗信息管理系统

1病人功能模块 病人登录进入病人跟踪治疗信息管理系统可以查看首页、个人中心、病例采集管理、预约管理、医生管理、上传核酸检测报告管理、上传行动轨迹管理、病人治疗状况管理等内容。 病例采集管理,在病例采集管理页面可以查看账号、姓名、住院号、入院时间、病…

电通出席2024年世界经济论坛(WEF),重申推动可持续发展创新和人才培育的承诺

中国,上海——电通将出席世界经济论坛2024年新领军者年会(夏季达沃斯),本次大会将于6月25日至6月27日在中国大连举行。 2024年世界经济论坛主题为“未来增长的新前沿”,将聚焦于全球经济复苏、通胀缓解,以…

前端基础:JavaaScript(篇二)

目录 内置对象 String字符串 属性 代码 运行 方法 代码 运行 日期 代码 运行 Math 代码 运行 数组 定义 属性 代码 运行 方法 join(分隔符>) : 代码 运行 reverse(): 代码 运行 sort() : 代码 运行 事件 …

深⼊理解MySQL Innodb存储引擎的缓冲池、事务、索引底层工作原理,掌握 MySQL 主从同步,读写分离技术以及集群的搭建,具备分库分表,SQL调优经验

深入理解MySQL的InnoDB存储引擎是数据库管理员和开发人员的重要技能。以下是对InnoDB存储引擎的缓冲池、事务、索引以及主从同步、读写分离技术和集群搭建的详细原理介绍: ### InnoDB存储引擎 1. **缓冲池(Buffer Pool)**: - 缓冲池是InnoDB存储引擎…

Elasticsearch实战教程: 如何在海量级数据中进行快速搜索

🎬 鸽芷咕:个人主页 🔥 个人专栏: 《C干货基地》《粉丝福利》 ⛺️生活的理想,就是为了理想的生活! 引入 Elasticsearch(简称ES)是一个基于Apache Lucene™的开源搜索引擎,无论在开源还是专有领…

Python冒泡排序

冒泡排序过程:从第一个值开始,每取一个值与剩余后面的每个值两两比较,如果后面的值比当前值大,就交换它们的位置 以下是冒泡排序的Python实现: ls [2, 5, 3, 11, 7, 9]for i in range(len(ls)):for j in range(len(…

Linux查询某个目录中包含的文件总个数和文件总存储,结果写入文件中

在Linux中,如果你想要将命令的输出结果保存到文件中,可以使用重定向操作符 > 或 >>。这里有两个基本的区别: > 会创建一个新的文件或者覆盖已存在的文件,然后将输出写入该文件。>> 会将输出追加到已存在的文件…

【SPIE独立出版】第四届智能交通系统与智慧城市国际学术会议(ITSSC 2024)

第四届智能交通系统与智慧城市国际学术会议(ITSSC 2024)将于2024年8月23-25日在中国西安举行。本次会议主要围绕智能交通、交通新能源、无人驾驶、智慧城市、智能家居、智能生活等研究领域展开讨论, 旨在为该研究领域的专家学者们提供一个分享…

SWOT视角洞察:一篇文章详解AI Agent发展

AI Agent自盖茨远见后火爆,吴恩达提出设计模式成创业圣经。其优势显著:技术门槛低,市场需求广,非技术人员可参与开发。然而,挑战亦不容忽视:技术成熟度需提升,数据安全和隐私保护待加强&#xf…

Linux shell编程学习笔记61: pstree 命令——显示进程树

0 前言 在 Linux shell编程学习笔记59: ps 获取系统进程信息,类似于Windows系统中的tasklist 命令https://blog.csdn.net/Purpleendurer/article/details/139696466?spm1001.2014.3001.5501 中我们研究了ps命令。在Linux中,通过ps命令&am…

【Hec-Ras】第一期:软件安装

Hec-Ras软件安装 1 HEC-RAS软件介绍2 HEC-RAS软件下载3 HEC-RAS软件安装4 HEC-RAS软件界面介绍参考 1 HEC-RAS软件介绍 HEC-RAS 是美国陆军工程兵团工程水文中心( Hydrologic Engineering Centers, HEC)开发的河道水力计算程序(River Analys…

C++中的虚函数与Java中的接口区别

在C和Java中,虚函数(virtual function)和接口(interface)虽然都用于实现多态性,但它们在设计和使用上有着本质的区别,因此不能简单地将C中的虚函数理解为Java中的接口。 C中的虚函数 定义&…

go sync包(五) WaitGroup

WaitGroup sync.WaitGroup 可以等待一组 Goroutine 的返回,一个比较常见的使用场景是批量发出 RPC 或者 HTTP 请求: requests : []*Request{...} wg : &sync.WaitGroup{} wg.Add(len(requests))for _, request : range requests {go func(r *Reque…

WebSocket解决方案(springboot 基于Redis发布订阅)

WebSocket 因为一般的请求都是HTTP请求(单向通信),HTTP是一个短连接(非持久化),且通信只能由客户端发起,HTTP协议做不到服务器主动向客户端推送消息。WebSocket确能很好的解决这个问题&…

基于SpringBoot的漫画网站系统

你好呀,我是计算机学姐码农小野!如果有相关需求,可以私信联系我。 开发语言:Java 数据库:MySQL 技术:B/S架构模式、Java技术 工具:Visual Studio、MySQL数据库开发工具 系统展示 首页 用户…