npm 包名为：qhsk_pixelstream

https://registry.npmjs.org/ 修改方式：修改 package.json 文件中的 version 版本号，npm run build，再登录 npm 账号重新发布即可。

下载方式

npm install qhsk_pixelstream
//或
yarn add qhsk_pixelstream

使用方式

<!-- 前端像素流初始化参考 -->

<!-- 连接像素流 -->
import Pixelstream from "qhsk_pixelstream";

//在页面dom加载完成之后进行初始化
//自行决定是否需要将实例化对象存放在window上，还是其他位置方便全局使用即可。
window.Ps = new Pixelstream("61.241.66.125:33042", false, false, (data)=>{
      console.log("connectUE", data);
    });
//初始化完成后，调用connect方法即可，连接视频流
Ps.connect();

<!-- 关闭像素流 -->
Ps.disconnect()

注意：

1. Pixelstream 类的传参依照原有前海 cim 项目中 loadUe 的传参，分别为 addr,isDirect,useHttps,> callback
2. 若不考虑 ue 套前端的连接方式可去掉 isDirect 参数
3. addr 参数参考前海 cim 的获取 addr 方式，前端自行通过后台接口获取 ue 像素流地址，这里跟 sdk 解耦合，作为前端内容考虑。
4. 若不需要使用回调函数，可将回调函数参数置为 null 即可。

<!-- 子类使用参考 -->

<!-- Camera子类的使用方式 -->
Ps.Camera.PlayRoaming({data,callback})

<!-- 示例参考 -->
Ps.Camera.PlayRoaming({
        RoamingPath:[
        {
                Location : {X:0.0,Y:0.0,Z:1000.0},
                Rotation : {Pitch:0.0,Yaw:0.0,Roll:0.0},
                Time     : 5.0
        },
        {
                Location : {X:1000.0,Y:1000,Z:1000.0},
                Rotation : {Pitch:0.0,Yaw:20,Roll:0.0},
                Time         : 5.0
        },
        {
                Location : {X:0.0,Y:0.0,Z:2000.0},
                Rotation : {Pitch:0.0,Yaw:0.0,Roll:0.0},
                Time         : 5.0
        },
        ]
},(res)=>{
  console.log('PlayRoamingcb',res)
})

<!-- 源码地址 -->
uesdk\modules\Camera\index.js

sdk扩展开发

1. 参考Camera子类，在modules下添加新的子类文件夹以及index.js文件，子类的方法根据需求填写在index.js文件中或新增额外js文件引入到index.js中。

<!-- Camera子类文件 -->
export default class {
  constructor(send2Ue, listen2Ue) {
    this.send2Ue = send2Ue;
    this.listen2Ue = listen2Ue;
    <!-- 配置子类的cmd根路径 -->
    this.baseCmd = "/CameraManager";
  }
  /**
   * @description: 播放漫游数据
   * @param {*} data
   * @param {*} cb
   * @return {*}
   */  
  PlayRoaming(data, cb) {
    // 监听结束漫游回调,作为播放漫游的回调
    this.listen2Ue(`${this.baseCmd}/EndRoaming`, cb);
    // 发送播放漫游指令
    this.send2Ue(`${this.baseCmd}/PlayRoaming`, data);
  }
  <!-- PlayRoaming方法需要特别注意 -->
  // 当存在PlayRoaming和EndRoaming分别作为cmd子路径，一个为发送指令另一个为监听指令，这里可以按照示例合并为一个整体的方法，传入的data和callback分别对应去注册send2Ue和listen2Ue。对外只暴露PlayRoaming方法。
}

2. 子类编写完成后，在项目根目录的index.js文件中引入子类，并在connect方法中注册子类，确保send2Ue和listen2Ue方法已经生效并传入子类的实例化对象即可。

<!-- 主文件index.js -->

    ///其他代码
  connect() {
    loadUE(this.url, this.isDirect, this.usehttps, this.callback);
    const { send2Ue, listen2Ue, clearMsgCb } = useUemsg(
      emitUIInteraction,
      addResponseEventListener
    );
    this.clearMsgCb = clearMsgCb;
    this.send2Ue = send2Ue;
    this.listen2Ue = listen2Ue;

    //子类注册
    // // 在连接成功后,注册子类,传入send2Ue和listen2Ue方法作为消息接发的入口。
    this.Gls = new Gls(send2Ue, listen2Ue);
    this.Camera = new Camera(send2Ue, listen2Ue);
  }

    ///其他代码

其他

1. 本项目由rollup打包，生成的压缩文件地址为：uesdk\dist\Pixelstream.js
2. 在.npmignore文件中可以设置不需要发布到npm的文件，例如moduls、ue、utils、index.js等，保护代码安全。发布时只需要dist文件夹以及pacakge.json、readme.md即可。
3. 如果前端使用方式为script标签引用dist文件夹下的压缩文件。对外暴露的类名可以在rollup.config.js中修改，例如：

export default {
\\\ 其他代码
output: {
  file: "dist/Pixelstream.js", // 输出文件路径和名字
  format: "umd", // 通用模块定义，适用于客户端和服务器
  name: "Pixelstream", // 包的全局变量名，若在浏览器中使用
},
\\\ 其他代码
};

4. 本项目对于ue的依赖文件做了修改 ，可能跟原始的app.js和webRtcPlayer.js文件有差异。
5. 暂时为解决画面 黑边问题。