activeX控件在vue项目和js原生中的使用
1.在js原生中的使用1.1引入activeX控件。代码如下:<object classid="clsid:5C39237F-7BD0-404E-ACAE-AF3C00FFA88A" codebase="UhfAx.CAB#version=1,0,0,1" height="0" id="uhfAx" style="display:none" viewastext width="0">..
·
注意:该控件只能在IE浏览器中使用
使用之前要在IE浏览器进行设置:设置-Internet选项-安全/自定义级别-Active控件和插件-对未标记为可安全执行脚本的ActiveX控件初始化并执行脚本,选择"启用"或者"提示")
1.在js原生中的使用
1.1引入activeX控件。代码如下:
<object classid="clsid:5C39237F-7BD0-404E-ACAE-AF3C00FFA88A" codebase="UhfAx.CAB#version=1,0,0,1" height="0" id="uhfAx" style="display:none" viewastext width="0"></object>
1.2建立回调函数
<SCRIPT ID=clientEventHandlersJS LANGUAGE=javascript>
function comm_OnComm(param) {
console.log(param); //返回的数据
var objData = JSON.parse(param);
}
</SCRIPT>
<SCRIPT EVENT=FireOnRfidCallBackMsg(param) FOR=uhfAx LANGUAGE=javascript>
comm_OnComm(param)
</SCRIPT>
1.3初始化控件
// 初始化控件
function initUhfAx() {
try {
uhfAx = document.getElementById("uhfAx");
//加载UHF库
var json = uhfAx.axMul_loadRFIDLib();
var obj = JSON.parse(json);
if (obj.status == 0) {
handle = obj.handle;
//初始化RFID
uhfAx.axMul_initRFID(parseInt(handle));
}
} catch (e) {
alert("初始化失败, 请检查环境配置");
}
}
1.4建立连接
//设置RF模块物理连接模式
this.uhfAx.axSetRFConnectMode(1);
//设置RF模块类型
this.uhfAx.axSetRFModuleType(2);
//打开连接
this.uhfAx.axConnectRemoteNetwork('192.168.1.16', 1200);
//开始盘点
this.uhfAx.axStartInventory(1, 0);
开始盘点后将会在回调函数中返回数据
2. 在vue中的使用
要利用节点的方式创建:
2.1.创建object标签
let obj = document.createElement('object')
obj.setAttribute('id', 'uhfAx')
obj.setAttribute('ref', 'uhfAx')
obj.setAttribute('classid', 'clsid:5C39237F-7BD0-404E-ACAE-AF3C00FFA88A')
obj.setAttribute('width', 1500)
obj.setAttribute('height', 0)
let _obj = document.getElementById("act");
_obj.appendChild(obj)
2.2.创建script回调标签
let scriptStr = document.createElement('SCRIPT')
scriptStr.setAttribute('FOR', 'uhfAx')
scriptStr.event = 'FireOnRfidCallBackMsg(param)'
scriptStr.appendChild(document.createTextNode('activeXListener.wakeUp(param)'))
_obj.appendChild(scriptStr)
这一步要在mounted钩子中加上代码:
mounted() {
window.activeXListener = this
this.initObject()
},
2.3完整代码
<template>
<div class="card-main">
<div id="act"></div>
</div>
</template>
<script>
export default {
props: {
hdlId: {
type: String
}
},
name: 'outCard',
data() {
return {
dataArr: [],
uhfAx: ''
}
},
mounted() {
window.activeXListener = this
this.initObject()
},
methods: {
initObject() {
let obj = document.createElement('object')
obj.setAttribute('id', 'uhfAx')
obj.setAttribute('ref', 'uhfAx')
obj.setAttribute('classid', 'clsid:5C39237F-7BD0-404E-ACAE-AF3C00FFA88A')
obj.setAttribute('width', 1500)
obj.setAttribute('height', 0)
let _obj = document.getElementById("act");
_obj.appendChild(obj)
let scriptStr = document.createElement('SCRIPT')
scriptStr.setAttribute('FOR', 'uhfAx')
scriptStr.event = 'FireOnRfidCallBackMsg(param)'
scriptStr.appendChild(document.createTextNode('activeXListener.wakeUp(param)'))
_obj.appendChild(scriptStr)
try {
this.uhfAx = document.getElementById("uhfAx");
// 初始化库函数(0 -- 成功, 否则失败)AfxOleInit
let retVal = JSON.parse(this.uhfAx.axInitRFID());
// console.log(retVal);
} catch (e) {
alert("初始化失败, 请检查环境配置");
}
//设置RF模块物理连接模式
this.uhfAx.axSetRFConnectMode(1);
//设置RF模块类型
this.uhfAx.axSetRFModuleType(2);
//打开连接
this.uhfAx.axConnectRemoteNetwork('192.168.1.16', 1200);
//开始盘点
this.uhfAx.axStartInventory(1, 0);
},
wakeUp(param) {
// 解析数据
const objData = JSON.parse(param);
if ("INVENTORY" == objData.Option) {
const inventory = JSON.parse(objData.Data);
let epc = inventory.epc
this.dataArr.push(epc)
let s = new Set(this.dataArr)
let newArr = Array.from(s)
console.log(this.dataArr)
console.log(newArr)
}
}
}
}
</script>
<style lang="scss" rel="stylesheet/scss" scoped>
</style>
更多推荐
已为社区贡献6条内容
所有评论(0)