学习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,

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

相关推荐
Ai-_Man6 小时前
从聊天框到正式文档:AI导出鸭瞄准AI大模型应用的“最后一公里”
开发语言·前端·javascript·人工智能·小程序
m0_734172426 小时前
Python用zip配对前先检查长度
python·学习
乌暮6 小时前
拆解网页的底层逻辑:用费曼学习法讲透 HTML 与 CSS
前端·css·学习·html
专业程序开发源6 小时前
springboot酒店会员点餐系统22339-计算机课程设计、毕业设计
java·javascript·vue.js·spring boot·后端·php·课程设计
xixingzhe26 小时前
正确认知HTTPS:并非万能加密,通信安全需要多层防护
网络协议·安全·https
辣知6 小时前
辣知·化智73 左丘明留下的那面镜子
学习
qeen876 小时前
【QT】 信号与槽初始
开发语言·笔记·qt·学习
旖旎夜光6 小时前
【LangGraph实战】LangGraph 学习笔记(三):Overwrite、输入输出模式与四大工作流模式
人工智能·笔记·学习·ai·langgraph
艾莉丝努力练剑6 小时前
【AI大模型接入SDK】C++ ChatSDK使用手册
开发语言·网络·c++·人工智能·学习·大模型
panxianren14 小时前
Bun 1.4 的 bun test --parallel 将 4 秒的测试套件缩短到约 1 秒
java·javascript