I’m currently having a persistent problem with my Ionic Native app.
I'm trying to upload a video file to firebase storage, I handle the recording with Media Capture:
"@ionic-native/media-capture": "^5.36.0""
this far so good.. when I try to upload this new file to firestore the file always uploads corrupted... or the file size is only 9Bytes!??
this is the code i'm using right now:
this.mediaCapture.captureVideo({duration: 10, quality: 0}).then(
(data: MediaFile[]) => {
if (data.length > 0) {
let originname = data[0].fullPath.substr(data[0].fullPath.lastIndexOf('/') 1);
let originpath = data[0].fullPath.substr(0, data[0].fullPath.lastIndexOf('/') 1);
let alerta = this.alerts.create({
buttons: ['ok'],
message: this.file.externalDataDirectory
});
alerta.then(set => set.present());
this.file.copyFile(originpath, originname, this.file.externalDataDirectory, 'video.mp4')
.then(result =>{
//let video = (document.getElementById('myvideo') as HTMLVideoElement).src = result.nativeURL;
//let path =this.webview.convertFileSrc(result.nativeURL);
// this.video = path;
// let alert = this.alerts.create({
// buttons: ['ok'],
// message: path
// });
// alert.then(set => set.present());
// let videoname = path.substr(path.lastIndexOf('/') 1);
// let videopath = path.substr(0, path.lastIndexOf('/') 1);
const data = Filesystem.readFile({
path: result.nativeURL
})
.then(data =>{
let blob= new Blob([data.data], {type: 'video/mp4'});
let ref = this.storage.storage.ref().child('videoTests').child('video.mp4')
ref.put(blob).then(
result =>{
let url = this.storage.ref('/videoTests/' 588 '.mp4').getDownloadURL();
url.subscribe(result =>{
console.log(result);
let alert = this.alerts.create({
buttons: ['ok'],
message: result
});
alert.then(set => set.present());
})
})
NOTE: for context I've tried to use native File readAsDataURL but the promise never resolves.. in the console I see it processing but at the very end it just stuck and never resolves..
- Ionic 6.16.3
- Angular Core 12.1.1
- Node 14.15.0
any help or guidance is greatly appreciated I have days stuck at this point now...
[SOLVED]
CodePudding user response:
SOLVED: this is nows solved... the result of Filesystem.readFile is base64 so all I have to do is to process this result as base64 and then convert it to a blob this successfully uploads a valid video file.