如何在 React 原生中使用视频文件路径将视频存储在 Firebase 存储中

Question

当我获取视频路径时，我如何使用react-native将该视频存储在firebase存储上？

file://storage/emulated/0/DCIM/1234.MP4....我得到那条路

这是我的代码，我在其中创建了录像机并获取录制的视频文件路径。

import Camera from 'react-native-camera';
<Camera
captureMode={this.state.captureMode}
captureAudio={this.state.captureAudio}
captureTarget={this.state.captureTarget}
ref="camera"
style={styles.preview}>
{ toggle? <TouchableOpacity onPress={() =>this._startRecord()}>
<Image style={styles.clickimage}
source={require('../images/icon_record_stop.png')} /> 
</TouchableOpacity>
: <TouchableOpacity onPress={() =>this._endVideo()}>
<Image style={styles.clickimage}
source={require('../images/clickimage.png')} /> 
</TouchableOpacity>
}
</Camera>

_startRecord() {
this.refs.camera.capture({mode: Camera.constants.CaptureMode.video})
.then((data) => {
this.setState({
storagepathdata:data.path
});
//  var path = data.path;
})
.catch((err) => console.log(err))
}
_endVideo() {
this.refs.camera.stopCapture()
.then((response) => {                                      
alert(this.state.storagepathdata);
// here storagepathdata is a file path so what i do to store that video on firebase?      
} 

Answer 1

在fs.readFile(video，'base64')中设置视频路径，它将返回blob，然后设置用于视频的blob和contentType："video/mp4"和fter文件上传firebase返回视频网址以响应最后的承诺

不要忘记安装和导入

import RNFetchBlob from 'react-native-fetch-blob';
const sessionId = new Date().getTime();
const Blob = RNFetchBlob.polyfill.Blob;
const fs = RNFetchBlob.fs;
window.XMLHttpRequest = RNFetchBlob.polyfill.XMLHttpRequest;
window.Blob = Blob;        
let uploadBlob = null;
let mime = 'video/mp4';
const firebaseRef = firebase.storage().ref("video").child(`${sessionId}`);
return fs.readFile(video, 'base64') 
.then((data) => {   
console.log("data", data)             
return Blob.build(data, { type: `${mime};BASE64` })
})
.then((blob) => {
console.log("blob", blob)    
uploadBlob = blob;
return firebaseRef.put(blob, { contentType: mime })
})
.then((res) => {
console.log("res", res)  
uploadBlob.close();
return firebaRef.getDownloadURL()
})
.then((res) => {
console.log("URL", res)
})