调度服务接入指南

要展示云渲染画面的组件中需要有一个id为player的div，必须拥有，该组件用于输出云渲染的画面。

<div className={styles.player}  id="player">
</div>

组件的css样式设置参考，player组件一般都是充满全屏，然后让页面标题和业务组件显示在画面上方。

.header {
  z-index: 999;
  color: #fff;
}

.player {
  width: 100vw;
  height: 100vh;
  position: absolute !important;
  z-index: 0;
  background-image: linear-gradient(180deg, rgba(3, 23, 66, .99) 0%, rgba(3, 23, 66, .69) 1%, rgba(17, 20, 36, 0) 74%);
}

接入方式：

获取调度服务的链接（部署后的地址），例如：服务部署在，http://10.18.165.2:8889/
配置调度服务host
设置要调度的集群tag，all或者空字符串代表所有集群机器均可调度
设置用户名和密码，不同的用户对应的连接权限不一样，主要表现在来最大连接数上，如果用户的权限只有1路，那么最大仅支持同时1路任务。

import {CloudRenderEngine} from '@baidu/cloudrenderengine';

// 配置调度服务host 必须
CloudRenderEngine.DispatchServer.host = 'http://10.18.165.2:8889';
// 设置要调度的集群tag 可选,空字符串和all代表不指定集群，全部可调度。
CloudRenderEngine.DispatchServer.tag = 'all';

// 设置用户名和密码 可选，默认都是admin
Engine.CloudRenderEngine.DispatchServer.username='maptest';
Engine.CloudRenderEngine.DispatchServer.password='maptest';

获取可用项目列表，如果是确定的单个项目，无需这一步（可选）。

配置完host之后，可以通过DispatchServer.GetProjectCommon()获取可用的项目列表，会返回调度服务商所有可用项目的信息，其中name用于启动项目的projectName字段值。

const list = await Engine.CloudRenderEngine.DispatchServer.GetProjectCommon();

返回值如下：

 {"data": [
        {
            "name": "default",
            "title": "默认项目",
            "description": "用于展示API使用的项目, 主要结合示例中心使用。",
            "image": "xxxx.png"
        },...]}

获取当前tag集群可用渲染容量，可用渲染容量数大于0才可以连接（必须）

import {CloudRenderEngine} from '@baidu/cloudrenderengine';

CloudRenderEngine.DispatchServer.GetAllCapacityInfo()
    .then(capacity => {
        // 因为前面选择了tag为all，所以这里查看capacity.all的剩余容量。
        if (capacity.all > 0) {
            // 可以连接了  
        }else (
            alert('服务器暂无剩余容量');
        )
    });

连接调度服务

// 更多参数参照 https://bj.bcebos.com/mapv-unreal/devDocuments/CloudRenderApp.html


const engine = new CloudRenderEngine({
    connectOnLoad: true,
    shouldShowPlayOverlay: false,
    // consul里配置的英文项目名称
    projectName: 'beijing',
});

const onSuccessed= message => {
    // 调度成功
}

const onLoadError= error => {
    // 调度失败，此处会给出具体原因，比如权限不足，可用调度容量不足，用户名或者密码错误，已达到该用户的最大连接数等。
}
// 渲染场景。调用3中的GetAllCapacity检查capacity大于0后才可以
engine.load(onSuccessed, onLoadError);

const handleEngineLoaded = () => {
    // 执行这个事件后代表资源加载完
    // 加载完成才可以使用engine的一系列方法
};

const disconnected = () => {
    // 服务连接异常时会回调此方法
};

engine.addEventListener('videoInitialised', handleEngineLoaded);
engine.addEventListener('signalingServerError', disconnected);