一、功能介绍
支持自定义配置，检测以下项目：
·扬声器
·麦克风
·摄像头
·网络（系统网络环境及课堂使用的 HTTP 请求和 WSS 域名）
·系统环境（TRTC、IM 等）
提供可视化检测报告汇总，并支持导出完整检测报告。
效果如下：
用户可按照进度条完成各项检测（可自定义开启检测项目）。完成后，检测结果将自动应用于课堂中。系统会默认选择已通过检测并修复的设备配置及域名配置，确保用户获得最佳初始体验。
二、集成指引
我们前期提供直接访问 URL、iframe 集成、Electron SDK、移动端 Mobile Native SDK 集成等多种接入方式供你选择。
后期将提供 npm 包，方便你在 Web 项目中直接使用。
三、URL 及参数
该部分 URL 及参数适用于下方所有接入方案，可统一参考。目前无论采用何种接入方式，均需使用该 URL (移动端 Native SDK 仅需使用这里的参数)。
线上设备检测链接：单击此处进行检测
| 参数 | 默认值 | 说明 |
| list | 1111 | 四位数字位掩码控制，每位1代表启用，0代表不启用。顺序分别是：第一位： 扬声器第二位： 麦克风第三位： 摄像头第四位： 网络及系统环境例如：0101代表只启用麦克风和网络及系统环境检测。 |
| language | auto | 语言，目前支持简体中文和英语，具体 value 为：auto：语言自适应zh：简体中文en：英文 |
| theme | light | 主题配色light：亮色模式dark：暗色模式 |
四、Web
Web 提供两种方式供用户使用，直接访问上述 URL 及通过 iframe 嵌入你的网页中。
五、访问 URL
用户可直接访问 线上地址链接 进行设备检测。
检测完成后，结果数据将自动存储在 localStorage 的 `tic_last_check_result` 字段中。课堂页面（1.10.3版本后）在加载时会自动读取该配置，作为网络域名及设备的默认参数。
若你的课堂项目使用自定义域名，请确保将设备检测页面也通过 CDN 回源至同一域名，以保证设备检测与课堂运行在相同域名下。
六、iframe 集成
你可以将该功能通过 iframe 集成到任意页面中。只需将 iframe 的 src 属性设置为 上述设备检测链接地址 即可。
检测完成后，设备检测会通过 postMessage 向外层发送事件，其中包含检测结果。格式如下：
{type: 'TIC_DEVICE_CHECK_RESULT',payload: result}
请记录该结果，并在用户进入课堂时，将获取到的 result 对象原样拼接到课堂进房链接中，例如：&tic_last_check_result={}
如果课堂页面同时在 URL 中指定了检测结果，且 localStorage 中也有同域结果，则优先采用 URL 中指定的结果。
七、Electron
Electron 端目前提供 SDK 接入的方式。
1. 由于部分依赖库的原因，请确保你使用以下基础库版本。
| 开发框架 | 版本 |
| Node | 16.14.2 |
2. 在你的项目中使用 npm 命令安装 SDK 包。
npm install tcic-electron-sdk@latest
注意：说明：
3. 在项目脚本里引入模块后，调用 openSiteWithUrl 接口并传入之前获取的 URL 调起设备检测页面。
const TCIC = require('tcic-electron-sdk');TCIC.openSiteWithUrl({ url: `https://class.qcloudclass.com/devicecheck/index.html?list=1111`, // list 请必传指定 electron 内 onReady: (mainWindow) => { console.log('TCIC Device Check ready', mainWindow); }, onClose: () => { console.log('TCIC Device Check close'); } });
4. 设备检测完成后，结果会记录在 Electron 的 localStorage 内，同域名下，并自动应用于课堂进房中。
你后续调用 TCIC.initialize 方法进入课堂，就会自动应用设备检测结果。
八、移动端 Mobile Native
Mobile Native 提供 SDK 接入的方式。使用和课堂主应用同一个 SDK。
九、iOS
1. 安装并配置好腾讯云实时互动-教育版 iOS 端 Native SDK（可参考此文档）。SDK 版本号要求: 最低 1.8.5.19。
2. 根据上述文档步骤5指引，开发相同的课堂进房流程，调起实际页面。
与之不同的是，如需进入设备检测页，无需配置该文档中的 schoolId、classId、userId、token 等现有所有参数，请配置以下参数。
TCICClassConfig *roomConfig = [[TCICClassConfig alloc] init];NSMutableDictionary<NSString *, NSString *> *customParams = [NSMutableDictionary dictionary];customParams[@"deviceCheck"] = @"true"; // 配置为 true 则进入设备检测customParams[@"deviceCheckParams"] = @"{\\"list\\": 1111}"; // 这里的具体参数, 请参考这篇档 “URL 及参数” 章节roomConfig.customParams = [customParams copy];
3. 设备检测完成后，结果会记录在 iOS SDK 的 localStorage 内，同域名下，并自动应用于课堂进房中。
你后续正常进入课堂，就会自动应用设备检测结果。
十、Android
1. 安装并配置好腾讯云实时互动-教育版 Android 端 Native SDK（可参考此文档）。 SDK 版本号要求: 最低 1.8.27。
2. 根据上述文档步骤4、步骤5指引，申请 SDK 授权，并初始化 Web 引擎。请确保 Web 引擎初始化完成，才可执行后续操作。
3. 根据上述文档步骤7指引，开发相同的课堂进房流程，调起实际页面。
与之不同的是，如需进入设备检测页，无需配置该文档中的 schoolId、classId、userId、token 等现有所有参数，请配置以下参数。
Map<String, String> customParamsMap = new HashMap<>();customParamsMap.put("deviceCheck", "true"); // 配置为 true 则进入设备检测customParamsMap.put("deviceCheckParams", "{\\"list\\": 1111}"); // 这里的具体参数, 请参考这篇档 “URL 及参数” 章节TCICClassConfig.Builder builder = new TCICClassConfig.Builder() .customParams(customParamsMap);
4. 设备检测完成后，结果会记录在 Android SDK 的 localStorage 内，同域名下，并自动应用于课堂进房中。
你后续正常进入课堂，就会自动应用设备检测结果。
十一、结果导出
除了自动将结果应用于课堂项目外，用户还可以手动点击结果页面的"复制结果"，导出完整的检测流程及检测记录。
如需我们协助排查用户设备问题，请复制并发送完整的检测结果给我们。
十二、定制化开发
如果需要对界面内容、交互进行调整，我们提供设备检测 SDK 及 UI 组件 npm 包供你自行接入并部署使用。其中：
·无 UI SDK：@tencent-classroom/device-check-sdk 包括课堂所用的麦克风、摄像头、扬声器、网络及系统环境检测所有底层能力，开箱即用。开发产物为 Web 项目，需自行部署线上 URL，支持 Web、Electron (需配合上述的课堂 SDK)及 Mobile Native (需配合上述的课堂 SDK) 使用。具体用法可以参见 README 说明。
·UI：@tencent-classroom/device-check-ui 基于上方 SDK 的一套设备检测 UI，初始自带的默认界面和交互与提供的上述 免开发线上设备检测连接 相同。你可创建 Web 项目引入使用，并通过参数做一些基础的定制，或直接基于其 源码 GitHub 仓库 本地引入后修改界面及交互源码来使用。具体用法可以参见 README 说明。
无论你采用何种等级的定制化二次开发，基于 npm 包亦或是直接改代码，你均需要发布编译后的页面至线上。建议发布的设备检测页面和课堂同域同源，因设备检测完成后，会自动把检测结果选优数据(媒体设备、域名)配置到 localStorage 中，课堂主项目启动时，会从这里面引入配置，优化上课体验。
为了在项目中实际加载到你的定制版设备检测页面，还需要做如下的配置。
十三、Web
用户直接访问定制的设备检测 URL 即可，无额外配置。
十四、Electron
完成上述 Electron SDK 的引入后，实际启动设备检测窗口，请在调用 TCIC.openSiteWithUrl 方法时，url 传入定制的设备检测页面 URL。具体的参数配置可继续保持用我们内置的，也可以在 UI 层按需调整。
const TCIC = require('tcic-electron-sdk');TCIC.openSiteWithUrl({ url: `https://${你定制的设备检测页面URL}?list=1111`, // list 请必传指定 electron 内 onReady: (mainWindow) => { console.log('TCIC Device Check ready', mainWindow); }, onClose: () => { console.log('TCIC Device Check close'); } });
十五、Mobile Native 移动端
请参照上述通过接入课堂移动端 SDK 以进入移动端设备检测的方案，在配置 TCICClassConfig 时，额外指定 deviceCheckUrl 参数，传入不含参数的 URL，即可进入定制的设备检测页面。
参数请通过 deviceCheckParams 方式指定，会拼接在 URL 上。具体的配置参数，可继续使用我们内置的，也可以在 UI 层按需调整。
移动端其他接入步骤请参见前述章节.
十六、Android
Map<String, String> customParamsMap = new HashMap<>();customParamsMap.put("deviceCheckUrl", "定制的设备检测链接")// … 其他用法保持不变
十七、iOS
TCICClassConfig *roomConfig = [[TCICClassConfig alloc] init];customParams[@"deviceCheckUrl"] = @"定制的设备检测链接";// … 其他用法保持不变
十八、联系我们
你有任何问题，可以扫码添加微信群与我们联系。