学习babylon.js --- [3] 开启https

babylonjs提供WebVR功能,但是使用这个功能得用https,本文讲述如何使用自签名证书来开启https,基于第二篇文章中搭建的工程。


一 生成自签名证书

首先要安装openssl,这个去网上搜下就行了。安装完之后在终端下输入openssl回车可以出现openssl的命令行,

输入q然后回车可以退出。

在MyProject目录下创建certificates目录,然后在终端下cd进入该目录,后面按照如下步骤操作,

  • 生成key.pem

    bash 复制代码
    openssl genrsa -out key.pem
  • 生成csr.pem

    bash 复制代码
    openssl req -new -key key.pem -out csr.pem

    生成过程中会提示填一些信息,随便填就可以了

  • 生成自签名证书cert.pem

    bash 复制代码
    openssl x509 -req -days 9999 -in csr.pem -signkey key.pem -out cert.pem

这样需要的证书文件就准备好了。


二 工程使用自签名证书

首先关闭server程序,然后打开工程目录下的webpack.config.js,在devServer里添加以下语句,

typescript 复制代码
        https: {
            key: fs.readFileSync('./certificates/key.pem'),
            cert: fs.readFileSync('./certificates/cert.pem')
        }

添加完毕后如下,


三 运行server

回到MyProject目录下,执行下面命令去重新构建并运行server,

bash 复制代码
npm run build
npm run start

在运行完后,可以看到打印如下,已经支持https了

此时我们在浏览器里输入https://127.0.0.1:8080并回车,会出现如下提示,

这是正常的,因为证书是自签名的,不是正规证书,这里点击高级,然后点击继续前往127.0.0.1

最后就可以再次看到熟悉的画面了,

相关推荐
知识分享小能手21 分钟前
线性代数学习教程,从入门到精通,矩阵及其运算 — 完整知识点与详细推导(3)
学习·线性代数·矩阵
必须会一定会23 分钟前
用纯 HTML/JS 做一个 AI 需求澄清器:把模糊想法转换成可执行任务书
开发语言·前端·javascript·人工智能·html·ai编程
小帅不太帅38 分钟前
1.5M 参数的 OCR 模型,我把它跑进了浏览器
前端·javascript·ai编程
小弥儿1 小时前
Firecrawl:把整个网页变成 AI 可查询的数据库
数据库·人工智能·学习
woshihuanglaoshi1 小时前
鸿蒙老旧项目升级改造高级:API废弃迁移/ArkTS语法升级/架构重构策略/增量迁移/风险管控方案
学习·华为·重构·架构·harmonyos·鸿蒙
zhangrelay1 小时前
ROS 2 Lyrical 第2章 ROS 2系统架构与核心概念
linux·笔记·学习·ubuntu·ros2
云空1 小时前
《软件专业完整学习路线图(本科4年+自学通用版,2026就业向)》
人工智能·科技·学习·计算机·编程·软件
油丶酸萝卜别吃9 小时前
前端转全栈学习路线
前端·学习
GlueNa2SiO313 小时前
第十八章 Linux故障排查与恢复
linux·服务器·笔记·学习
weixin_4316004413 小时前
NestJS 入门(3):Guard 如何挡住未登录请求?
前端·后端·学习·nest.js