摘要：示例代码获取云手机媒体流获取云手机媒体流建立信令服务器连接并且连接成功后，即可获取远程媒体流。示例代码添加视频流到标签说明目前云手机视频流比例分为或两种。
欢迎使用WEB UPhone SDK ，产品能够为开发者提供更便捷接入、高可靠的云手机服务，让开发者快速搭建实时项目。开发者可在WEB UPhone SDK提供的功能基础上开发新功能，同时还可结合官方提供的配套demo进一步了解内置功能，应用场景广阔，开发简单易懂。
在开始集成 WEB UPhone SDK前，请确保开发环境满足一下要求：
• 准备一台可以连接到互联网的Windows或macOS计算机。
• 使用最新版本的Chrome浏览器。
导入SDK1．解压SDK压缩包，将sdk文件夹放入项目中。*开发者可借鉴官方提供demo。
说明：在创建引擎之前，开发者需定义一个id为remote-video的video标签，SDK会在这个元素内加载音视频。video标签设置autoplay、playsinline、webkit-playsinline属性。
示例代码
<div>
<video id="remote-video" autoplay="autoplay" playsinline webkit-playsinline>video>
div>
<script src="./sdk/proto.js">script>
<script type="module">
import controller from "../sdk/controller.js "; //文件路径不固定
script>
var Controller = new controller(loadingParams)示例代码
<div>
<video id="remote-video" autoplay="autoplay" playsinline webkit-playsinline>video>
div>
<script src="./sdk/proto.js">script>
<script type="module">
import controller from "../sdk/controller.js "; //文件路径不固定
//----第一步初始化SDK----
var loadingParams = {
Id: "替换为可用ID",
mediaConstraints: {
audio: true,
video: true,
},
gamename: "拉起游戏名字",
jobid: "唯一即可", //
token:"如果调用api接口SetUPhoneToken进行了设置，此处为必填，否则为可选"
}
var Controller = new controller(loadingParams)
script>
参数说明
Id:可连接的云手机ID。必填
mediaConstraints:连接约束条件。必填
audio:true/false,为true则获取音频流。
video:true/false,为true则获取视频流
gamename:**要拉起的游戏名称
jobid:**唯一即可
token:如需调用api接口SetUPhoneToken进行了设置,*此处为必填。
具体例子请查看官方demo
示例代码
Controller.onstatus(statustype,callback)Controller.onstatus(statustype,callback)
//设备连接状态回调
Controller.onstatus("devicestatus", (states) => {
if (states == 1001) {
console.log("连接设备失败");
}
if (states == 1003) {
console.log("创建设备控制失败");
}
if (states == 1008) {
console.log("服务器应答失败");
}
if (states == 1026) {
console.log("设备已被占用");
}
if (states == 73002) {
console.log("设备不存在");
}
});
//网络连接状态回调
Controller.onstatus("networkstatus", (states) => {
if (states == "connected") {
console.log("网络连接成功");
}
if (states == "disconnected") {
console.log("网络连接失败");
}
});
//启动游戏状态回调
Controller.onstatus("gamestatus", (states) => {
if (states == "success") {
console.log("启动成功");
}
if (states == "fail") {
console.log("启动失败");
}
});
//切换分辨率状态回调
Controller.onstatus("resolution", (states) => {
if (states == "success") {
console.log("切换成功");
} else {
console.log("切换失败");
}
});
开发者在媒体界面创建实例之后，即可启动云手机建立连接。
示例代码
Controller.startConnection();建立信令服务器连接并且p2p连接成功后，即可获取远程媒体流。
示例代码
var stream = Controller.getRemoteStream();
var phoneVideo = document.getElementById("remote-video");
phoneVideo.srcObject = stream; // 添加视频流到video标签
说明 : 目前云手机视频流比例分为1:2或9:16两种。开发者可在video标签方法onloadedmetadata中 获取到视频流实际宽高，根据视频比例设置需要展示的video大小即可。
如：获取到视频流宽为720，高为1440。video标签可设置宽高保证1:2比例即可。
断开云手机连接断开连接调用以下接口
示例代码
Controller.closeConnection();重新建立云手机连接
示例代码
Controller.reStart();切换分辨率时传入规定好的分辨率id，即可切换对应的分辨率
说明：手机端切换分辨率传递id不同，可参照下方参数说明
示例代码
Controller.changeResolution(id);示例代码
Controller.getLastTimeStamp(); //单位毫秒获取网络延迟时间
示例代码
Controller.getNetDelay(callback) Controller.getNetDelay((roundtime) => {console.log(roundtime) //单位毫秒; 返回到云手机桌面
示例代码
Controller.backHome(); 调用该方法一键启动云手机内游戏
示例代码
let message = {
gamename:"xxx.xxx.xxx", //游戏包名
jobid: "", //后台区分任务标识，唯一即可
};
Controller.startGame(message);清理云手机后台应用（前端显示的应用不受影响）
示例代码
Controller.clearUp() 下载官方demo压缩包，解压文件将文件夹导入到开发工具。
可在本地服务环境下运行，浏览器调试。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/126658.html
摘要：下载下载下载包下载下载概述概述概述欢迎使用，产品能够为开发者提供更便捷接入高可靠的云手机服务，让开发者快速搭建实时项目。示例代码获取云手机媒体流获取云手机媒体流建立信令服务器连接并且连接成功后，即可获取远程媒体流。 SDK下载 SDKZIP包GitHubH5SDK下载GitHub下载 概述欢迎使用H5 UPhone SDK ，产品能够为开发者提供更便捷接入、高可靠的云手机服务，让开发者快速搭...
摘要：概览概览概览购买体验购买体验即刻入手产品介绍产品介绍以下是参考的目录模版，旨在建议产品文档应该包含的内容模块。 概览购买体验即刻入手产品介绍 什么是云手机功能与优势应用场景产品计费计费模式资源删除快速上手注册账号快速测试创建云手机群控管理文件上传独立公网IP使用AOSP功能常见问题功能相关体验相关二次开发SDK集成Android SDKSDK下载工程配置快速入门接口说明iOS SDKSD...
摘要：概览概览概览购买体验购买体验即刻入手产品介绍产品介绍以下是参考的目录模版，旨在建议产品文档应该包含的内容模块。 概览购买体验即刻入手产品介绍 什么是云手机功能与优势应用场景产品计费计费模式资源删除快速上手注册账号快速测试创建云手机群控管理文件上传独立公网IP使用AOSP功能常见问题功能相关体验相关二次开发SDK集成Android SDKSDK下载工程配置快速入门接口说明iOS SDKSD...
摘要：概览概览概览购买体验购买体验即刻入手产品介绍产品介绍以下是参考的目录模版，旨在建议产品文档应该包含的内容模块。 概览购买体验即刻入手产品介绍 什么是云手机功能与优势应用场景产品计费计费模式资源删除快速上手注册账号快速测试创建云手机群控管理文件上传独立公网IP使用AOSP功能常见问题功能相关体验相关二次开发SDK集成Android SDKSDK下载工程配置快速入门接口说明iOS SDKSD...
摘要：重要接口接口含义建议调用时机初始化连接云手机需要展示云手机界面时说明使用前请对工程进行配置，否则不生效。该仅支持真机运行。每次进入云手机会从远端获取分辨率，可以根据自己的需求修改相应的分辨率可以参照设置分辨率设置分辨率。 SDK下载iOS SDK 用于 iOS 终端接入，支持端游和手游。SDK 提供了丰富的接口，满足大部分接入需求。接入方法请参见 工程配置，并可通过接口说明页面，获取更多功能...
摘要：重要接口接口含义建议调用时机初始化连接云手机需要展示云手机界面时说明使用前请对工程进行配置，否则不生效。该仅支持真机运行。每次进入云手机会从远端获取分辨率，可以根据自己的需求修改相应的分辨率可以参照设置分辨率设置分辨率。 SDK下载iOS SDK 用于 iOS 终端接入，支持端游和手游。SDK 提供了丰富的接口，满足大部分接入需求。接入方法请参见 工程配置，并可通过接口说明页面，获取更多功能...
阅读 292·2024-11-07 18:25
阅读 130383·2024-02-01 10:43
阅读 870·2024-01-31 14:58
阅读 829·2024-01-31 14:54
阅读 82776·2024-01-29 17:11
阅读 3066·2024-01-25 14:55
阅读 1987·2023-06-02 13:36
阅读 3040·2023-05-23 10:26
