vue +WebSDK

vue +WebSDK_V3.3.0

1.在index.html中引入js文件

     <!-- 实时对讲 --><script src="./static/js/jquery-1.7.1.min.js"></script><script src="./static/js/jsVideoPlugin-1.0.0.min.js"></script><script id="videonode" src="./static/js/webVideoCtrl.js"></script>

2.在vue中使用需要修改webVideoCtrl.js文件中引入jsVideoPlugin-1.0.0.min.js的方式如下

     // this.I_InitPlugin = function (options) {//   m_utilsInc.extend(m_options, options)//   var szDirName = m_utilsInc.getDirName()//   if (szDirName) {//     if ('object' === typeof exports && typeof module !== 'undefined') {//     } else if ('function' === typeof define && define.amd) {//       require([szDirName + '/jsVideoPlugin-1.0.0.min.js'], function (o) {//         window.JSVideoPlugin = o.JSVideoPlugin//         if (options.cbInitPluginComplete) {//           options.cbInitPluginComplete()//         }//       })//     } else {//       m_utilsInc.loadScript(//         szDirName + '/jsVideoPlugin-1.0.0.min.js',//         function () {//           if (options.cbInitPluginComplete) {//             options.cbInitPluginComplete()//           }//         }//       )//     }//   }//   window.addEventListener('resize', function () {//     if (m_pluginOBJECT !== null) {//       var oElem = $('#' + m_options.szContainerID)//       m_pluginOBJECT.JS_Resize(oElem.width(), oElem.height())//     }//   })//   window.addEventListener('unload', function () {})// }this.I_InitPlugin = function (options) {m_utilsInc.extend(m_options, options)if ('object' === typeof exports && typeof module !== 'undefined') {require(['./jsVideoPlugin-1.0.0.min.js'], function (o) {window.JSVideoPlugin = o.JSVideoPluginif (options.cbInitPluginComplete) {options.cbInitPluginComplete()}})} else if ('function' === typeof define && define.amd) {require(['./jsVideoPlugin-1.0.0.min.js'], function (o) {window.JSVideoPlugin = o.JSVideoPluginif (options.cbInitPluginComplete) {options.cbInitPluginComplete()}})} else {m_utilsInc.loadScript('./jsVideoPlugin-1.0.0.min.js', function () {if (options.cbInitPluginComplete) {options.cbInitPluginComplete()}})}window.addEventListener('resize', function () {if (m_pluginOBJECT !== null) {var oElem = $('#' + m_options.szContainerID)m_pluginOBJECT.JS_Resize(oElem.width(), oElem.height())}})window.addEventListener('unload', function () {})window.addEventListener('scroll', function () {})}

在使用到页面中

html

  <div id="divPlugin" class="plugin"></div>

     dataHD: {ip: "197.11.44.33333333",port: "80",user: "admin",password: "14141414",},startRealTimeIntercom: false,currentLoginIpPort: "",audiochannels: 0,

 mounted() {this.initS()},

 initS() {//初始化插件参数及插入插件WebVideoCtrl.I_InitPlugin({bWndFull: true,     //是否支持单窗口双击全屏，默认支持 true:支持 false:不支持iWndowType: 1,cbInitPluginComplete: function () {WebVideoCtrl.I_InsertOBJECTPlugin("divPlugin").then(() => {// 检查插件是否最新// WebVideoCtrl.I_CheckPluginVersion().then((bFlag) => {//   if (bFlag) {//     alert("检测到新的插件版本，双击开发包目录里的HCWebSDKPlugin.exe升级！");//   }// });}, () => {// alert("插件初始化失败，请确认是否已安装插件；如果未安装，请双击开发包目录里的HCWebSDKPlugin.exe安装！");});}});setTimeout(() => {this.clickLogin()}, 1000)},// 登录clickLogin() {console.log('denglu', this.dataHD.ip, 1, this.dataHD.port, this.dataHD.user, this.dataHD.password);let that = thisWebVideoCtrl.I_Login(this.dataHD.ip, 1, this.dataHD.port, this.dataHD.user, this.dataHD.password, {success: function (xmlDoc) {that.currentLoginIpPort = that.dataHD.ip + "_" + that.dataHD.port;that.getSpeakChanel()},error: function (oError) {that.currentLoginIpPort = that.dataHD.ip + "_" + that.dataHD.port;that.getSpeakChanel()console.log(oError, " 登录失败12.28！", oError.errorCode, oError.errorMsg)}});},// 获取对讲通道getSpeakChanel() {let that = thisWebVideoCtrl.I_GetAudioInfo(that.currentLoginIpPort, {success: function (xmlDoc) {var oAudioChannels = $(xmlDoc).find("TwoWayAudioChannel")$.each(oAudioChannels, function () {var id = $(this).find("id").eq(0).text();// 获取对讲通道that.audiochannels = id});},error: function (oError) {}})},

    // 开启对讲startSpeak() {console.log(this.audiochannels, this.currentLoginIpPort, 'this.audiochannels && this.currentLoginIpPort');if (this.audiochannels && this.currentLoginIpPort) {let iAudioChannel = parseInt(this.audiochannels, 10)WebVideoCtrl.I_StartVoiceTalk(this.currentLoginIpPort, iAudioChannel).then(() => {console.log("开始对讲成功");}, (oError) => {console.log("开始对讲失败");});}},// 停止对讲endSpeak() {WebVideoCtrl.I_StopVoiceTalk().then(() => {console.log("停止对讲成功");}, (oError) => {console.log("停止对讲失败");});},

小小功能整了一天：记住以下要点

1.在网上找了几篇文章cv的时候在index.html以内的文件名错了。。。。离离原上谱，，，

2.最开始后端大哥教我无需安装插件然后一直报错m_pluginOBJECT.JS_SubmitHttpRequest(options)

后来我细细看了一下js文件初始化插件是必须的一步我这里只需要登录成功即可是不用安装插件但是呢初始化插件这一步是必须的WebVideoCtrl.I_InsertOBJECTPlugin否则m_pluginOBJECT就是null导致报错

3.就是一定要修改webVideoCtrl.js文件中引入jsVideoPlugin-1.0.0.min.js的方式 因为vue和html编译不同会导致找不到哇。。。。

其他别的功能应该都是大同小异 cv js文件中已经封装好的方法即可对了还有最后一点就是在vue中登录的前提是可以在html那个dome的文件中可以登录再研究，别页面都登录不了就框框一顿操作；以及需要启动ng 记得将ng中的配置文件中的端口和ip修改成你本地的以及在网页中输入localhost是可以访问到页面再登录！！！！

好了准备美美下班~

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/583097.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！