tencent cloud

文档反馈

实时互动课堂(Electron)

最后更新时间:2022-04-02 16:28:10

    Demo 体验

    效果展示

    您可以下载、安装我们已经构建好的 App 安装包, 体验实时互动课堂的能力效果。不仅提供了基础的音视频通话、屏幕分享、白板、文字聊天等基础功能,还实现了全员禁麦、学生举手申请发言、老师邀请学生发言、点名、签到等高级功能。

    跑通实时互动课堂源代码

    步骤1:创建应用并获取 SDKAppID 和密钥

    如果您之前已经创建过腾讯云实时音视频的应用,可以跳过该步骤,直接使用之前创建应用的 SDKAppID 和密钥。

    1. 登录实时音视频控制台,选择开发辅助 > 快速跑通 Demo**,在创建应用页签,输入您的应用名称,例如 TestTRTC,单击创建**按钮。

    2. 跳过下载源码页签,直接单击下一步按钮,进入修改配置页签,记录下页面上显示的 SDKAppID 和密钥,后续步骤将会用到。

    步骤2:配置即时通信 IM

    说明:

    实时互动课堂同时使用了腾讯云 实时音视频 TRTC即时通信 IM 两个基础 PaaS 服务,开通实时音视频后会同步开通即时通信 IM 服务。 即时通信 IM 属于增值服务,详细计费规则请参见 即时通信 IM 价格说明

    1. 进入相关云服务菜单,单击下图中即时通信 IM 应用跳转到 IM 应用管理页面。

    2. 找到刚创建的应用,单击进入该应用管理页面。

    3. 打开菜单功能配置 > 登录与消息,如下图所示,单击登录设置区域的编辑链接,将 Web 端可同时在线个数设置为大于等于 2 的值(目前本应用最多需要同时登录 2 个 Web IM 实例,可以设置更多一些,以备后续使用)。

    步骤3:运行环境准备

    本代码工程的运行依赖于 node.js 和 yarn。

    1. 安装 node.js:
      建议 node.js 使用 14.16.0 以上版本,安装完成后,在命令行终端执行以下命令检查 node.js 版本。

      node --version
      
    2. 安装 yarn:

    • 如果 node.js 版本小于 16.10,在命令行终端执行以下命令安装 yarn

      npm i -g corepack
      
    • 如果 node.js 版本大于等于 16.10,在命令行终端执行以下命令安装 yarn。

      corepack enable
      
    注意:

    Window 10、11 下如果遇到权限不足的错误提示,请尝试以管理员身份,在 cmd 中执行。

    步骤4:克隆代码工程

    您可以直接下载代码,解压后进入代码目录 trtc-education-electron,或者使用 git 工具克隆代码工程。使用 git 工具克隆代码工程,请在命令行终端执行以下命令:

    git clone https://github.com/TencentCloud/trtc-education-electron.git
    cd trtc-education-electron
    

    步骤5:配置 SDKAppID 和密钥

    1. 找到并打开 src/main/config/generateUserSig.js 文件。
    2. 设置 generateUserSig.js 文件中的相关参数,用于生成身份认证用的用户签名 UserSig::
      • SDKAPPID:默认为 0,请设置为 步骤1 创建应用的 SDKAppID。
      • SECRETKEY:默认为空字符串,请设置为 步骤1 创建应用的密钥。
    注意:

    • 本文提到的生成 UserSig 的方案是在客户端代码中配置 SECRETKEY,该方法中 SECRETKEY 很容易被反编译逆向破解,一旦您的密钥泄露,攻击者就可以盗用您的腾讯云流量,因此该方法仅适合本地跑通 Demo 和功能调试
    • 正确的 UserSig 签发方式是将 UserSig 的计算代码集成到您的服务端,并提供面向 App 的接口,在需要 UserSig 时由您的 App 向业务服务器发起请求获取动态 UserSig。更多详情请参见 服务端生成 UserSig

    步骤6:开发模式运行

    在命令行终端中,进入代码目录 trtc-education-electron,执行以下命令。

    yarn
    yarn start
    
    注意:

    • 第一次执行 yarn 命令安装依赖时,Window10、Window11 下如果遇到权限不足的错误提示,请尝试以管理员身份,在 cmd 中执行一次。之后就可以以普通用户身份在 cmd 中或者集成开发工具自带终端中执行,例如:Visual Studio Code、WebStorm 等。
    • 安装依赖过程中,如遇到 Electron 下载慢甚至卡住不动等问题,您可以 联系我们 解决。

    步骤7:构建安装包、运行

    在命令行终端中,进入代码目录 trtc-education-electron,执行以下命令构建安装包,构建好的安装包位于 trtc-education-electron/build/release 目录下,可以安装运行。

    yarn package
    
    
    注意:

    只能使用 Mac 电脑构建 Mac 安装包,使用 Windows 电脑构建 Windows 安装包。

    技术咨询

    了解更多详情您可以联系我们或发送邮件至colleenyu@tencent.com。

    参考文档

    联系我们

    联系我们,为您的业务提供专属服务。

    技术支持

    如果你想寻求进一步的帮助,通过工单与我们进行联络。我们提供7x24的工单服务。

    7x24 电话支持