readAsArrayBuffer 返回空数组(尝试将视频转换为 blob 并上传)
readAsArrayBuffer returning empty array (trying to convert video to blob and upload it)
我正在尝试使用 Ionic/Capacitor/React 上传视频。
为此,我使用了 cordova-video-capture-plus 插件。
我在尝试 readAsArrayBuffer 时卡住了。出于某种原因,它总是空着回来,在我的代码下面:
const doMediaCapture = async () => {
let options: VideoCapturePlusOptions = { limit: 1, duration: 30 };
let capture:any = await VideoCapturePlus.captureVideo(options);
let media = capture[0] as MediaFile;
// works on android....
let resolvedPath: DirectoryEntry;
let path = media.fullPath.substring(0, media.fullPath.lastIndexOf("/"));
if (Capacitor.getPlatform() === "ios") {
console.log("ios")
resolvedPath = await File.resolveDirectoryUrl("file://" + path);
} else {
console.log("android")
resolvedPath = await File.resolveDirectoryUrl(path);
}
console.log(media)
console.log(resolvedPath)
File.readAsArrayBuffer(resolvedPath.nativeURL, media.name).then(
(buffer: any) => {
console.log(buffer)
// get the buffer and make a blob to be saved
let videoBlob: Blob = new Blob([buffer], {
type: media.type,
});
let url = window.URL.createObjectURL(videoBlob);
console.log(videoBlob)
let { jobId } = apartments[+id!];
if (videoBlob instanceof Blob) {
console.log("processing as File");
let fName = `${new Date().getTime()}`;
if (videoBlob instanceof Blob) {
if (videoBlob.type.split("/")[1] === "quicktime") {
fName = fName + ".mov";
} else {
fName = fName + "." + videoBlob.type.split("/")[1];
}
}
let ref = "videos/" + fName
uploadVideo(jobId, videoBlob, ref)
} else {
console.log("processing as DataAsDataUrl");
let v = videoBlob as DataAsDataUrl;
let fName = `${new Date().getTime()}.${v.format}`;
let ref = "images/" + fName
uploadVideo(jobId, videoBlob, ref)
}
},
(error:any) => console.log(error)
);
};
我得到以下输出,它是一个空数组,因此如果我尝试上传它,它不会上传任何东西:
如何将该视频文件转换为 blob 以上传?
requestLegacyExternalStorage - 这在 AndroidManifest 中设置正确吗? https://medium.com/androiddevelopers/modern-user-storage-on-android-e9469e8624f9
解决方案是停止使用 video-capture-plus 插件,因为它似乎与不同的手机存在兼容性问题。
我继续使用本地插件媒体捕获及其方法 MediaCapture.captureVideo()
安装以下插件:
"@ionic-native/media-capture": "^5.24.0"
和它的 Cordova 对应物:
“cordova-plugin-media-capture”:“^3.0.3”,
我正在尝试使用 Ionic/Capacitor/React 上传视频。
为此,我使用了 cordova-video-capture-plus 插件。
我在尝试 readAsArrayBuffer 时卡住了。出于某种原因,它总是空着回来,在我的代码下面:
const doMediaCapture = async () => {
let options: VideoCapturePlusOptions = { limit: 1, duration: 30 };
let capture:any = await VideoCapturePlus.captureVideo(options);
let media = capture[0] as MediaFile;
// works on android....
let resolvedPath: DirectoryEntry;
let path = media.fullPath.substring(0, media.fullPath.lastIndexOf("/"));
if (Capacitor.getPlatform() === "ios") {
console.log("ios")
resolvedPath = await File.resolveDirectoryUrl("file://" + path);
} else {
console.log("android")
resolvedPath = await File.resolveDirectoryUrl(path);
}
console.log(media)
console.log(resolvedPath)
File.readAsArrayBuffer(resolvedPath.nativeURL, media.name).then(
(buffer: any) => {
console.log(buffer)
// get the buffer and make a blob to be saved
let videoBlob: Blob = new Blob([buffer], {
type: media.type,
});
let url = window.URL.createObjectURL(videoBlob);
console.log(videoBlob)
let { jobId } = apartments[+id!];
if (videoBlob instanceof Blob) {
console.log("processing as File");
let fName = `${new Date().getTime()}`;
if (videoBlob instanceof Blob) {
if (videoBlob.type.split("/")[1] === "quicktime") {
fName = fName + ".mov";
} else {
fName = fName + "." + videoBlob.type.split("/")[1];
}
}
let ref = "videos/" + fName
uploadVideo(jobId, videoBlob, ref)
} else {
console.log("processing as DataAsDataUrl");
let v = videoBlob as DataAsDataUrl;
let fName = `${new Date().getTime()}.${v.format}`;
let ref = "images/" + fName
uploadVideo(jobId, videoBlob, ref)
}
},
(error:any) => console.log(error)
);
};
我得到以下输出,它是一个空数组,因此如果我尝试上传它,它不会上传任何东西:
如何将该视频文件转换为 blob 以上传?
requestLegacyExternalStorage - 这在 AndroidManifest 中设置正确吗? https://medium.com/androiddevelopers/modern-user-storage-on-android-e9469e8624f9
解决方案是停止使用 video-capture-plus 插件,因为它似乎与不同的手机存在兼容性问题。 我继续使用本地插件媒体捕获及其方法 MediaCapture.captureVideo()
安装以下插件: "@ionic-native/media-capture": "^5.24.0" 和它的 Cordova 对应物: “cordova-plugin-media-capture”:“^3.0.3”,