本地调试https配置方法(vite配置版本)

这篇具有很好参考价值的文章主要介绍了本地调试https配置方法(vite配置版本)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

背景

有时候需要用到一些音视频接口等需要https才能拿到权限,为方便开发过程中调试,本次用到的插件是 mkcert的vite版本: vite-plugin-mkcert文章来源地址https://www.toymoban.com/news/detail-405227.html

具体实践方式

//1.添加依赖
pnpm add vite-plugin-mkcert -D



//2.在vite.config.js里面引入
import mkcert from "vite-plugin-mkcert";

export default defineConfig({
  server: {
    https: true   // 需要开启https服务
   },
  plugins: [mkcert()]    // 插件引用
})

到了这里,关于本地调试https配置方法(vite配置版本)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • vue项目,uniapp项目本地调试开启https,加载本地证书

    废话不多说,前端开发调用摄像头,获取地址位置时需要https的问题,在本地运行时可以参考这篇文章操作 我这里用的mkcert 如果你使用的vite,那么可以直接使用vitejs/plugin-basic-ssl 这时,你应该能看到生成了四个文件 ca.crt ca.key cert.crt cert.key mac 双击ca.cert,在弹出的界面选择

    2024年02月05日
    浏览(57)
  • vite中配置 https 安全超文本网络协议

    前言: https 的配置是相对安全的,但是需要购买证书,它是 SSL/TLS + HTTP 的安全超文本网络协议 此版本配置的是在 vite 开发服务器上临时配置的 https 协议, 生产环境需要购买证书, 在nginx 中配置 在 vite 项目根目录中创建 mkcert 目录 全局安装 mkcert yarn add -g mkcert 利用 mkcert 创

    2024年02月04日
    浏览(45)
  • hbuilderx本地调试h5 vue应用的时候,怎么使用https证书?

    使用uniapp在本地开发的时候,有时候是需要有https证书的,不然会提示证书错误。像camera的授权使用,还有gps地理位置的授权使用。如果没有https证书是很麻烦的。 那么可以在hbuilderx调试h5的使用https,而不是http呢?是可以的。  找到mainfest.json文件,在h5字段里添加 这样就会

    2024年02月09日
    浏览(47)
  • 在Android Studio导入一个项目之后,通常需要下载Gradle的相应版本,但是AS的自动下载很慢,有时候甚至会失败。会出现类似Error:connect time out等错误...

    用Android Studio导入一个项目时,用Gradle构建过程中报错误,估计是下载gradle.zip文件时访问不到,应该是被墙了,网速太慢,下载不了外网资源。错误有如下情况:1、加载过慢2、下载超时3、下载失败 解决方法如下: 1、下载对应的gradle版本 在Project的视图下,找到gradle,里面的

    2024年02月03日
    浏览(84)
  • vue项目使用vite设置proxy代理,vite.config.js配置,解决本地跨域问题

    非同源请求,也就是协议(protocol)、端口(port)、主机(host)其中一项不相同的时候,这时候就会产生跨域 vite的proxy代理和vue-cli的proxy大致相同,需要在vite.config.js文件中配置(打包配置也在此) 代理配置在server中,可以上vite官网服务器选项查看server.proxy代码示例:开发服务器选

    2024年01月21日
    浏览(59)
  • 本地https配置

    Download Install Perl - ActiveState1.1perl 下载地址:Download Install Perl - ActiveState 1.2 下载OpenSSL下载地址: /source/index.html 1.3 下载VS 下载地址:Visual Studio 2017 15.9 Release Notes | Microsoft Learn vs的组件(我下载了很多,具体也不知道哪些是必要的)  1.4使用vs命令框  1.5 进入解压后的openssl执

    2023年04月09日
    浏览(32)
  • NGINX 配置本地HTTPS(免费证书)

    生成秘钥key,运行: 会有两次要求输入密码,输入同一个即可。输入密码然后你就获得了一个server.key文件。 以后使用此文件(通过openssl提供的命令或API)可能经常回要求输入密码,如果想去除输入密码的步骤可以使用以下命令: 创建服务器证书的申请文件server.csr,运行: 其中Country

    2024年02月03日
    浏览(40)
  • 本地Nginx无证书,配置https

    前言 今天前端小姐姐找我要https的接口,说有个功能必须用https的才能用。平时后端接口都是http的,只有上线了,用Nginx反向代理后才变成https接口。找了几篇博客,都是线上的部署,没有本地无证书的部署方式,最终CSDN+ChatGPT轮番搜索下,发现了以下方法可以实现。 该软件

    2024年02月10日
    浏览(38)
  • vite搭建vue3项目本地环境自定义域名及端口配置

    本blog讲述的是vite直接创建的vue3的项目的本地环境自定义域名配置。 windows 首先配置本地的一个域名代理指向。 在windows环境下host文件的位置是 C:WindowsSystem32driversetc 我们需要打开目录下的hosts文件然后在 其中找到127.0.0.1然后在后面追加一行 Mac 在mac系统中我们需要打开终

    2024年02月06日
    浏览(129)
  • axios和vite在本地开发环境配置代理的两种方式,五分钟学会

    如果你使用vue或者react开发,就得使用axios吧,然后为了解决跨域问题,就得使用vite配置吧,那怎么协调配置它们两个才能正常工作呢? 正常的流程:配置axios的baseURL,然后配置vite的proxy 配置axios的baseURL: 然后再配置vite的proxy:在vite.config.js中配置 如果你想将路径重写也是

    2024年02月04日
    浏览(38)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包