How to use Filesystem.readFile if I have a full path

Question

In an Capacitor/Ionic/Angular app I am trying to allow a user to take a video, view it in a <video> tag, and I also need to be able to send the video data in a POST request when the user submits it.

I'm getting the video using Cordova's MediaCapture plugin so what I get back contains a fullPath of the form file://...

The bit I'm stuck on is then actually getting a File/Blob object from the full path.

I tried using Filesystem.readFile() from Capacitor Plugins, but the problem is that it requires a path: string and a directory: FilesystemDirectory. If I try to just provide {path: fullPath} I get a "File does not exist" error. The FilesystemDirectory just gives me several options to choose from but I wouldn't want to use it as I already have the full path and don't want to go into checking which directory I should use in which device.

Is there any other way I can get around this?

Answer 1

use Capacitor.convertFileSrc('file:///path/to/video.mp4');, then you'll have a path that the webview understands and you can use fetch/xhr to that path to get the Blob. (Note that on iOS it won't work if running in live reload mode as iOS blocks requests from http scheme (used by the live reload server) to capacitor scheme (regular capacitor scheme when running normally)