ファイルをIonicのTypeScriptのBlobに作成する

Question

BlobファイルをFirebaseにアップロードしようとしていますが、「makeFileIntoBlob」関数が返されるため「未定義」になっています。私はAndroid上でそれを実行しています。 私は写真を撮影した後にファイルパスを取得できますが、Blobを取得してFirebaseにアップロードする機能を呼び出すと、Blobファイルが「未定義」になります。 いくつかお困りですか？

私はFirebaseストレージに画像をアップロード相続機能

uploadToFirebase(imageBlob) { 
var fileName = 'sample.jpg'; 
return new Promise((resolve, reject) => { 
var fileRef = firebase.storage().ref('Animais/' + fileName); 

var uploadTask = fileRef.put(imageBlob); 

uploadTask.on('state_changed', (snapshot) => { 
    console.log('snapshot progess ' + snapshot); 
}, (_error) => { 
    reject(_error); 
},() => { 
    // completion... 
    resolve(uploadTask.snapshot); 
}); 
}); 
} 

私はファイルパス

makeFileIntoBlob(imagePath) { 

var reader = new FileReader(); 
reader.onloadend = (evt: any) => { 
    var imgBlob: any = new Blob(imagePath); 
    imgBlob.name = 'sample.jpg'; 
    return imgBlob; 
}; 
reader.onerror = (e) => { 
    console.log('Failed file read: ' + e.toString()); 
}; 

からブロブをしようと相続機能Iピクチャ

を取る相続機能

takePic(){ 

let imageSource; 

this.camera.getPicture({ 
    destinationType: this.camera.DestinationType.FILE_URI, 
    sourceType: imageSource, 
    encodingType: this.camera.EncodingType.JPEG, 
    targetHeight: 640, 
    correctOrientation: true, 
    saveToPhotoAlbum : true 
}).then((imagePath) => { 
    alert('got image path ' + imagePath); 
    // convert picture to blob 
    return this.makeFileIntoBlob(imagePath); 
}).then((imageBlob) => { 
    alert('got image blob ' + imageBlob); 
    // upload the blob 
    return this.uploadToFirebase(imageBlob); 
}).then((uploadSnapshot: any) => { 
    alert('file uploaded successfully ' + uploadSnapshot.downloadURL); 
    // store reference to storage in database 
    return this.saveToDatabaseAssetList(uploadSnapshot); 
}).then((uploadSnapshot: any) => { 
    //alert('file saved to asset catalog successfully '); 
}, (error) => { 
    alert('Error ' + (error.message || error)); 
}); 

Answer 1

私がコメントで述べたように、あなたの問題はFileReaderのコールバックを使用してPromiseを解決/拒否しません。代わりにPromiseを返す必要があります。実際にFileReaderを使ってimagePathから何かを読み取っているわけではありませんが、FileReaderがFileまたはBlobで、URIsでないので、それが機能するかどうかわかりません。 URIがdata:// URIの場合は、コードを使用してBlobに変換できます。 URIがfile://の場合は、chrome-privileged以外の場合はブラウザで許可する権限がありません。お待ちください、あなたはブラウザにいますか？

残念ながら私はあなたとは思わないposted enough info for anyone to reproduce。 Cordovaを使用していますか？その場合は、返されたfile:// URLをに渡すのではなく、File Transfer APIと一緒に使用しないでください。それがうまくいかない場合、私はコルドバについて何も知らないので、私は本当にあなたを助けることができません。他の人があなたを助けることができるように、タグを追加することもできます。また、該当するかもしれない他のrelevant questionsのStackOverflowを検索してください。

幸運を祈る！