Skip to content

Commit e0e65a3

Browse files
docs: add Permission Policy documentation for MCP Apps (#7325)
1 parent cd1e995 commit e0e65a3

1 file changed

Lines changed: 65 additions & 2 deletions

File tree

documentation/docs/tutorials/building-mcp-apps.md

Lines changed: 65 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -583,11 +583,74 @@ csp: {
583583

584584
</details>
585585

586-
See the [MCP Apps Specification](https://github.com/modelcontextprotocol/ext-apps) for details on security and the full protocol.
587-
588586
:::warning Security Consideration
589587
Only add domains you trust. Each domain you add expands what external content can be loaded or embedded in your app. Keep the list minimal and specific to reduce security risks.
590588
:::
591589

590+
### Requesting Browser Permissions
591+
592+
MCP Apps can request specific browser permissions using Permission Policy. This is useful for apps that need access to device capabilities like camera, microphone, or location services. These are requests only - the host may not grant them, and apps should use feature detection to handle cases where permissions are unavailable.
593+
594+
To declare permissions for your MCP App, include the `permissions` object in the resource's `_meta.ui` section:
595+
596+
```javascript
597+
_meta: {
598+
ui: {
599+
permissions: {
600+
camera: true, // Request camera access
601+
microphone: true, // Request microphone access
602+
geolocation: true, // Request geolocation access
603+
clipboardWrite: true, // Request clipboard write access
604+
},
605+
},
606+
}
607+
```
608+
609+
| Permission | Permission Policy Feature | Use Case |
610+
|------------|---------------------------|----------|
611+
| `camera` | `camera` | Video capture, QR code scanning |
612+
| `microphone` | `microphone` | Audio recording, voice input |
613+
| `geolocation` | `geolocation` | Location-aware apps, maps |
614+
| `clipboardWrite` | `clipboard-write` | Copy to clipboard functionality |
615+
616+
All permissions default to `false`. Only request the permissions your app actually needs.
617+
618+
<details>
619+
<summary>Example: Video recording app</summary>
620+
621+
```javascript
622+
server.setRequestHandler(ReadResourceRequestSchema, async (request) => {
623+
const { uri } = request.params;
624+
625+
if (uri === "ui://my-video-app/recorder") {
626+
return {
627+
contents: [
628+
{
629+
uri: "ui://my-video-app/recorder",
630+
mimeType: "text/html;profile=mcp-app",
631+
text: VIDEO_RECORDER_HTML,
632+
_meta: {
633+
ui: {
634+
permissions: {
635+
camera: true,
636+
microphone: true,
637+
},
638+
},
639+
},
640+
},
641+
],
642+
};
643+
}
644+
});
645+
```
646+
647+
</details>
648+
649+
:::info User Consent Required
650+
Even when an MCP App requests permissions, the browser will still prompt the user for consent before granting access. Users can deny permission requests at any time.
651+
:::
652+
653+
See the [MCP Apps Specification](https://github.com/modelcontextprotocol/ext-apps) for details on security and the full protocol.
654+
592655
593656

0 commit comments

Comments
 (0)