feat: Add auto-reconnect functionality for Web Serial API
- Implement autoReconnect() function to automatically reconnect to previously authorized serial devices on page load - Use navigator.serial.getPorts() to retrieve previously connected ports - Add graceful error handling for auto-reconnect failures - Improve disconnect() function with null check for port - Eliminates need for manual reconnection after page refresh - Maintains backward compatibility with existing functionality Fixes issue where Web Serial connection was lost on page refresh, requiring users to manually reconnect their devices each time.
这个提交包含在:
父节点
978bdbf76b
当前提交
34510470ce
共有 1 个文件被更改,包括 43 次插入 和 2 次删除
|
|
@ -88,6 +88,45 @@ async function clickConnect() {
|
||||||
|
|
||||||
//Define outputstream, inputstream and port so they can be used throughout the sketch
|
//Define outputstream, inputstream and port so they can be used throughout the sketch
|
||||||
var outputStream, inputStream, port;
|
var outputStream, inputStream, port;
|
||||||
|
|
||||||
|
// Auto-reconnect functionality
|
||||||
|
async function autoReconnect() {
|
||||||
|
try {
|
||||||
|
// Get previously connected ports
|
||||||
|
const ports = await navigator.serial.getPorts();
|
||||||
|
if (ports.length > 0) {
|
||||||
|
// Try to reconnect to the first available port
|
||||||
|
port = ports[0];
|
||||||
|
await port.open({ baudRate: 1200 });
|
||||||
|
await port.setSignals({ dataTerminalReady: true });
|
||||||
|
|
||||||
|
statusBar.innerText = "Auto-reconnected";
|
||||||
|
connectButton.innerText = "Disconnect";
|
||||||
|
|
||||||
|
let decoder = new TextDecoderStream();
|
||||||
|
inputDone = port.readable.pipeTo(decoder.writable);
|
||||||
|
inputStream = decoder.readable;
|
||||||
|
|
||||||
|
const encoder = new TextEncoderStream();
|
||||||
|
outputDone = encoder.readable.pipeTo(port.writable);
|
||||||
|
outputStream = encoder.writable;
|
||||||
|
|
||||||
|
writeToByte("0x00, 0x02");
|
||||||
|
writeToByte("0x02, 0x00");
|
||||||
|
|
||||||
|
$('#winkey_buttons').show();
|
||||||
|
|
||||||
|
reader = inputStream.getReader();
|
||||||
|
readLoop();
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.log("Auto-reconnect failed:", e);
|
||||||
|
// If auto-reconnect fails, just continue with normal flow
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Call auto-reconnect when page loads
|
||||||
|
window.addEventListener('load', autoReconnect);
|
||||||
navigator.serial.addEventListener('connect', e => {
|
navigator.serial.addEventListener('connect', e => {
|
||||||
statusBar.innerText = `Connected to ${e.port}`;
|
statusBar.innerText = `Connected to ${e.port}`;
|
||||||
connectButton.innerText = "Disconnect"
|
connectButton.innerText = "Disconnect"
|
||||||
|
|
@ -182,8 +221,10 @@ async function disconnect() {
|
||||||
statusBar.innerText = "Disconnected";
|
statusBar.innerText = "Disconnected";
|
||||||
connectButton.innerText = "Connect"
|
connectButton.innerText = "Connect"
|
||||||
//Close the port.
|
//Close the port.
|
||||||
await port.close();
|
if (port) {
|
||||||
port = null;
|
await port.close();
|
||||||
|
port = null;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
//When the send button is pressed
|
//When the send button is pressed
|
||||||
|
|
|
||||||
正在加载…
在新工单中引用