工程配置

最近更新时间:2020-11-11 15:21:52

为方便 H5 开发者调试和接入腾讯云游戏多媒体引擎 API,这里向您介绍适用于 H5 开发的预备工作。

H5 SDK 支持的平台

操作系统平台 浏览器/webview 版本要求 备注
iOS Safari 11.1.2 使用高版本的 Safari。
Chrome - iOS 下暂时不支持 Chrome 浏览器
微信浏览器 - iOS 下暂时不支持微信浏览器
Android TBS(微信和手机 QQ 的默认 Webview) 43600 微信和手机 QQ 默认内置的浏览器内核为 TBS
Chrome 60+ 需要支持 H264
Mac Chrome 47+ -
Safari 11+ -
Windows(PC) Chrome 52+ -
QQ 浏览器 10.2 -

准备工作

您可以通过以下步骤获取 SDK

  1. 请进入 下载指引 页面。
  2. 在界面中找到 H5 版本的 SDK 资源。
  3. 在页面中单击【下载】,完成操作。

前端工程配置步骤

1. 端口号开放

如果所在网络有防火墙,请确定有开放以下端口:

协议 端口号
TCP 8687
UDP 8000 、 8800 、 443

使用 CDN 引入 SDK。

2. 引入前端库文件

参考以下代码,在工程中引入 WebRTCService.min.js。

<head>
    <script src="../dist/WebRTCService.min.js"></script>
</head>

3. 添加 Audio 标签

<div id="gme-audio-wrap"></div>

服务器端部署步骤

使用 GME SDK 需要鉴权,鉴权部分涉及密钥,不适合在客户端实现,建议单独业务部署。
如暂时只需客户端实现,可参考我们提供的 Demo 工程。

1. 下载程序

下载 我们为您准备的 authBuffer 示例程序,该程序可以完成对指定的 SDKAppID 的鉴权信息签名。

2. 配置服务端鉴权工程

进入 signdemo 目录,修改 config.js 文件:打开 config.js 文件,先删除默认的配置,在删除代码处,调用 appidMap 函数(参数为在腾讯云后台申请的 SDKAppid 以及对应的鉴权 key)。

const AuthBufferConfig = function () {
    this.appidMap = {};
    this.appidMap["1400089356"] = "1cfbfd2a1a03a53e";
};
//将1400089356替换为在腾讯云后台申请的 sdkAppid,1cfbfd2a1a03a53e 替换为对应 sdkAppid 的鉴权 key
注意:

AuthKey 必须与您的 SDKAppid 相对应。

3. 部署服务端鉴权工程

进入 authBuffer 示例程序目录,执行以下语句,以安装相关依赖:

npm i

然后执行脚本 node index.js,运行签名服务。

注意:

由于使用到 async 语法,请确保您的 node 版本在8以上。命令行中执行 node -v 以查看版本。

4. 测试部署结果

可在命令行用以下命令测试(确保系统中有 curl 指令):

//生成userSig:
curl "http://127.0.0.1:10005/" --data "sdkappid=1400089356&roomid=1234123&openid=1234567"

执行签名程序后,签名程序会返回鉴权信息,返回参考如下:

{"userSig":"AqhHE7QHLFYPfV/zfyrdRYHfuUn6eOA8g/J6GMjVy//Shr5ByJPTi8hzR2KyXMvn","errorCode":0}
目录