electron + node + node - serialport nodeJs 직렬 포트 에 데 이 터 를 보 내 고 사용자 정의 수신 자 표시 장치
46694 단어 nodeJs
머리말
electron + node + node - serialport 직렬 통신 + electron - builder 패키지 전체 프로 세 스 실현
이 글 은 electron 과 serialport 의 환경 구축, 포장 절 차 를 다 루 며 직렬 통신 을 실현 했다.
2. 객 현 설비 이해
필자 도 처음에 어 두 워 서 도대체 무엇 을 고객 에 게 보 냈 는 지 LED 에 거스름돈, 숫자 등 이 표시 되 었 다. 나 는 고객 에 게 명령 집합 을 찾 아 보 았 다.
위의 명령 은 참고 할 수 있 지만 저 는 이 대 를 모 르 겠 습 니 다. 그래서 저 는 2 개의 소프트웨어 를 다운 받 았 습 니 다. 하 나 는 객 현 인쇄 테스트 이 고 장치 에 데 이 터 를 보 내 는 데 사 용 됩 니 다. 이것 은 다른 사람 이 쓴 것 입 니 다. 두 번 째 는 차단, 직렬 포트 의 데 이 터 를 다운로드 하면 저 는 가방 을 잡 을 수 있 습 니 다. 도대체 무엇 을 보 냈 는 지, 하 나 는 인쇄 객 현 테스트 입 니 다.하 나 는 직렬 요정 입 니 다. 물론 자원 필 자 는 올 렸 습 니 다.
자원 주소
요약:
제 가 최종 적 으로 얻 은 것 은 hex 입 니 다. 바로 16 진법 입 니 다. 그 다음 에 일정한 명령 에 따라 개발 하려 면 상기 절차 에 따라 명령 을 캡 처 해 야 합 니 다.
참고:
화면 정리: 0C,
단가: ESCs 1, 총계: ESCs 2, 수금: ESCs 3 거스름돈: ESCs 4
숫자 접두사: 1B 5141
보 내 는 가격 은 16 진수 문 자 를 보 내 는 것 이지 만 기본 접두사 가 있 습 니 다.
ASCLL 코드 대조 표
3. 조작 시작
조작 은 매우 간단 하 다. 주로 serialport. write () 방법 을 사용한다.
그러나 주의해 야 할 것 은 글 을 쓸 때 hex 의 buffer 대상 으로 전환 해 야 한 다 는 것 이다. 그렇지 않 으 면 전송 한 데 이 터 는 16 진법 이 아니 라 ASCLL 코드 로 여 겨 질 것 이다. 직렬 포트 에서 감청 한 데 이 터 를 비교 해 볼 수 있다.
index.html
주요 절차, sendmessge 방법, node 에 보 내기 전에 보 낸 문자열 을 16 진수 문자열 로 변환 합 니 다.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
#mess{text-align: center}
</style>
</head>
<body>
<div id="mess"> ...</div>
<div id="socket">
</div>
<input type="text" id="inputMessage">
<button onclick="sendMessge()"> </button>
<div>
<button onclick="buttonChange(1)"> </button>
<button onclick="buttonChange(2)"> </button>
<button onclick="buttonChange(3)"> </button>
</div>
<script>
var arr = [
{type:1,name:" ",code:"1B7332"},
{type:2,name:' ',code:"1B7334"},
{type:3,name:' ',code:"0C"},
{type:4,name:' ',code:"1B5141"},
]
var mess = document.getElementById("mess");
var socket = document.getElementById("socket");
var inputElement = document.getElementById("inputMessage");
function buttonChange(type){
let code = ''
arr.map(item=>{
if(item.type==type){
code = item.code
}
})
ws.send(code)
}
function sendMessge(){
// ， 16 ，
var str=''
let c = inputElement.value
for(var i=0;i<c.length;i++){
str += c.charCodeAt(i).toString(16)
}
str = "1B5141" + str
console.log(str);
ws.send(str);
}
if(window.WebSocket){
var ws = new WebSocket('ws://127.0.0.1:27611');
ws.onopen = function(e){
console.log(" ");
ws.send("HeartBeat");
}
ws.onclose = function(e){
console.log(" ");
}
ws.onerror = function(){
console.log(" ");
}
ws.onmessage = function(e){
console.log(e.data);
socket.innerHTML =" "+ e.data
mess.innerHTML = " "
}
}
</script>
</body>
</html>
main.js
프론트 에 있 는 16 진수 문자열 을 받 아들 이 고 Buffer. from () 을 통 해 hex 의 buffer 대상 으로 변환 하여 직렬 로 보 냅 니 다.
const {
app,
BrowserWindow,
Menu,
MenuItem,
globalShortcut
} = require('electron')
const SerialPort = require('serialport');
const WebSocket = require('ws');
// Server :
const WebSocketServer = WebSocket.Server;
var portName = 'COM2'; //
var serialPort;
var strs = ''
var wss
var COMarr = []
function getPortArr() {
return new Promise((res, rej) => {
//
SerialPort.list().then((ports) => {
ports.forEach(function (port) {
COMarr.push(port.comName)
console.log(port.comName);
console.log(port.pnpId);
console.log(port.manufacturer);
res()
});
});
})
}
function startPort() {
if (serialPort) {
try {
serialPort.close();
} catch (err) {
}
}
serialPort = new SerialPort( //
portName, {
baudRate: 2400, //
dataBits: 8, //
parity: 'none', //
stopBits: 1, //
flowControl: false,
autoOpen: false //
}, false);
serialPort.on('error', (error) => {
console.log('Error: ', error.message);
})
serialPort.open(function (error) {
if (error) {
console.log(" " + portName + " ：" + error);
} else {
if (wss) {
wss.close()
}
// :
wss = new WebSocketServer({
port: 27611
});
wss.on('connection', function (ws) {
console.log(" ")
ws.on("message", function (message) {
if (message === "HeartBeat") {
ws.send(' ')
return
}
if(message){
console.log(' ' + message);
// 16 ， hex buffer
const c = Buffer.from(message,'hex')
serialPort.write(c)
}
})
ws.on("close", function () {
console.log(" ");
})
})
}
});
}
startPort()
// elctron node ，
// console.log("node:",process.versions.node)
// console.log("electron:",process.versions.electron)
// console.log("modules:",process.versions.modules)
/**
*
*
*
* **/
//
// .
// `remote`.
// const { BrowserWindow } = require('electron').remote
app.on('ready', () => {
let win = new BrowserWindow({
width: 1000,
height: 800,
title: " ",
webPreferences: {
nodeIntegration: true
}
})
//
win.loadFile('./index.html')
// URL
//win.loadURL('http://localhost:9528/#/login')
// window
// win.webContents
console.log(win.webContents, 1111);
// esc
globalShortcut.register('ESC', () => {
console.log('ESC');
win.setFullScreen(false);
})
console.log(globalShortcut.isRegistered('ESC'));
clearTimeout(this.timer)
this.timer = setTimeout(()=>{
win.setFullScreen(true);
},1000);
//
win.webContents.openDevTools();
getPortArr().then(() => {
//
let menu = new Menu();
//
let submenu = []
COMarr.map(item => {
submenu.push({
type: "normal",
label: item,
click() {
portName = item
strs = ''
startPort()
}
})
submenu.push({
type: "separator", //
}, )
})
let mil = new MenuItem({
type: "submenu",
label: ' ',
submenu: submenu
})
let mil2 = new MenuItem({
type: "submenu",
label: ' ',
submenu: [{
role: "forcereload",
label: " ",
},
{
type: "separator", //
},
{
role: "togglefullscreen",
label: " ",
},
{
type: "separator", //
},
{
role: "minimize",
label: " ",
},
{
type: "separator", //
},
{
label: ' ',
accelerator: (function() {
if (process.platform == 'darwin')
return 'Alt+Command+I';
else
return 'Ctrl+Shift+I';
})(),
click: function(item, focusedWindow) {
if (focusedWindow)
focusedWindow.toggleDevTools();
}
},
{
type: "separator", //
},
{
role: "quit",
label: " ",
},
]
})
//
menu.append(mil)
menu.append(mil2)
Menu.setApplicationMenu(menu)
})
})
주의사항, 연결 이 성공 하지 못 하면 포트 를 바 꾸 고 정확 한 포트 로 이동 한 다음 페이지 를 새로 고치 면 됩 니 다. 구체 적 으로 조작 하여 이전 글 을 보십시오.
electron + node + node - serialport 직렬 통신 + electron - builder 패키지 전체 프로 세 스 실현
좋은 웹페이지 즐겨찾기
