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

Question

在Angular 8应用程序中，我使用Ngx-Webcam来捕捉摄像头图像。可以使用imageAsDataUrl获取图像，也可以使用img标签显示在页面上

<img [src]="imgSrc">

我想上传相同的图像在firebase storage.please教我怎么做。我试过了

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"}

Answer 1

您可以像这样使用JS/TS，将ngx-webcam图像转换为File类型：

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);  }