![](/img/trans.png)
[英]WebUSB: How to call navigator.usb.requestDevice() if navigator.usb.getDevices() fails
[英]Is there a way to get Chrome to “forget” a device to test navigator.usb.requestDevice, navigator.serial.requestPort?
我希望从使用WebUSB迁移到SerialAPI (这里很好地解释了)。
当前代码:
try {
let device = await navigator.usb.requestDevice({
filters: [{
usbVendorId: RECEIVER_VENDOR_ID
}]
})
this.connect(device)
} catch (error) {
console.log(DEVICE_NAME + ': Permission Denied')
}
新代码:
try {
let device = await navigator.serial.requestPort({
filters: [{
usbVendorId: RECEIVER_VENDOR_ID
}]
})
this.connect(device)
} catch (error) {
console.log(DEVICE_NAME + ': Permission Denied')
}
新代码似乎可以工作,但我认为这是因为浏览器已经通过旧代码请求了设备。
我尝试重新启动 Chrome 并清除所有浏览历史记录。 甚至关闭了 USB 声明页面并使用另一个应用程序声明了该设备(在此期间它返回DOMException: Unable to claim interface
错误),但 Chrome 似乎不想再次询问。 它只是愉快地使用先前的连接流式传输数据。
我希望使用 SerialAPI 可以避免与其他进程争夺 USB,或者至少输给它们。
我忘记了:
Failed to execute 'requestPort' on 'Serial': "Must be handling a user gesture to show a permission request"
这是否意味着用户需要使用按钮通过 SerialUSB 连接到设备? 我认为使用 WebUSB 我能够使连接 window 自动弹出。
对于这两个 API,如更新中所述,需要用户手势才能调用requestDevice()
或requestPort()
方法。 无法自动弹出此提示。 (如果存在错误,请告知 Chrome 团队,以便我们修复它。)
通过 WebUSB API 和 Web 序列号 API 授予站点的权限当前单独跟踪,因此通过一个设备访问设备的权限不会自动转换为另一个。
目前没有办法以编程方式忘记设备权限。 这将需要已被放弃的navigator.permissions.revoke()方法。 但是,您可以通过在访问站点时单击地址栏中的“锁定”图标或转到 chrome://settings/content/usbDevices(对于 USB 设备)和 chrome://settings/ 手动撤销访问设备的权限content/serialPorts(用于串行端口)。
新代码不起作用。 这似乎是因为 Chrome已经通过旧代码与端口配对。 “新代码”不可能起作用,因为正如 Kalido 的评论中所指出的,SerialAPI(由于其强大的功能)需要用户手势来连接。
我用来实际连接和获取数据的代码基本上是由 OP 中上述链接的几部分组成的:
navigator.serial.addEventListener('connect', e => {
// Add |e.target| to the UI or automatically connect.
console.log("connected");
});
navigator.serial.addEventListener('disconnect', e => {
// Remove |e.target| from the UI. If the device was open the disconnection can
// also be observed as a stream error.
console.log("disconnected");
});
console.log(navigator.serial);
document.addEventListener('DOMContentLoaded', async () => {
const connectButton = document.querySelector('#connect') as HTMLInputElement;
if (connectButton) {
connectButton.addEventListener('click', async () => {
try {
// Request Keiser Receiver from the user.
const port = await navigator.serial.requestPort({
filters: [{ usbVendorId: 0x2341, usbProductId: not_required }]
});
try {
// Open and begin reading.
await port.open({ baudRate: 115200 });
} catch (e) {
console.log(e);
}
while (port.readable) {
const reader = port.readable.getReader();
try {
while (true) {
const { value, done } = await reader.read();
if (done) {
// Allow the serial port to be closed later.
reader.releaseLock();
break;
}
if (value) {
console.log(value);
}
}
} catch (error) {
// TODO: Handle non-fatal read error.
console.log(error);
}
}
} catch (e) {
console.log("Permission to access a device was denied implicitly or explicitly by the user.");
console.log(e);
console.log(port);
}
}
}
设备特定的供应商和产品 ID 显然会因设备而异。 在上面的示例中,我插入了一个 Arduino 供应商 ID。
它没有回答如何让 Chrome “忘记”的问题,但由于需要手势,我不确定在使用 SerialAPI 时这是否相关。
希望有更多经验的人能够发布更多信息的答案。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.