[bug] Loading a video/audio as an asset does not work

[firstdorsal]

Describe the bug

Loading a video as an asset does not work.

I followed the guide here: https://tauri.studio/docs/api/js/modules/tauri

It works fine with image files (png/jpg etc.) but not with videos.
I tried loading the video https://www.w3schools.com/html/mov_bbb.mp4 directly from the URL, and this worked without problems.
But using the asset:///home/paul/Downloads/mov_bbb.mp4 URL this does not work
Loading images from the same folder does work.

In the network panel you can see that the request failed but no further reason is specified

The loading of assets this way is IMO not very good explained and when it fails, for some reason, it is very difficult to find out why.

Thank you for creating Tauri, it is awesome!

Reproduction

No response

Expected behavior

No response

Platform and versions

Operating System - Arch Linux, version Rolling Release X64

Node.js environment
  Node.js - 17.7.1
  @tauri-apps/cli - 1.0.0-rc.6
  @tauri-apps/api - 1.0.0-rc.2

Global packages
  npm - 8.5.4
  pnpm - Not installed
  yarn - 1.22.17

Rust environment
  rustup - 1.24.3
  rustc - 1.59.0
  cargo - 1.59.0
  toolchain - stable-x86_64-unknown-linux-gnu 

App directory structure
/dist
/node_modules
/src-tauri
/src
/.git
/public

App
  tauri - 1.0.0-rc.4
  tauri-build - 1.0.0-rc.4
  tao - 0.6.4
  wry - 0.13.3
  build-type - build
  CSP - default-src tauri: asset: https://asset.localhost
  distDir - ../dist
  devPath - http://localhost:3000/
  framework - React

Stack trace

No response

Additional context

No response

[red010182]

This config works for me.

    "allowlist": {
      ...
      "protocol": {
        "asset": true,
        "assetScope": ["**"]
      }
    },
    "security": {
      "csp": "default-src 'self'; img-src 'self' asset: https://asset.localhost; media-src 'self' asset: https://asset.localhost"
    }

---

Edit:

Don't do this. It's dangerous: #3735 (comment)

[FabianLars]

As i said in the other issue, you shouldn't configure the scope like this (Especially since we are working on a fix).
You're better of by doing it more like this:

1. Configure it correctly and as strict as possible.
2. Use dialogs and file-drop events to dynamically extend it.
3. Use rust to manually extend the scope at runtime as a last resort.

About scope errors: It should be logged to the terminal (in tauri dev) and we return a 403 response (with an empty body) on scope related errors

[firstdorsal]

This is not a scope issue. My scope already looks like this:

 "protocol": {
      "all": false,
      "asset": true,
      "assetScope": ["*"]
},

For my project this is necessary as the file explorer that i'm building requires the capability to, you know, display files :p.
Images do work via asset://, text like files and pdfs are loaded through rust but videos won't load with the assets protocol.

[FabianLars]

Ah whoops, didn't see that you were 2 different people, sorry.

[red010182]

Did you try adding media-src in csp? Add media-src 'self' asset: https://asset.localhost works for me.

[firstdorsal]

@red010182
The default-src already does allow assets: default-src tauri: asset: https://asset.localhost
I tried it anyway but it is not working. Also loading assets from the web wouldn't work if that was the problem.

[tedbyron]

@firstdorsal do you have a reproduction? I have a video conversion app I'm making and I'm able to display user-uploaded videos (from tauri dialog) in a <video> element with the following config:

{
  // ...
  "protocol": {
    "asset": true
  },
  // ...
  "security": {
    "csp": "default-src: 'self'; media-src 'self' asset:"
  }
}

[lucasfernog]

I can reproduce this issue, seems to be a webkit2gtk problem.

[dzervas]

Is there a workaround that we can use? Or we just wait for a proper fix?

[firstdorsal]

@tedbyron

from dialog

If you mean using the "Native" browser dialog to select a video then this is not related I think.

@lucasfernog great, good to know! Is this working on Win/Mac?

[lucasfernog]

I never had issues on Windows and macOS. And I don't know about a workaround :/

[lucasfernog]

@wusyong was investigating this issue, I think it's a problem with latest webkit2gtk.