asp.net 使用JS获得串口数据

使用JS获得串口数据

JavaScript语言通常是一种网页编程语言,比较适合前台的一些应用设计。对于本地设备和数据的操作有比较大的限制。由于项目的需要,我需要获得本机的串口数据并显示在web端。我们有很多中方法实现功能,在实际的操作过程中我测试两种方式获得数据。第一种方法是使用ActiveX控件,JS调用MSCOMM32.dll的串口控件对串口进行控制。第二种方法是使用C#语言的控件对串口进行控制,然后使用JS+AJAX与C#进行交互获得串口数据。

       先说说两种方法各自的特点:方法一使用的是微软的ActiveX控件MSCOMM32.dll,该控件可以直接对串口进行操作,而JS也可以通过调用接口进行控制。不过ActiveX控件目前只针对IE浏览器支持较好,我用的是Chrome那就爱莫能助了。方法二目前应该是比较流行的,C#用来做后台控制个人觉得还是很不错的,而AJAX在前后台数据交互方面的作用应该也是有目共睹的。唯一的不足可能就是在数据同步方面可能会稍有延迟,毕竟AJAX是一个异步传输的标准。

       首先,我尝试了方法一。实现一个htm文件和一个js文件。关于串口调用的代码很简单,htm文件中的主要工作是添加MSCOMM32.dll控件的调用。

 

[html] view plaincopy
 
  1. <object classid="clsid:648A5600-2C6E-101B-82B6-000000000014" id="MSComm1" codebase="MSCOMM32.OCX"  
  2.         type="application/x-oleobject" style="left: 54px; top: 14px">  
  3.         <param name="CommPort" value="4"><!--设置并返回通讯端口号。-->  
  4.         <param name="DTREnable" value="1">  
  5.         <param name="Handshaking" value="0">  
  6.         <param name="InBufferSize" value="1024">  
  7.         <param name="InputLen" value="0">  
  8.         <param name="NullDiscard" value="0">  
  9.         <param name="OutBufferSize" value="512">  
  10.         <param name="ParityReplace" value="?">  
  11.         <param name="RThreshold" value="1">  
  12.         <param name="RTSEnable" value="1">  
  13.         <param name="SThreshold" value="2">  
  14.         <param name="EOFEnable" value="0">  
  15.         <param name="InputMode" value="0"><!--comInputModeText 0 (缺省) 通过 Input 属性以文本方式取回数据。comInputModeBinary 1  通过 Input 属性以二进制方式检取回数据。-->  
  16.         <param name="DataBits" value="8">  
  17.         <param name="StopBits" value="1">  
  18.         <param name="BaudRate" value="38400">  
  19.         <param name="Settings" value="38400,N,8,1">  
  20. </object>  

 

        以上代码主要设置了串口号,波特率,收发缓冲等等(具体使用说明网上有很多)。

而在js文件中则主要实现打开关闭串口,以及收发数据的操作。

 

[javascript] view plaincopy
 
  1. function OpenPort()     
  2.   {     
  3.     var cmd_send = "";  
  4.     var result = $(‘txtReceive‘).value;  
  5.     var results = result.split(‘,‘);  
  6.     for(var i=0;i<results.length;i++)  
  7.     {  
  8.         cmd_send += String.fromCharCode(eval(results[i]));  
  9.     }  
  10.     if(MSComm1.PortOpen==false)     
  11.     {     
  12.         MSComm1.PortOpen=true;     
  13.         MSComm1.Output=cmd_send;//发送命令  
  14.     }       
  15.     else     
  16.     {     
  17.         window.alert   ("已经开始接收数据!");       
  18.     }     
  19.   }   
  20.     
  21.     
  22.   function ClosePort()  
  23.   {  
  24.     if(MSComm1.PortOpen==true)     
  25.     {     
  26.         MSComm1.PortOpen=false;     
  27.     }       
  28.     else     
  29.     {     
  30.         window.alert   ("串口已经关闭!");       
  31.     }   
  32.   }  
  33.     
  34.   function SendMessage()  
  35.   {  
  36.     var cmd_send = "";  
  37.     var result = $(‘txtReceive‘).value;  
  38.     var results = result.split(‘,‘);  
  39.     for(var i=0;i<results.length;i++)  
  40.     {  
  41.         cmd_send += String.fromCharCode(eval(results[i]));  
  42.     }  
  43.     if(MSComm1.PortOpen==false)     
  44.     {      
  45.         window.alert   ("串口已经关闭!!");    
  46.     }       
  47.     else     
  48.     {     
  49.         MSComm1.Output=cmd_send;//发送命令      
  50.     }   
  51.   }  

        实现之后的效果是这样的:技术分享

 

 

 

 

我们看到的上面的文本框使我发送的指令,而下面的文本框就是我收到的数据。

 

然后,我使用方法二。使用C#打开串口,使用jQuery的函数和C#进行通讯获取当前的数据(包括当前经纬度,时间日期)。C#的代码如下:

 

[csharp] view plaincopy
 
  1. public static void Read()  
  2.     {  
  3.         sp = new SerialPort("COM4", 38400, Parity.None, 8, StopBits.One);  
  4.         sp.Close();  
  5.         sp.ReadBufferSize = 512;  
  6.         sp.ReceivedBytesThreshold = 1;  
  7.         sp.Open();  
  8.   
  9.         while (true)  
  10.         {  
  11.             try  
  12.             {  
  13.                 Databuffer += sp.ReadExisting();  
  14.             }  
  15.             catch (TimeoutException) { }  
  16.         }  
  17.     }  

 

其中sp为串口类SerialPort。打开串口之后调用ReadExisting函数读取串口数据。

         JS中获取当前数据的代码如下:

 

[javascript] view plaincopy
 
  1. function GPSGetDataTimer() {  
  2.     Referece = "data";  //获得GPS数据  
  3.     $.post("GetGPSDataComm.aspx",  
  4.             { REF: encodeURI(Referece)  
  5.             },  
  6.             function (data) {  
  7.                 alert(data);  
  8.             });  
  9. }  

 

我按照一定的频度向GetGPSDataComm.aspx文件发出请求,然后获得当前的数据,并且把字符串显示出来。效果如下图:

技术分享

下一步我计划在前台将字符串以图形化的方式显示,这样便会更加直观的观测到串口的数据。

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。