tauri: getDisplayMedia() has permission issue

Describe the bug

Hi I try to call getDisplayMedia() but got permission issue, see details below, thanks!

To Reproduce

Steps to reproduce the behavior:

  1. Check out the sample code from here
  2. cd to src-tauri/my-app run yarn && yarn start, this start the react dev server
  3. in root folder run yarn tauri dev
  4. After the application starts, click the “test” button, this will trigger the getDisplayMedia() api. Click the “Inspect Element”, you will see the error in console “Unhandled Promise Rejection: NotAllowedError: The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.”

Expected behavior

It should call the getDisplayMedia() successfully without error.

Screenshots

image

Platform and Versions (required):

Operating System - Mac OS, version 11.5.2 X64

Node.js environment
  Node.js - 14.17.2
  @tauri-apps/cli - 1.0.0-beta.10
  @tauri-apps/api - 1.0.0-beta.8

Global packages
  npm - 6.14.13
  yarn - 1.22.4

Rust environment
  rustc - 1.55.0
  cargo - 1.55.0

App directory structure
/node_modules
/src-tauri
/.idea

App
  tauri.rs - 1.0.0-beta.8
  build-type - bundle
  CSP - default-src blob: data: filesystem: ws: wss: http: https: tauri: 'unsafe-eval' 'unsafe-inline' 'self' img-src: 'self'
  distDir - my-app/build
  devPath - http://localhost:3000


Additional context

I already add the Info.plist under src-tauri with the following configuration

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
	<key>NSCameraUsageDescription</key>
	<string>Request camera access for WebRTC</string>
	<key>NSMicrophoneUsageDescription</key>
	<string>Request microphone access for WebRTC</string>
</dict>
</plist>

The getUserMedia() works properly, but getDisplayMedia() didn’t. I try to run the same react app inside safari and the getDisplayMedia() works properly in it.

Stack Trace

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Reactions: 4
  • Comments: 53 (10 by maintainers)

Most upvoted comments

I’ve been hitting the same problem and think I’ve narrowed it down to the flags supplied to the webview in Wry…

Using webkit2gtk-4.0 (running on Ubuntu), if I start a WebView pointing at the same application as I’m firing up in Tauri Media Stream and Web RTC are defaulted to off. If I start a WebView with --enable-media-stream=true and --enable-webrtc=true the view correctly prompts for permissions when navigator.mediaDevices.getUserMedia({ audio: true, video: true }) is called and can then call navigator.mediaDevices.enumerateDevices().

Looking at the args supplied to the webview these flags aren’t being supplied and so I’m assuming it’s defaulting to webkit2gtk’s defaults of off (though this is based on a cursory inspection of the code and some extrapolation based on what I’ve observed).

I also couldn’t find a way to supply additional args to enable these on the target platform that exists for Windows.

This is a mandatory feature of our application as we need webrtc screen sharing and the only problem we have as to port it to Tauri/rust from electron is the luck of capturing the video stream of the screen.

Yeah, right. We’re in the same boat.

Any good soul out there with the knowledge to port electron’s implementation of getUserMedia or getDisplayMedia to WKWebView or can recommend any other solutions for Tauri/rust? Any recommendations would be very much appreciated.

I think the only “viable” (not really unfortunately) option would be using webrtc-rs, but the client stack for the WebRTC has not yet been implemented and is part of a roadmap. There is an open issue to create an example to use it with Tauri.

I think basically you’re left with 2 options here:

  1. Rely upon Electron (probably not a desirable option if you’re choosing Tauri for the same reason we do).
  2. Implement some sort of a Tauri Plugin that would bring the desired support of the WebRTC Screen Capturing. This might take a decent amount of time before it matches the feature-set of Electron’s desktopCapturer though (Disclaimer: I don’t have much experience with Tauri plugins, so perhaps this whole idea is also far away from being optimal).

@cliqer I think the latest tauri v1 doesn’t have the latest wry package, it was only released in wry v0.35.1, What I have done in my release pipeline is use my own “local” version of tauri with a changed Cargo.toml for wry runtime pointing to 0.35.1

Small update on this.

I can confirm that the permissions prompt is being issued on MacOS v13 but not on v14, which is still unreleased although in rc. I’ll update again once the OS is official.

[✔] Environment
    - OS: Mac OS 14.0.0 X64
    ✔ Xcode Command Line Tools: installed
    ✔ rustc: 1.71.1 (eb26296b5 2023-08-03)
    ✔ Cargo: 1.71.1 (7f1d04c00 2023-07-29)
    ✔ rustup: 1.26.0 (2023-04-05)
    ✔ Rust toolchain: stable-aarch64-apple-darwin (default)
    - node: 20.5.0
    - pnpm: 8.5.0
    - yarn: 1.22.19
    - npm: 9.8.0

[-] Packages
    - tauri [RUST]: 2.0.0-alpha.14
    - tauri-build [RUST]: 2.0.0-alpha.8
    - wry [RUST]: 0.33.0
    - tao [RUST]: 0.22.2
    - @tauri-apps/api [NPM]: 1.4.0
    - @tauri-apps/cli [NPM]: 2.0.0-alpha.14

[-] App
    - build-type: bundle
    - CSP: unset
    - distDir: ../dist
    - devPath: http://localhost:1420/
    - framework: Svelte
    - bundler: Vite

@application-developer-DA you are totally right.

WKWebView does not support getDisplayMedia and currently, there is no way to share a screen on MacOS.

There are a few solutions that could be a workaround but need implementation:

This is a mandatory feature of our application as we need webrtc screen sharing and the only problem we have as to port it to Tauri/rust from electron is the luck of capturing the video stream of the screen.

Any good soul out there with the knowledge to port electron’s implementation of getUserMedia or getDisplayMedia to WKWebView or can recommend any other solutions for Tauri/rust?

Any recommendations would be very much appreciated.

Cool, thanks for confirming. Backporting it to wry 0.24 (the version tauri v1 uses) should be fairly straightforward.

Was able to identify and fix the issue here https://github.com/tauri-apps/wry/pull/1107, thanks to @pewsheen recognising where the bug resided!

Upgraded to Sonoma v14 and previous implementation doesn’t work anymore. I assume this has to do with Safari 17 changes in WebRTC.

Just fired up a totally fresh Tauri app, requested

navigator.mediaDevices.getDisplayMedia({
            audio: false,
            video: true
})

And got hit with the same permission denied error without a dialogue. Now wondering if this is a Sonoma related issue. (on 14.0 Beta (23A5337a))