读取com口电子秤数据，并在网页中填充数据
Chrome 浏览器插件本身无法直接访问本地计算机的硬件资源（如串口 COM 口），因为出于安全性考虑，Chrome 插件运行在浏览器的沙盒环境中，没有权限直接与本地硬件交互。但是你可以通过一些方法间接实现你的需求，将串口数据写入网页输入框。
实现思路
通过本地程序与串口交互
使用一个本地应用（如 Python、Node.js）读取串口数据，并将数据通过 WebSocket 或 HTTP 与浏览器插件通信。Chrome 插件与网页交互
使用 Chrome 插件监听来自本地应用的数据流，并将这些数据自动填入网页的输入框中。
实现步骤
第一步：本地程序读取串口数据
用 Python 或 Node.js 实现一个小工具，负责读取串口数据并通过 WebSocket 或 HTTP 提供给 Chrome 插件。
示例：用 Python 读取串口数据并通过 WebSocket 发送
import serialimport asyncioimport websockets# 串口配置SERIAL_PORT = 'COM3' # 修改为实际串口号BAUD_RATE = 9600 # 根据电子秤配置修改WEBSOCKET_PORT = 8765async def send_serial_data():
# 打开串口
ser = serial.Serial(SERIAL_PORT, BAUD_RATE, timeout=1) print(f"串口 {SERIAL_PORT} 已连接，等待数据...") async with websockets.serve(websocket_handler, "localhost", WEBSOCKET_PORT): await asyncio.Future() # 挂起以保持服务运行async def websocket_handler(websocket, path):
while True: # 从串口读取数据
weight_data = ser.readline().decode('utf-8').strip() if weight_data: print(f"读取到称重数据: {weight_data}") # 将数据通过 WebSocket 发送
await websocket.send(weight_data)if __name__ == "__main__":
asyncio.run(send_serial_data())运行以上代码后，本地 WebSocket 服务器会监听 ws://localhost:8765，把串口数据实时发送给连接的客户端。
第二步：编写 Chrome 插件
Chrome 插件负责与网页交互，并通过 WebSocket 接收来自本地程序的串口数据。
插件结构
Chrome 插件需要以下文件和目录：
my-chrome-extension/│ ├── manifest.json # 插件的配置文件├── background.js # 后台脚本，用于连接 WebSocket├── content.js # 内容脚本，用于操作网页 DOM└── inject.js # 注入脚本，自动填充输入框
1. manifest.json 文件
{ "manifest_version": 3, "name": "Serial to Input", "version": "1.0", "permissions": ["scripting", "activeTab"], "background": { "service_worker": "background.js"
}, "host_permissions": ["<all_urls>"], "action": { "default_popup": "popup.html", "default_icon": { "16": "icon.png", "48": "icon.png", "128": "icon.png"
}
}
}2. background.js 文件
负责连接本地 WebSocket 服务器并转发数据给内容脚本。
let websocket;
chrome.runtime.onInstalled.addListener(() => { console.log("插件已安装"); // 连接本地 WebSocket 服务器
websocket = new WebSocket("ws://localhost:8765");
websocket.onopen = () => { console.log("已连接到 WebSocket 服务器");
};
websocket.onmessage = (event) => { const weight = event.data; console.log(`接收到称重数据: ${weight}`); // 将数据发送到当前活动页面的内容脚本
chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => { if (tabs.length > 0) {
chrome.tabs.sendMessage(tabs[0].id, { weight });
}
});
};
websocket.onclose = () => { console.log("WebSocket 连接已关闭");
};
websocket.onerror = (error) => { console.error("WebSocket 错误:", error);
};
});3. content.js 文件
负责接收后台脚本的数据并操作网页 DOM。
chrome.runtime.onMessage.addListener((message, sender, sendResponse) => { const { weight } = message; // 自动填入网页的第一个输入框
const inputField = document.querySelector("input"); if (inputField) {
inputField.value = weight; console.log(`输入框已填入数据: ${weight}`);
} else { console.log("未找到输入框");
}
sendResponse({ status: "success" });
});4. inject.js 文件
如果目标网页是动态加载的，可能需要主动监控 DOM 的变化并寻找输入框。这部分代码可选。
第三步：安装并测试插件
打开 Chrome，进入
chrome://extensions/。点击右上角“开发者模式”，然后点击“加载已解压的扩展程序”。
选择包含
manifest.json文件的插件目录。启用插件。
第四步：测试完整流程
运行本地 Python 脚本，确保 WebSocket 服务器在运行。
打开目标网页，并确保页面上有输入框。
插件会自动填充从串口读取的称重数据到输入框中。
可行性总结
通过以上方法，Chrome 插件可以间接实现串口到网页输入框的自动填充，具体流程是：
本地程序读取串口数据并通过 WebSocket 提供数据。
Chrome 插件通过内容脚本操作网页 DOM，将接收到的数据填入输入框。
要将 Python 代码打包成一个可以在客户电脑上安装并运行的独立程序（无需客户安装 Python 环境），可以使用打包工具如 PyInstaller 或 cx_Freeze。这些工具可以将 Python 脚本打包为可执行文件（如 .exe）。以下是具体步骤：
使用 PyInstaller 打包 Python 程序
1. 安装 PyInstaller
在开发环境中，使用 pip 安装 PyInstaller：
pip install pyinstaller
2. 准备 Python 脚本
确保你的脚本（如 serial_to_websocket.py）可以正常运行，并且所有依赖库都已安装（如 pyserial 和 websockets）。
示例脚本文件名：serial_to_websocket.py
3. 使用 PyInstaller 打包
运行以下命令，将 Python 脚本打包成独立的可执行文件：
pyinstaller --onefile --noconsole serial_to_websocket.py
参数说明：
--onefile：将所有依赖和代码打包成一个独立的可执行文件。--noconsole：隐藏终端窗口（适用于 GUI 程序）。对于你的程序，建议不要加这个参数，因为需要显示日志信息。
运行成功后，PyInstaller 会生成一个可执行文件，位于 dist/serial_to_websocket.exe。
4. 分发可执行文件
将生成的 serial_to_websocket.exe 文件分发给客户，客户无需安装 Python 环境即可运行。
优化：为程序添加配置或安装参数
如果你的程序需要配置（例如串口号或波特率可能不同），可以通过以下方法优化用户体验：
1. 在脚本中添加命令行参数
使用 Python 的 argparse 模块，允许客户在运行时指定参数：
import argparseimport serialimport asyncioimport websockets# 解析命令行参数parser = argparse.ArgumentParser(description="串口到 WebSocket 转发工具")
parser.add_argument("--port", type=str, default="COM3", help="串口号 (默认: COM3)")
parser.add_argument("--baudrate", type=int, default=9600, help="串口波特率 (默认: 9600)")
parser.add_argument("--ws_port", type=int, default=8765, help="WebSocket 端口 (默认: 8765)")
args = parser.parse_args()async def send_serial_data():
# 打开串口
ser = serial.Serial(args.port, args.baudrate, timeout=1) print(f"串口 {args.port} 已连接，等待数据...") async with websockets.serve(websocket_handler, "localhost", args.ws_port): await asyncio.Future() # 挂起以保持服务运行async def websocket_handler(websocket, path):
while True:
weight_data = ser.readline().decode("utf-8").strip() if weight_data: print(f"读取到称重数据: {weight_data}") await websocket.send(weight_data)if __name__ == "__main__":
asyncio.run(send_serial_data())运行方式：
客户可以通过命令行运行程序并传递参数，例如：
serial_to_websocket.exe --port COM4 --baudrate 115200 --ws_port 9000
2. 提供默认配置文件
如果客户不希望每次都输入参数，可以将默认配置写入一个文件（如 config.json），程序启动时自动读取配置：
示例配置文件：config.json
{ "port": "COM3", "baudrate": 9600, "ws_port": 8765}修改程序代码以读取配置文件：
import jsonimport os# 读取配置文件config_file = "config.json"if os.path.exists(config_file): with open(config_file, "r") as file:
config = json.load(file)else:
config = {"port": "COM3", "baudrate": 9600, "ws_port": 8765}# 使用配置serial_port = config["port"]
baud_rate = config["baudrate"]
websocket_port = config["ws_port"]3. 创建安装程序
为了让客户更方便地安装程序，可以使用工具如 Inno Setup 创建一个安装包：
使用 Inno Setup 制作安装包
下载并安装 Inno Setup。
创建一个简单的
.iss脚本，将你的.exe和相关配置文件打包到安装包中。
示例 Inno Setup 脚本：
[Setup]
AppName=串口转WebSocket工具
AppVersion=1.0
DefaultDirName={pf}\SerialToWebSocket
DefaultGroupName=SerialToWebSocket
OutputBaseFilename=SerialToWebSocketInstaller
Compression=lzma
SolidCompression=yes
[Files]
Source: "dist\serial_to_websocket.exe"; DestDir: "{app}"; Flags: ignoreversion
Source: "config.json"; DestDir: "{app}"; Flags: ignoreversion
[Icons]
Name: "{group}\串口转WebSocket工具"; Filename: "{app}\serial_to_websocket.exe"运行 Inno Setup 会生成一个安装包（如 SerialToWebSocketInstaller.exe），客户双击运行即可安装程序。
最终交付方式
可执行文件方式
直接打包为
.exe文件，客户解压后运行。配置文件（如
config.json）可放在同目录。安装包方式
提供一个安装包（如
SerialToWebSocketInstaller.exe），客户安装后在桌面或开始菜单找到快捷方式即可运行。
常见问题与解决方案
串口权限问题
如果客户电脑的串口被占用或权限不足，程序可能会报错。确保客户有管理员权限，并正确配置串口。防火墙拦截 WebSocket
如果客户电脑的防火墙阻止 WebSocket 通信，请指导客户将程序添加到防火墙的信任列表。兼容性问题
在 Windows 不同版本上测试生成的.exe文件。如果需要兼容旧版 Windows，可以在打包时指定兼容的 Python 环境。
