网络蓝牙和Chrome扩展:用户取消了requestDevice()选择器

Question

在尝试从Google扩展弹出打开网络蓝牙设备选择器对话框时，我得到了以下错误：DOMException: User cancelled the requestDevice() chooser.

我使用TypeScript和带ES2020目标、模块和库的浏览器化。下面是从我的popup.html运行的代码

document.getElementById("test-button")?.addEventListener("click", async () => {
    await navigator.bluetooth
        .requestDevice({ acceptAllDevices: true })
        .then((device) => {
            alert(device.name);
        })
        .catch((error) => {
            console.error(error); // <- Getting the error here!
        });
});

我假设有一些Chrome扩展魔术，使网络-蓝牙以为我点击了对话框，但不知道如何绕过这一点。有什么想法吗？

Answer 1

正如在https://bugs.chromium.org/p/chromium/issues/detail?id=994185中所讨论的，在Chrome扩展弹出窗口中，Web蓝牙是不支持的。

然而，Chrome扩展“选项卡/选项”页面支持它，因为它是一个常规选项卡。

--我还没有尝试复制这一点，但我相信问题是，Web蓝牙没有处理创建权限提示的代码，因为它是扩展弹出窗口的子窗口。它适用于选项页，因为它是一个普通的Chrome选项卡，也适用于一个独立的应用程序窗口。

我的建议是打开一个Chrome扩展规则页面，其中包含一些代码来与附近的蓝牙设备交互。

// popup.js

button.addEventListener("click", function() {
  // Open a page that contains Javascript to handle Bluetooth devices.
  chrome.tabs.create({ url: "page.html" });
});