[bug] Tauri cant load WebVTT file with asset protocol.

[promer94]

Describe the bug

Tarui can't load WebVTT subtitles through asset protocol.

When i try to load video and it subtitles using asset protocol. I found that the video could be successfully loaded but not the subtitles.

{
  "tauri": {
    "allowlist": {
      "path": {
        "all": true
      },
      "dialog": {
        "open": true
      },
      "fs": {
        "all": true,
        "scope": [
          "$DOWNLOAD/**/*"
        ]
      },
      "protocol": {
        "all": true,
        "asset": true,
        "assetScope": [
          "$DOWNLOAD/**/*"
        ]
      }
    },
    "security": {
      "csp": "default-src 'self'; img-src 'self' asset: https://asset.localhost; media-src 'self' asset: https://asset.localhost; connect-src 'self' asset: https://asset.localhost"
    },
  }
}

Reproduction

No response

Expected behavior

Tarui should be able to load WebVTT subtitles through asset protocol.

Platform and versions

Environment
  › OS: Mac OS 13.2.0 X64
  › Node.js: 18.12.0
  › npm: 8.19.2
  › pnpm: 7.16.1
  › yarn: 1.23.0-20220130.1630
  › rustup: 1.25.2
  › rustc: 1.67.0
  › cargo: 1.67.0
  › Rust toolchain: stable-aarch64-apple-darwin

Packages
  › @tauri-apps/cli [NPM]: 1.2.3
  › @tauri-apps/api [NPM]: 1.2.0
  › tauri [RUST]: 1.2.4,
  › tauri-build [RUST]: 1.2.1,
  › tao [RUST]: 0.15.8,
  › wry [RUST]: 0.23.4,

App
  › build-type: bundle
  › CSP: default-src 'self'; img-src 'self' asset: https://asset.localhost; media-src 'self' asset: https://asset.localhost; connect-src 'self' asset: https://asset.localhost
  › distDir: ../dist
  › devPath: http://localhost:1420/
  › framework: React
  › bundler: Vite

App directory structure
  ├─ dist
  ├─ node_modules
  ├─ public
  ├─ src-tauri
  ├─ .vscode
  └─ src

Stack trace

No response

Additional context

No response

[FabianLars]

This should be fixed by #6390. According to #6375 (comment).

[mauritzn]

This issue is unrelated to the asset protocol, rather this is caused by the overly strict CORS applied to captions compared to video files (this is not a Tauri issues, rather a general browser issue), to fix this add crossorigin="anonymous" to the video element.

Example:

<video src="..." controls width="500" height="300" crossorigin="anonymous">
  ...
</video>

For more information: https://bugs.chromium.org/p/chromium/issues/detail?id=226019