達到的目的：
在H5頁面直接使用JS調用websocket客戶端，客戶端找到本地搭建的服務端，服務端中使用vue serialport進行串口通訊，回傳信息到H5面。（囉嗦的描述：H5頁面創建一個nodejs-websocket 客戶端，然後搭建nodejs-websocket 以js服務端（使用forever啓動），服務端裏面使用serialport 來打開本地串口進行通訊。通訊收到串口返回信息後傳給socket服務端，服務端在傳遞給nodejs-websocket客戶端。描述比較長...）
以下爲步驟：先啓動第2步，在啓動第1步。
第一步.H5頁面，websocket客戶端
var ws1 = new WebSocket('ws://localhost:5001');
ws1.onopen = function () {
oUl.innerHTML += "<li>人臉設備客戶端已連接</li>";
}
ws1.onmessage = function (evt) {
//該evt爲回傳數據，使用evt.data獲取;
//收到消息在去調用您頁面上的具體業務邏輯如收到串口返回的消息就去調用支付方法，長連接。如果串口不回消息就一直等待。直到獲取到信息。該處很關鍵。省去在用js方法輪詢接口有沒有返回數據。
oUl.innerHTML += "<li>" + evt.data + "</li>";
}
ws1.onclose = function () {
oUl.innerHTML += "<li>人臉設備客戶端已斷開連接</li>";
};
ws1.onerror = function (evt) {
oUl.innerHTML += "<li>" + evt.data + "</li>";
};
第二步.本地搭建的websocket服務端，直接貼代碼（完整代碼），該文件可以直接啓動，本地安裝nodejs，forever。啓動方式：進入該文件目錄，執行forever socketServer.js 您本機COM3串口必須有，連接成功後會提示:IsOpen:true
let facestr="";
let value;
var wsface=require('nodejs-websocket');
var SerialPort = require('serialport')
var serialPort = new SerialPort("COM3", {
baudRate: 9600,
dataBits: 8,
parity: 'none',
stopBits: 1,
flowControl: false,
autoOpen:false
}, false);
serialPort.open(function (err) {
console.log('IsOpen:',serialPort.isOpen)
})
serialPort.on('error',function (error) {
console.log('error: '+error)
facestr=error;
})
var server = wsface.createServer(function (conn, res) {
conn.on("text",function(str1){
facestr="";
const str11 = new Buffer("11","hex").toString('utf8');
serialPort.write(str11, function (error, result) { })
// conn.sendText(facestr);
});
conn.on("close",function(code,reason){
console.log('connection closed');
facestr="close";
})
//處理錯誤事件信息
conn.on('error',function(err){
console.log('throw err',err);
facestr=err;
})
}).listen(5001);
serialPort.on('data', function (data) {
facestr= new Buffer(data, 'hex').toString('utf8');
console.log("facestr conn="+facestr);
server.connections.forEach(function (conn) {
conn.sendText(facestr); facestr="";
})
});
以上是在開發中遇到的通過H5頁面直接調用串口進行通訊的實例。