Are http/localhost urls blocked in Android? Can I unblock them?

[bburdette]

Discussed in https://github.com/tauri-apps/tauri/discussions/10428

I'm looking to get audio/video working on my page in an android app.

According to https://github.com/tauri-apps/tauri/issues/3725 it appears I need to use a web server to host the files, because of a bug in webkit. I added a web server to my app, and it does work - on linux.

On android the files don't load. I enabled logging on my web server and it seems its never getting the requests. I can adb shell and use curl to access the files just fine, and then I see those accesses in my logs.

From my android app, I can embed links to media files over https. But it doesn't work with an http url.

So my question is, is there some kind of policy on android that blocks an url like this?

http://localhost:8000/file/75d69666-b189-475e-9d8d-827d45ed3838

If so, how can I deactivate that policy?

reproduction:

See the readme

Then make a markdown document that points to an http media file, like

<audio src="http://www.zknotes.com/file/fce8c414-a4ed-4af1-915e-2fe0f657f346" text="uses http"/>

<audio src="https://www.zknotes.com/file/fce8c414-a4ed-4af1-915e-2fe0f657f346" text="uses https"/>

Observe that the https one works while the http one does not.

expected behavior:

Expected that access to urls should be the same on linux and on android, with the same tauri.conf.json

Full tauri info output

WARNING: no lock files found, defaulting to npm

[✔] Environment
    - OS: Debian 12.0.0 X64
    ✔ webkit2gtk-4.1: 2.44.2
    ✔ rsvg2: 2.54.7
    ✔ rustc: 1.79.0 (129f3b996 2024-06-10)
    ✔ cargo: 1.79.0 (ffa9cf99a 2024-06-03)
    ✔ rustup: 1.27.1 (54dd3d00f 2024-04-24)
    ✔ Rust toolchain: stable-x86_64-unknown-linux-gnu (environment override by RUSTUP_TOOLCHAIN)

[-] Packages
    - tauri [RUST]: 2.0.0-beta.24
    - tauri-build [RUST]: 2.0.0-beta.19
    - wry [RUST]: 0.41.0
    - tao [RUST]: 0.28.1
    - tauri-cli [RUST]: 2.0.0-beta.22
    - @tauri-apps/api : not installed!
    - @tauri-apps/cli [NPM]: 2.0.0-beta.22

[-] App
    - build-type: bundle
    - CSP: image-src *; media-src *
    - frontendDist: static
    - devUrl: http://0.0.0.0:8080/

[bburdette]

On linux, remote https, remote http, and localhost http all work for video and audio:

On android, only remote https works for either video or audio ("remote https" is off the page in this view"):

[loikki]

Hi, You need to add some capabilities to your application. For example like this: https://gitlab.com/loikki/menugenerator/-/blob/master/capabilities/main.json?ref_type=heads

[bburdette]

I tried adding that item to capabilities/main.json, but I got this error:

long list of permissions, but no http

  Permission http:default not found,
 expected one of app:default,
 app:allow-app-hide,
 app:allow-app-show,
 app:allow-default-window-icon,
 app:allow-name,
 app:allow-tauri-version,
 app:allow-version,
 app:deny-app-hide,
 app:deny-app-show,
 app:deny-default-window-icon,
 app:deny-name,
 app:deny-tauri-version,
 app:deny-version,
 event:default,
 event:allow-emit,
 event:allow-emit-to,
 event:allow-listen,
 event:allow-unlisten,
 event:deny-emit,
 event:deny-emit-to,
 event:deny-listen,
 event:deny-unlisten,
 image:default,
 image:allow-from-bytes,
 image:allow-from-path,
 image:allow-new,
 image:allow-rgba,
 image:allow-size,
 image:deny-from-bytes,
 image:deny-from-path,
 image:deny-new,
 image:deny-rgba,
 image:deny-size,
 menu:default,
 menu:allow-append,
 menu:allow-create-default,
 menu:allow-get,
 menu:allow-insert,
 menu:allow-is-checked,
 menu:allow-is-enabled,
 menu:allow-items,
 menu:allow-new,
 menu:allow-popup,
 menu:allow-prepend,
 menu:allow-remove,
 menu:allow-remove-at,
 menu:allow-set-accelerator,
 menu:allow-set-as-app-menu,
 menu:allow-set-as-help-menu-for-nsapp,
 menu:allow-set-as-window-menu,
 menu:allow-set-as-windows-menu-for-nsapp,
 menu:allow-set-checked,
 menu:allow-set-enabled,
 menu:allow-set-icon,
 menu:allow-set-text,
 menu:allow-text,
 menu:deny-append,
 menu:deny-create-default,
 menu:deny-get,
 menu:deny-insert,
 menu:deny-is-checked,
 menu:deny-is-enabled,
 menu:deny-items,
 menu:deny-new,
 menu:deny-popup,
 menu:deny-prepend,
 menu:deny-remove,
 menu:deny-remove-at,
 menu:deny-set-accelerator,
 menu:deny-set-as-app-menu,
 menu:deny-set-as-help-menu-for-nsapp,
 menu:deny-set-as-window-menu,
 menu:deny-set-as-windows-menu-for-nsapp,
 menu:deny-set-checked,
 menu:deny-set-enabled,
 menu:deny-set-icon,
 menu:deny-set-text,
 menu:deny-text,
 path:default,
 path:allow-basename,
 path:allow-dirname,
 path:allow-extname,
 path:allow-is-absolute,
 path:allow-join,
 path:allow-normalize,
 path:allow-resolve,
 path:allow-resolve-directory,
 path:deny-basename,
 path:deny-dirname,
 path:deny-extname,
 path:deny-is-absolute,
 path:deny-join,
 path:deny-normalize,
 path:deny-resolve,
 path:deny-resolve-directory,
 resources:default,
 resources:allow-close,
 resources:deny-close,
 tray:default,
 tray:allow-get-by-id,
 tray:allow-new,
 tray:allow-remove-by-id,
 tray:allow-set-icon,
 tray:allow-set-icon-as-template,
 tray:allow-set-menu,
 tray:allow-set-show-menu-on-left-click,
 tray:allow-set-temp-dir-path,
 tray:allow-set-title,
 tray:allow-set-tooltip,
 tray:allow-set-visible,
 tray:deny-get-by-id,
 tray:deny-new,
 tray:deny-remove-by-id,
 tray:deny-set-icon,
 tray:deny-set-icon-as-template,
 tray:deny-set-menu,
 tray:deny-set-show-menu-on-left-click,
 tray:deny-set-temp-dir-path,
 tray:deny-set-title,
 tray:deny-set-tooltip,
 tray:deny-set-visible,
 webview:default,
 webview:allow-create-webview,
 webview:allow-create-webview-window,
 webview:allow-internal-toggle-devtools,
 webview:allow-print,
 webview:allow-reparent,
 webview:allow-set-webview-focus,
 webview:allow-set-webview-position,
 webview:allow-set-webview-size,
 webview:allow-set-webview-zoom,
 webview:allow-webview-close,
 webview:allow-webview-position,
 webview:allow-webview-size,
 webview:deny-create-webview,
 webview:deny-create-webview-window,
 webview:deny-internal-toggle-devtools,
 webview:deny-print,
 webview:deny-reparent,
 webview:deny-set-webview-focus,
 webview:deny-set-webview-position,
 webview:deny-set-webview-size,
 webview:deny-set-webview-zoom,
 webview:deny-webview-close,
 webview:deny-webview-position,
 webview:deny-webview-size,
 window:default,
 window:allow-available-monitors,
 window:allow-center,
 window:allow-close,
 window:allow-create,
 window:allow-current-monitor,
 window:allow-cursor-position,
 window:allow-destroy,
 window:allow-hide,
 window:allow-inner-position,
 window:allow-inner-size,
 window:allow-internal-toggle-maximize,
 window:allow-is-closable,
 window:allow-is-decorated,
 window:allow-is-focused,
 window:allow-is-fullscreen,
 window:allow-is-maximizable,
 window:allow-is-maximized,
 window:allow-is-minimizable,
 window:allow-is-minimized,
 window:allow-is-resizable,
 window:allow-is-visible,
 window:allow-maximize,
 window:allow-minimize,
 window:allow-monitor-from-point,
 window:allow-outer-position,
 window:allow-outer-size,
 window:allow-primary-monitor,
 window:allow-request-user-attention,
 window:allow-scale-factor,
 window:allow-set-always-on-bottom,
 window:allow-set-always-on-top,
 window:allow-set-closable,
 window:allow-set-content-protected,
 window:allow-set-cursor-grab,
 window:allow-set-cursor-icon,
 window:allow-set-cursor-position,
 window:allow-set-cursor-visible,
 window:allow-set-decorations,
 window:allow-set-effects,
 window:allow-set-focus,
 window:allow-set-fullscreen,
 window:allow-set-icon,
 window:allow-set-ignore-cursor-events,
 window:allow-set-max-size,
 window:allow-set-maximizable,
 window:allow-set-min-size,
 window:allow-set-minimizable,
 window:allow-set-position,
 window:allow-set-progress-bar,
 window:allow-set-resizable,
 window:allow-set-shadow,
 window:allow-set-size,
 window:allow-set-skip-taskbar,
 window:allow-set-title,
 window:allow-set-title-bar-style,
 window:allow-set-visible-on-all-workspaces,
 window:allow-show,
 window:allow-start-dragging,
 window:allow-start-resize-dragging,
 window:allow-theme,
 window:allow-title,
 window:allow-toggle-maximize,
 window:allow-unmaximize,
 window:allow-unminimize,
 window:deny-available-monitors,
 window:deny-center,
 window:deny-close,
 window:deny-create,
 window:deny-current-monitor,
 window:deny-cursor-position,
 window:deny-destroy,
 window:deny-hide,
 window:deny-inner-position,
 window:deny-inner-size,
 window:deny-internal-toggle-maximize,
 window:deny-is-closable,
 window:deny-is-decorated,
 window:deny-is-focused,
 window:deny-is-fullscreen,
 window:deny-is-maximizable,
 window:deny-is-maximized,
 window:deny-is-minimizable,
 window:deny-is-minimized,
 window:deny-is-resizable,
 window:deny-is-visible,
 window:deny-maximize,
 window:deny-minimize,
 window:deny-monitor-from-point,
 window:deny-outer-position,
 window:deny-outer-size,
 window:deny-primary-monitor,
 window:deny-request-user-attention,
 window:deny-scale-factor,
 window:deny-set-always-on-bottom,
 window:deny-set-always-on-top,
 window:deny-set-closable,
 window:deny-set-content-protected,
 window:deny-set-cursor-grab,
 window:deny-set-cursor-icon,
 window:deny-set-cursor-position,
 window:deny-set-cursor-visible,
 window:deny-set-decorations,
 window:deny-set-effects,
 window:deny-set-focus,
 window:deny-set-fullscreen,
 window:deny-set-icon,
 window:deny-set-ignore-cursor-events,
 window:deny-set-max-size,
 window:deny-set-maximizable,
 window:deny-set-min-size,
 window:deny-set-minimizable,
 window:deny-set-position,
 window:deny-set-progress-bar,
 window:deny-set-resizable,
 window:deny-set-shadow,
 window:deny-set-size,
 window:deny-set-skip-taskbar,
 window:deny-set-title,
 window:deny-set-title-bar-style,
 window:deny-set-visible-on-all-workspaces,
 window:deny-show,
 window:deny-start-dragging,
 window:deny-start-resize-dragging,
 window:deny-theme,
 window:deny-title,
 window:deny-toggle-maximize,
 window:deny-unmaximize,
 window:deny-unminimize

[loikki]

I am using the plugin tauri-plugin-http. I think it is from there https://github.com/tauri-apps/tauri-plugin-http

[bburdette]

I saw that plugin and thought it just gave you some extra JS apis, but wouldn't expect it to affect the webview http. Why would it work on desktop without a plugin but require it for android? But hey at this point I'll try anything lol.

[ximing-xu]

I try to use convertFileSrc method to play local video, but it not work, is there anyway to play local video resource on android platform?

[bburdette]

I still haven't gotten a chance to try the tauri-plugin-http. Will report back here with the result.

[Dirreke]

I meet the same issue. I can get the http resource using tauri android build --debug and also tauri android dev but not tauri android build. I tried tauri-plugin-http with capabilities, but it still doesn't work.

[Dirreke]

@lucasfernog Hi! Do you have any idea about this?

[Dirreke]

Hi! I just solved this issue. http is blocked by android 9+. You can add the below content to res/xml/network_security_config.xml

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <base-config cleartextTrafficPermitted="true" />
</network-security-config>

and then add the below contetn to AndroidManifet.xml

android:networkSecurityConfig="@xml/network_security_config"

It works for me.

[bburdette]

I gave that a try, but kept getting errors that the file could not be found! I put it here:

./src-tauri/gen/android/app/src/main/res/xml/network_security_config.xml

And tried a number of other locations to no avail.

But the good news is I instead found, and changed this line in AndroidManifest.xml:

android:usesCleartextTraffic="${usesCleartextTraffic}"

to this:

android:usesCleartextTraffic="true"

And now I'm able to see locally-served videos and audio files in the browser. At long last! I wonder if `usesCleartextTraffic' is something that is set someplace else, that's under source control, rather than in generated code?

[rupisaini123]

Do we know, if ${usesCleartextTraffic} can be set from TAURI itself?? Im getting (failed)net::ERR_CLEARTEXT_NOT_PERMITTED error when trying to load images from HTTP in release mode of apk

here is the security from tauri.conf.json

"security": {
      "csp": {
        "default-src": [
          "'self'",
          "data:",
          "tauri:",
          "asset:",
          "blob:",
          "https:",
          "http:",
          "'unsafe-eval'",
          "'unsafe-inline'",
          "file:"
        ],
        "img-src": [
          "'self'",
          "data:",
          "asset:",
          "https:",
          "http:",
          "blob:",
          "file:",
          "'unsafe-eval'",
          "'unsafe-inline'"
        ],
        "media-src": ["'self'", "https:", "http:", "blob:", "data:", "file:"],
        "script-src": [
          "'self'",
          "'unsafe-inline'",
          "'unsafe-eval'",
          "tauri:",
          "asset:",
          "file:"
        ],
        "style-src": [
          "'self'",
          "'unsafe-inline'",
          "https:",
          "http:",
          "https://fonts.googleapis.com",
          "file:"
        ],
        "font-src": ["'self'", "https://fonts.gstatic.com", "data:"],
        "connect-src": [
          "'self'",
          "https:",
          "http:",
          "ws:",
          "wss:",
          "data:",
          "tauri:"
        ],
        "frame-src": ["'self'", "https:", "http:", "blob:", "data:"],
        "worker-src": ["'self'", "blob:", "data:"]
      },