張宏橋 蔣虎 曾曉華 段凌飛

摘 ?要：隨著計算機技術的不斷發(fā)展，物聯(lián)網(wǎng)設備的遠控技術在實現(xiàn)上變得更加快捷。其中，串口是當前嵌入式數(shù)據(jù)傳輸技術的一種主流通訊方式，它有著協(xié)議簡單，支持全雙工傳輸?shù)忍攸c。本文針對常用的RS232串口，基于Websocket協(xié)議，使用支持跨平臺的網(wǎng)絡庫libevent和串口庫Serial Communication Library，研究并實現(xiàn)了Websocket與RS232之間的數(shù)據(jù)中轉(zhuǎn)。接著基于Web前端HTML5標準的Websocket特性及相關UI框架，實現(xiàn)了Web與RS232之間數(shù)據(jù)的異地操作與傳輸，將串口數(shù)據(jù)實時繪制為網(wǎng)頁圖表并最終驗證了該系統(tǒng)設計的有效性與可擴展性。

關鍵詞：物聯(lián)網(wǎng);遠程控制;串口通訊;Websocket

中圖分類號：TP311 ? ? 文獻標識碼：A

Abstract：With the development of computer technology，it becomes more efficient to implement the remote control techniques on the devices of Internet of Things.The serial port is a main method of data transmission for embedded devices，with the characteristics of simple protocol and good support for full duplex transmission.Aiming at the serial port type of RS232，this paper studies the research and implementation of data transfer between Websocket and RS232 by using the cross-platform network library of libevent and the serial port library of Serial Communication Library.Then，based on the Websocket characteristics of HTML5 and Echarts Library of Web UI framework，it realizes the remote operation and data transmission between Web and RS232，and renders the serial port data on a web page graph in real time.Finally，the validity and extensibility of the proposed system are verified.

Keywords：Internet of Things;remote control;serial port communication;Websocket

1 ? 引言（Introduction）

隨著計算機技術的發(fā)展，物聯(lián)網(wǎng)設備遠程操控的實現(xiàn)變得更加快捷。串口是目前嵌入式數(shù)據(jù)傳輸?shù)闹髁鞣绞街?，有著協(xié)議簡單，線路連接方便等特點[1]。同時，在人機交互領域，Web前端技術也愈發(fā)成熟與穩(wěn)定，終端使用支持HTML5的瀏覽器訪問服務器頁面，即可實時控制節(jié)點并獲取硬件數(shù)據(jù)[2]。目前主流的前端UI設計趨于模塊化與代碼的精簡化，其本身又具有跨平臺的優(yōu)勢，使得前端的多端發(fā)布更加容易[3]。本文利用H5標準的Websocket協(xié)議，使用C/C++設計了一種跨平臺的網(wǎng)頁與串口數(shù)據(jù)交互的中轉(zhuǎn)服務端，可以在網(wǎng)頁中對本地或者遠程的多個硬件串口進行操作，同時允許用戶可以便捷地對前端UI進行定制。

本文設計的數(shù)據(jù)操作框架如圖1所示?；赪ebsocket協(xié)議與串口編程接口，將硬件數(shù)據(jù)上送至Web控制端，同時從Web控制端將相應的操作指令下發(fā)至數(shù)據(jù)服務端以完成具體操作。

各模塊解釋如下：（1）被控設備：即下位機設備，通過RS232協(xié)議進行數(shù)據(jù)交互。（2）數(shù)據(jù)服務端：系統(tǒng)框架的核心，對下管理并操作多個串口數(shù)據(jù)，對上接收并執(zhí)行Web控制端下發(fā)的控制指令，并在指令完成后向控制端返回相應的結(jié)果。（3）Web控制端：人機交互界面，使用Web框架實現(xiàn)，通過Websocket連接數(shù)據(jù)服務端并間接操作串口，允許控制端與服務端的異地分布。

2 ? 系統(tǒng)相關技術（System technology）

2.1 ? 串口操作

大部分的設備模塊均支持一個以上的串口來進行通訊[4]。本文基于C/C++的編程環(huán)境，針對常用的RS232串口進行操作。在PC級別的操作系統(tǒng)上，串口操作一般基于自身的應用程序編程接口以文件的方式驅(qū)動串口。本文使用支持Windows、Linux，以及Mac操作系統(tǒng)環(huán)境的Serial Communication Library庫進行串口操作，相關功能函數(shù)如下：

信息查詢：vectorcomInfo=serial：：list_ports（），其中comInfo為包含串口名稱等字符串信息的vector向量。

設置與打開串口：serial：：Serial（strComName，nBaud，tagTimeOut），其中strComName為string類型的串口名稱，nBaud為整數(shù)類型的波特率，tagTimeOut為serial：：Timeout結(jié)構(gòu)體類型的讀寫超時配置。該構(gòu)造函數(shù)默認調(diào)用open成員函數(shù)，如果打開失敗則會拋出異常信息。

關閉串口：Serial：：close（），關閉當前實例對應的串口。

狀態(tài)查詢：Serial：：isOpen（），返回當前實例對應串口的打開狀態(tài)。

讀取串口：Serial：：read（pBuffer，nLen），從當前串口讀緩沖區(qū)中讀取指定整數(shù)長度nLen的數(shù)據(jù)到字節(jié)指針pBuffer指向的內(nèi)存中。

寫入串口：Serial：：write（pBuffer，nLen），將字節(jié)指針pBuffer指向的內(nèi)存數(shù)據(jù)，寫到串口寫緩沖區(qū)中，長度為指定的整數(shù)nLen。

2.2 ? Websocket數(shù)據(jù)傳輸

Websocket是W3C標準下的一種基于Tcp的應用層協(xié)議，利用該協(xié)議可以在Web層面快速穩(wěn)定的進行數(shù)據(jù)流交互[5]。協(xié)議的基本操作包含安全握手，數(shù)據(jù)類型與數(shù)據(jù)流控制等內(nèi)容，關鍵的通訊狀態(tài)如下：

準備連接狀態(tài)：服務端建立Tcp監(jiān)聽服務，等待客戶端發(fā)起連接。

握手驗證狀態(tài)：Websocket基于HTTP協(xié)議進行握手驗證，瀏覽器的網(wǎng)頁地址格式為ws：//服務主機地址：端口（默認80），對于HTTPS（HTTP+SSL）的加密驗證，地址格式為wss：//服務主機地址：端口（默認443）。當客戶端申請握手時，在協(xié)議頭的“Sec-WebSocket-Key”字段里添加由Base64編碼的握手文本，當服務端收到該握手信息后，提取該Base64秘鑰，并在其之后加上一段特殊字符串"258EAFA5-E914-47DA-95CA-C5AB0DC85B11"，接著進行SHA-1與BASE64的操作，生成應答信息，最終賦給應答協(xié)議頭中的“Sec-WebSocket-Accept”字段并返回給客戶端校驗，以確認接下來的數(shù)據(jù)交互是Websocket協(xié)議訪問，而非HTTP。

數(shù)據(jù)傳輸狀態(tài)：Websocket支持多種長度與消息類型的數(shù)據(jù)傳輸。常用的數(shù)據(jù)格式有文本、二進制、PINGPONG等格式，此外還可自定義數(shù)據(jù)類型。數(shù)據(jù)長度上支持短（小于126字節(jié)）、中（小于65536字節(jié)）、長（小于2^64字節(jié)）三種長度的數(shù)據(jù)傳輸。

由于底層的Tcp是面向流的傳輸，可以通過協(xié)議定義的控制字來解決Tcp傳輸數(shù)據(jù)的粘包、分包等問題，具體的幀頭功能解釋詳見表1。

本文使用支持跨平臺的libevent網(wǎng)絡庫，基于上述的Websocket協(xié)議原理實現(xiàn)相關服務。實現(xiàn)時需注意如下問題：（1）長數(shù)據(jù)分幀方式的不同，即數(shù)據(jù)有可能在Websocket層被分為多幀發(fā)送;也可能在Websocket層使用一幀發(fā)送，卻在Tcp層被分為了多幀。（2）服務端與客戶端在數(shù)據(jù)加密上的區(qū)別，一般情況下，服務端向客戶端發(fā)送非加密數(shù)據(jù)，客戶端向服務端發(fā)送掩碼異或加密的數(shù)據(jù)。

2.3 ? Web端數(shù)據(jù)傳輸與UI設計

目前主流的H5瀏覽器均支持Websocket相關的Javascript編程接口，相關的功能函數(shù)與事件如表2所示。

在目前H5的Web標準下，可以使用各類Javascript庫高效地實現(xiàn)Web數(shù)據(jù)的渲染與交互。如JQuery庫有著編碼方便、性能高、插件豐富等特點;EasyUI庫具有美觀的界面插件，專注于用較少的代碼開發(fā)UI。Echarts則是圖表顯示功能較為強大的Javascript功能庫，可以方便地集成到其他模塊當中[6]。本文基于Echarts庫，將Websocket收到的串口數(shù)據(jù)實時繪制在瀏覽器圖表上。

3 ? 系統(tǒng)設計與實現(xiàn)（System design and implementation）

本文采用循環(huán)指令隊列實現(xiàn)異步串口操作，支持通過一個控制端同時操作多個串口，控制流程如圖2所示，其中“源ID”指的是下發(fā)當前指令所用的Websocket上下文環(huán)境。

控制指令采用字符串格式，服務端接收指令并異步執(zhí)行串口操作，最終返回給控制端相應的操作結(jié)果，具體命令與響應的定義如下文所述。

查詢所有串口：當控制端下發(fā)查詢命令后，數(shù)據(jù)服務端執(zhí)行串口遍歷相關功能，并返回串口列表。

打開串口：控制端下發(fā)打開串口命令，指定要打開串口的名稱、波特率等信息，數(shù)據(jù)服務端先檢查指定的串口是否存在，若存在則檢查當前串口狀態(tài)并嘗試以指定的配置打開串口，最終異步響應執(zhí)行結(jié)果。

關閉串口：控制端下發(fā)關閉串口命令，指定要關閉串口的名稱，數(shù)據(jù)服務端先檢查指定的串口是否存在，如果存在且串口已經(jīng)打開，則嘗試關閉串口，最終異步響應執(zhí)行結(jié)果。

查詢串口狀態(tài)：控制端下發(fā)串口查詢命令，指定要查詢串口的名稱，數(shù)據(jù)服務端先檢查指定的串口是否存在，如果存在則檢查串口的開關狀態(tài)，最終異步響應查詢結(jié)果。

寫入串口數(shù)據(jù)：控制端下發(fā)寫串口命令，指定所寫的數(shù)據(jù)類型、串口號，以及要寫入的數(shù)據(jù)。數(shù)據(jù)服務端先檢查指定的串口是否存在，如果存在且打開則執(zhí)行寫入操作，最終異步響應寫入結(jié)果。其中，數(shù)據(jù)類型為0或1，0表示文本型數(shù)據(jù)，1表示用Base64編碼的二進制數(shù)據(jù)。

讀取串口數(shù)據(jù)：控制端下發(fā)讀串口命令，指定要讀取的長度、串口號。數(shù)據(jù)服務端先檢查指定的串口是否存在，如果存在且打開則執(zhí)行讀取操作，最終異步響應讀取結(jié)果。其中，實際讀取的數(shù)據(jù)長度小于等于指定的讀取長度，數(shù)據(jù)以Base64編碼的形式返回。

4 ? 系統(tǒng)功能驗證（System function verification）

本文使用被控設備向PC串口發(fā)送隨時間變化的正弦信號，Web控制端以20ms的間隔下發(fā)讀命令給數(shù)據(jù)服務端，服務端接收串口數(shù)據(jù)并上送給控制端，最終使用Echarts把數(shù)據(jù)以圖表的形式渲染出來，串口的參數(shù)以網(wǎng)頁URL的形式傳入。本文使用同一局域網(wǎng)內(nèi)的兩臺PC機進行測試，其中一臺運行數(shù)據(jù)服務器并與下位機用串口連接，下位機不斷向數(shù)據(jù)服務端發(fā)送正弦數(shù)值，另外一臺在瀏覽器中運行Web控制端網(wǎng)頁，獲取串口數(shù)據(jù)并顯示，工作流程如圖3所示。

圖4顯示了數(shù)據(jù)中轉(zhuǎn)服務器啟動后綁定了通用IP地址0.0.0.0，以及指定的端口8881，并打印出本地串口列表。圖5顯示了在同一網(wǎng)絡環(huán)境的另外一臺電腦上用瀏覽器直接打開本地網(wǎng)頁文件，即數(shù)據(jù)控制端，其啟動后嘗試連接數(shù)據(jù)服務器，并以9600的配置打開名稱為“COM6”的串口，最終將硬件數(shù)據(jù)實時渲染為可視化的圖形。

5 ? 結(jié)論（Conclusion）

本文使用支持跨平臺的RS232串口庫Serial Communication Library，以及網(wǎng)絡編程庫libevent，基于Websocket協(xié)議實現(xiàn)了網(wǎng)頁與串口之間的數(shù)據(jù)傳輸。然后利用了Web網(wǎng)頁的Websocket特性，以及Echarts網(wǎng)頁前端UI庫，實現(xiàn)了將串口波形數(shù)據(jù)渲染到網(wǎng)頁圖表上的WEB界面。最終驗證了該系統(tǒng)的有效性與可擴展性，為嵌入式上位機的實現(xiàn)提供了一種新的思路。

參考文獻（References）

[1] 張勝，李瑞民.物理隔斷計算機網(wǎng)絡間的實時通信設計[J].電視技術，2016，40（6）：127-130.

[2] 謝佳柏，陳賢祥，胡欣宇，等.基于低功耗藍牙和WebSocket的物聯(lián)網(wǎng)數(shù)據(jù)網(wǎng)關[J].儀表技術與傳感器，2016（1）：76-78.

[3] 章銳，陳樹勇，劉道偉，等.基于ECharts的電網(wǎng)Web可視化研究及應用[J].電測與儀表，2017，54（19）：59-66.

[4] 陳旭輝，楊紅云.基于STM32的多串口并行傳輸系統(tǒng)設計[J].計算機測量與控制，2019，27（1）：166-170.

[5] 錢宇虹.使用Websocket和Servlet實現(xiàn)服務器定點推送[J].軟件工程，2016，19（10）：30-33.

[6] 冀瀟，李楊.采用ECharts可視化技術實現(xiàn)的數(shù)據(jù)體系監(jiān)控系統(tǒng)[J].計算機系統(tǒng)應用，2017，26（6）：72-76.

作者簡介：

張宏橋（1989-），男，碩士，助理實驗師.研究領域：軟件開發(fā)，計算機控制.

蔣 ?虎（1998-），男，學士生.研究領域：軟件開發(fā)，嵌入式開發(fā).

曾曉華（1976-），女，碩士，高級實驗師.研究領域：系統(tǒng)仿真，嵌入式開發(fā).

段凌飛（1983-），男，碩士，講師.研究領域：嵌入式開發(fā)，計算機控制.