简体   繁体   中英

Enable webUSB across cross-origin iframes without sharing permissions

I'm trying to work with webUSB on a page that contains sandboxed iframes from different origins. My goal is that the top level page and each of the embedded contexts can all use webUSB, but don't share permissions. Instead they should each have to call requestDevice to get access to usb devices

By default, it seems that the top-level page's permissions/webUSB devices are shared by the iframes. Here's my testing setup. Top level page:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Top</title>
</head>
<body>
    <button id="button">request</button>
    
    <!-- iframe running on a different domain. See code below -->
    <iframe sandbox="allow-scripts" allow="usb" src="https://.../sub-frame.html"></iframe>

    <script>
        const button = document.getElementById('button');
        button.addEventListener('click', async () => {
            const device = await navigator.usb.requestDevice({ filters: [] });
            console.log(device);
        });
    </script>
</body>
</html>

Subframe (from a different origin):

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Embedded</title>
</head>
<body>
    <button id="button">Log</button>
    <script>
        const button = document.getElementById('button');
        button.addEventListener('click', async () => {
            const devices = await navigator.usb.getDevices();
            console.log(devices);
        });
    </script>
</body>
</html>

Testing this example in Chrome, when the top level page call's requestDevice and I go through the permissions flow, the iframe can now also access the device by calling navigator.usb.getDevices() . I want to block that. Instead the iframe should have to call requestDevice and then get its own list of usb devices.

If I instead use allow="usb 'self'" , the the embedded page no longer has across to the webUSB api at all. I've looked through the webUSB and permissions specs but couldn't find any way to accomplish this.

How can I have a feature like webUSB enabled across embedded context, but in a way where each of the embedded contexts is isolated like it would be if it were another top-level document?

This behavior is caused by a Chromium feature that has been implemented for various permission-gated APIs over the past few years called " permission delegation ."

I don't know if the Chromium project would consider re-enabling separate storage of USB device permissions in embedded frames but it possible the API could be enhanced to enable more granular delegation of permissions for particular devices rather than all devices granted to the parent page.

Please file a feature request for this on https://crbug.com/new .

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM