需求描述：需要在web端用js获取电子秤的重量。（由于erp限制的原因只能通过js获取，不能修改html，不能引用jquery）
实现目标：电子秤面板上的数据实时反映在我们公司内部erp系统界面上。
通常实现步骤：
首先要从web端获取串口数据需要用到activex（由于我们目前这个需求只需要考虑在IE浏览器下的正常运行）
网上关于对这个控件的调用一般是这样写的
<object classid="clsid:648A5600-2C6E-101B-82B6-000000000014" id="MSComm1" codebase="MSCOMM32.OCX" type="application/x-oleobject" style="left: 54px; top: 14px"> <param name="CommPort" value="4"> <!--设置并返回通讯端口号。--> <param name="DTREnable" value="1"> <param name="Handshaking" value="0"> <param name="InBufferSize" value="1024"> <param name="InputLen" value="0"> <param name="NullDiscard" value="0"> <param name="OutBufferSize" value="512"> <param name="ParityReplace" value="?"> <param name="RThreshold" value="1"> <param name="RTSEnable" value="1"> <param name="SThreshold" value="2"> <param name="EOFEnable" value="0"> <param name="InputMode" value="0"> <!--comInputModeText 0 （缺省） 通过 Input 属性以文本方式取回数据。comInputModeBinary 1 通过 Input 属性以二进制方式检取回数据。--> <param name="DataBits" value="8"> <param name="StopBits" value="1"> <param name="BaudRate" value="38400"> <param name="Settings" value="38400,N,8,1"> </object>
而由于前面所说的我们erp的限制，我无法修改html文件，因此无法在html文件中添加对MSCOMM32.dll的引用。因此我是用如下方法实现的：
//创建MSComm对象
function uf_GetSerPortData()
{
try
{
MSComm1 = new ActiveXObject("MSCOMMLib.MSComm.1");
if ((typeof (MSComm1) == "undefined") || (MSComm1 == null))
{
alert("创建MSComm1对象失败！");
}
else
{
//绑定事件
fn();
}
}
catch (err)
{
alert(err.description);
}
}
var fn=function(){
function MSComm1::OnComm() {
MSComm1_OnComm();
}
}
在这里有几个地方需要解释一下：
- 打开端口的时候提示创建对象失败：
如果后面设置MSComm1的PortOpen提示失败时，就需要添加对MScomm控件的注册。具体的注册方法在如下链接里面有详细说明：http://jingyan.baidu.com/article/375c8e19a2953b25f2a22986.html
需要注意的是链接中给出的是32位系统的解决方案，对于64位系统路径可能有所不同。需要用户根据自己的系统情况进行修改。
- 绑定控件的事件：
我目前所使用的电子秤有两种输出模式，一种是连续输出打印的一种是在屏幕上按键打印输出的。现在我们讨论在连续输出模式下的问题。由于是连续输出因此我们需要对电子秤的输出做一个事件绑定，并且通过一个回调函数来实现获取重量数据后在erp中进行对应的数据展示。一般我们可以通过诸如下面的代码来实现事件绑定
<script language="javascript" for="window" event="onload"> ...... </script>
但是由于无法修改html代码，仅仅只能修改js代码的限制，我们现在无法通过这种方式实现事件绑定。（我也想过通过js动态在html中插入这段引用，但实际结果并没有触发事件，不知道是由于加载顺序的原因，还是erp本身对于这块的安全限制）因此我们只能另寻他法.在这里就用到了下面的代码了
function uf_GetSerPortData()
{
try
{
MSComm1 = new ActiveXObject("MSCOMMLib.MSComm.1");
if ((typeof (MSComm1) == "undefined") || (MSComm1 == null))
{
alert("创建MSComm1对象失败！");
}
else
{
//绑定事件
fn();
}
}
catch (err)
{
alert(err.description);
}
}
var fn=function(){
function MSComm1::OnComm() {
MSComm1_OnComm();
}
}
对于 function MSComm1::OnComm() 这种写法，我之前从没见过，后来是在一篇博文上面看到的，试了下发现真的可以实现，事件绑定。这样就完成了在js中进行事件绑定了。后面的回调函数显示重量数值就很简单了。
其中 new ActiveXObject("MSCOMMLib.MSComm.1"); 引号中的是activex控件的ProgID，在注册表中classid所对应下的项中可以找到。也就是创建控件的时候起的名字。
下面贴上实现的完整代码（直接从实现demo当中抠出来的，关于数值显示的地方代码丑陋大家略过就行。但肯定是可以实现需求的，已经测试过）
//创建MSComm对象
function uf_GetSerPortData()
{
try
{
MSComm1 = new ActiveXObject("MSCOMMLib.MSComm.1");
if ((typeof (MSComm1) == "undefined") || (MSComm1 == null))
{
alert("创建MSComm1对象失败！");
}
else
{
//绑定事件
fn();
}
}
catch (err)
{
alert(err.description);
}
}
var fn=function(){
function MSComm1::OnComm() {
MSComm1_OnComm();
}
}
//事件响应
function MSComm1_OnComm()
{
switch(MSComm1.CommEvent)
{
case 1:{ window.alert("Send OK！"); break;} //发送事件
case 2: { Receive();break;} //接收事件
default: alert("Event Raised!"+MSComm1.CommEvent);;
}
}
function OperatePort()
{
if(MSComm1.PortOpen==true)
{
try{MSComm1.PortOpen=false;
SKButton1.value="打开串口";
}catch(ex)
{alert(ex.message);}
}
else{
try{ MSComm1.PortOpen=true;
MSComm1.InBufferCount = 0;
SKButton1.value="关闭串口";
}catch(ex)
{alert(ex.message);}
}
}
function ConfigPort()
{
var comport="";
var boundRate="";
var jiaoyanwei="";
var shujuwei="";
var tingzhiwei="";
comport=SKDBcombobox1.value;
boundRate=SKDBcombobox2.value;
jiaoyanwei=SKDBcombobox3.value;
shujuwei=SKDBedit5.value;
tingzhiwei=SKDBedit6.value;
if(MSComm1.PortOpen==false)
{
try{
/*
MSComm1.CommPort=comport;
MSComm1.Settings=boundRate+","+jiaoyanwei+","+shujuwei+","+tingzhiwei;
MSComm1.OutBufferCount =0; //清空发送缓冲区
MSComm1.InBufferCount = 0; //滑空接收缓冲区
*/
MSComm1.CommPort="4";
switch(SKDBcombobox1.value)
{
case "COM1":
MSComm1.CommPort="1";
break;
case "COM2":
MSComm1.CommPort = "2";
break;
case "COM3":
MSComm1.CommPort = "3";
break;
}
MSComm1.Settings="9600"+
","+"n"+
","+"8"+
","+"1";
MSComm1.OutBufferCount =0; //清空发送缓冲区
MSComm1.InBufferCount = 0; //滑空接收缓冲区
MSComm1.RThreshold=1; //接收一个字节就触发omcom事件
alert("已配置串口COM"+MSComm1.CommPort+"\n 参数:"+MSComm1.Settings);
}catch(ex){alert(ex.message);}
}
else{ alert("请先关闭串口后再设置！");}
}
var tmpWeight = "";
//接收数据
function Receive()
{
//alert("InBufferCount::"+MSComm1.InBufferCount);
var inputvalue = MSComm1.Input;
if (inputvalue.indexOf('g') >= 0) {
return;
}
// alert(inputvalue);
tmpWeight+=inputvalue.replace('-', '');
if(tmpWeight.length>16)
{
if(tmpWeight.indexOf('000'))
{
var weight=trim(tmpWeight.substr(5,5));
if(weight.indexOf('0')==0)
{
weight=weight.replace("0","0.")
}
SKDBedit7.value=weight;
tmpWeight="";
}
}
//alert("InBufferCount::"+MSComm1.InBufferCount);
}
/*
var weight;
var myArray=new Array();
function GetWeight()
{
}
*/
function serPortInit()
{
SKDBcombobox1.value="COM4";
SKDBcombobox2.value="9600";
SKDBcombobox3.value="无NONE";
SKDBedit5.value="8";
SKDBedit6.value="1";
//初始化创建MSComm1对象
uf_GetSerPortData();
}
function trim(str){ //删除左右两端的空格
return str.replace(/(^\s*)|(\s*$)/g, "");
}
function ltrim(str){ //删除左边的空格
return str.replace(/(^\s*)/g,"");
}
function rtrim(str){ //删除右边的空格
return str.replace(/(\s*$)/g,"");
}
2197
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
