angular 8 Ngx网络摄像头-将网络摄像头图像上传到Firebase存储设备

时间:2020-01-13 20:23:13

标签: angular image firebase-storage angular8 webcam-capture

在Angular 8应用程序中,我正在使用Ngx-Webcam捕获网络摄像头图像。 并且可以使用imageAsDataUrl获取图像,也可以使用img标签在页面上显示
<img [src]="imgSrc">

我想在Firebase存储中上传相同的图像。请帮助我。 我尝试过

this.storage.upload(filePath, imgSrc).snapshotChanges().pipe().subscribe(...

但收到此错误

FirebaseStorageError {code_: "storage/invalid-argument", message_: "Firebase Storage: Invalid argument in `put` at index 0: Expected Blob or File.", serverResponse_: null, name_: "FirebaseError"}

1 个答案:

答案 0 :(得分:0)

您可以像这样用于 JS/TS,将 ngx-webcam 图像转换为文件类型:

handleCapturedImage(webcamImage: WebcamImage) {
this.webcamImage = webcamImage;
const arr = this.webcamImage.imageAsDataUrl.split(",");
const mime = arr[0].match(/:(.*?);/)[1];
const bstr = atob(arr[1]);
let n = bstr.length;
const u8arr = new Uint8Array(n);
while (n--) {
  u8arr[n] = bstr.charCodeAt(n);
}
const file: File = new File([u8arr], this.imageName, { type: this.imageFormat })
console.log(file);  }