15分钟从零开发一个属于你的H5语音聊天室

这是一个纯前端Serverless的H5语音聊天室

项目Demo演示地址

在线演示地址 备用地址

浏览器支持状况

简介

本文使用的是腾讯云给出的游戏语音解决方案，我的开发者能够无偿使用部分功能。

免费的真香2333

本文只使用了H5 SDK，只有最基础的语音聊天服务。还有更高级的空间音效，语音识别等功能，不过在Web无法用就是了...

不包含广告，可放心食用。

以前掘金有人疯狂发某云的组队广告，真的挺烦人的。

须要材料

1. 腾讯云帐号
2. Github帐号
3. 一个HTTPS域名及一个可以部署node的服务器
4. 本地运行NodeJS，服务端部署NodeJS服务的条件

涉及技术

只是用到了，本文不涉及0.0

• Vue
• Element-UI
• Node.js
• pm2

第一步，建立应用

登录腾讯云官网，访问GME游戏多媒体引擎

新建应用，平台勾选H5，服务区域选择中国大陆。（不须要付费，免费用量500日pv）

注意！关闭实时语音服务之外的其余服务（由于这些要付费的样子qwq）

建立完成后点开应用详情就能够看到AppID和权限密匙了

若有疑问可查阅腾讯云-GME接入指引

第二步，下载鉴权程序并部署

鉴权部分具体操做请参照官方文档 cloud.tencent.com/document/pr…

大体流程：

1. 下载签名程序
2. 将程序中的AppID和权限密钥修改为你本身的
3. 测试签名程序可否正常工做

本地测试这个签名程序无误，能正常获得鉴权信息以后，则可使用pm2将这个签名程序部署到你的服务器上了。（注意！须要部署到HTTPS域名下）

第三步，fork前端程序并部署

登录Github，fork个人这个gme-chat-demo项目 （该项目改造自官方模板，项目中已包含了SDK）

而后将index.html中此处代码中的AppID和签名程序地址修改成你本身的便可。

使用Github Pages将前端页面部署，Github会自动给你分配https域名😎

而后...

找你的朋友来试试吧~😁

若是没有朋友能够本身开两个标签页（哭了）

关于GME SDK更多的能力与API，则能够阅读官方文档

总结

各类云服务商为我的开发者提供了更便捷的云服务，serverless，音视频流服务等...

让更多我的开发者也轻松能作出直播，聊天室等复杂功能。

文章潦草，还望见谅 ･ω･ 有任何意见也欢迎提出~