如何通过js调用工控机(Windows)虚拟键盘

1. 需求背景

在工控机触摸屏中,通过浏览器web端进行表单输入,当聚焦表单输入框并不会出现虚拟键盘进行输入。

解决方式:

  1. 使用第三方npm虚拟键盘插件引入使用
  2. 使用js调用系统自带的虚拟键盘
  3. 使用快捷键Win+Ctrl+O打开关闭

本文介绍下第二种方式进行操作。

2. 实现方式

在网页中通过js调用Windows上本地的exe程序,通过修改 Windows 注册表来使用 window.open 打开键盘,实际上是在设置一个自定义的 URL 协议(如 "keyboardProtocol")与键盘应用程序(通常是系统自带的屏幕键盘)相关联。当用户在网页中点击一个链接或使用 JavaScript 打开一个 "keyboardProtocol" URL 时,这将触发屏幕键盘的打开。

  1. 找出虚拟键盘的可执行文件路径,如:C:\Windows\system32\osk.exe
  2. 编写注册文件reg文件
js 复制代码
Windows Registry Editor Version 5.00

[HKEY_CLASSES_ROOT\keyboard] // 定义自定义 URL 协议的关键部分
@="keyboardProtocol"  // 自定义的 URL 协议名称
"URL Protocol"="keyboardProtocol" // 确保了系统知道这是一个自定义协议

[HKEY_CLASSES_ROOT\keyboard\DefaultIcon] // 定义了当用户在资源管理器或文件浏览器中双击与 "keyboardProtocol" 相关联的文件时显示的图标
@="C:\\windows\\system32\\osk.exe" // 屏幕键盘应用程序的路径

[HKEY_CLASSES_ROOT\keyboard\shell]  // 定义了如何与该协议交互

[HKEY_CLASSES_ROOT\keyboard\shell\open] // 定义了当用户右键点击与 "keyboardProtocol" 相关联的文件或文件夹并选择"打开"时发生的行为

[HKEY_CLASSES_ROOT\keyboard\shell\open\command] // 定义了如何执行与 "open" 操作相关联的操作
@="\"C:\\windows\\system32\\osk.exe\""
  1. 双击执行
  2. js中调用
js 复制代码
// 方法一
 window.location.href="keyboard://";
//or
window.open("keyboard://");

</script>
<!-- 方法二-->
<a href="keyboard://">打开应用程序</a>

3. 总结

该方法依赖于Windows系统自带的虚拟键盘,不适用于其他操作系统。

提供了一种通过JavaScript调用Windows系统自带的虚拟键盘的方法,解决在工控机触摸屏的web浏览器中进行表单输入时调用虚拟键盘的问题。

相关推荐
子兮曰4 天前
jev-ultrafast 深度解析:7 秒订机票的浏览器 Agent 是如何炼成的
前端·后端·agent
子兮曰4 天前
Jev 爆发一周:7 秒 Agent 背后的 System One 生态与三场争议
前端·后端·ai编程
前端小万4 天前
写公众号赚了 3000 块后,我做了一款叫 "一键成稿" 的软件
前端·微信小程序
爱勇宝4 天前
ZCode 开源 24 小时:一份没有历史的账本,回答不了"有没有偷代码"
前端·后端·chatglm (智谱)
三十而立洋4 天前
Cookie 详解:从产生到安全,一次讲透
前端·javascript
卡布鲁5 天前
把一个 Vite + Vue3 应用塞进 qiankun (React + Umi3) 主站:十个坑的复盘
前端·javascript·react.js
汉堡大王95275 天前
Jev:不是聊天机器人, 而是一个智能 if 语句
前端·人工智能·后端
梦想很大很大5 天前
从运行事实到回归证据:Workrun 的 Telemetry 与 Evaluation 实践
前端·人工智能·后端
计算机魔术师5 天前
Meta Muse agent 接入 Shopify 的 Shop Pay 实现代理式购物
前端
沙蒿同学5 天前
我用 Go 搭了一条 AI Agent 流水线:从 1 张商品图到一整套淘宝详情页
前端·javascript·后端