Question

我想使用ionic将图像保存在Storage和数据库Firebase中，但是我不保存在此页面中。我获得了图像数据。我拥有了获取图像的Picure，并上传了将数据发送到服务的信息。帮助别人我的代码下面 takeImage.ts

    takePicture() {
    this.photo = '';
    const options: CameraOptions = {
      quality: 100,
      destinationType: this.camera.DestinationType.DATA_URL,
      encodingType: this.camera.EncodingType.JPEG,
      mediaType: this.camera.MediaType.PICTURE,
      allowEdit: true,
      // correctOrientation: false,
      targetWidth: 1000,
      targetHeight: 1000
    }
    this.camera.getPicture(options)
              .then((imageDate) => {
                let base64image = 'data:image/jpeg;base64,' + imageDate;
                this.photo = base64image;
                // this.userService.uploadToStorage(this.user.user_id, this.photo, 'citizens')
                this.uploadInformation(this.photo);
                console.log(this.photo)
              }, (error) => {
                console.log(error)
              })
              .catch((error) => {
                console.log(error)
              })
  }

    uploadInformation(info) {
     let upload = this.userService.uploadToStorage(info);
     upload.then().then(res => {
       this.userService.storeInfoToDatabase(this.user.key, res.metadata)
         .then(() => {
           alert('Inserido com sucesso so colocar o toast depois')
         })
     })
   }

现在在我的服务中，我有此代码，storeInfoToDatabase方法收到2个参数user.key和图像名称 service.ts

    uploadToStorage(information: any): AngularFireUploadTask { 
    let newName = information + '.png'; 
    return this.afs.ref(`users/citizens/${newName}`).putString(information, 'base64');
  }

  storeInfoToDatabase(user_id, metainfo) {
    let toSAve = { 
      url: metainfo.downloadURLs[0],
      fullPath: metainfo.fullPath,
      contentType: metainfo.contentType,
    } 
    return this.db.list(`${this.PATH}/citizens`).update(user_id, (toSAve))
  }

帮我一个人如何保存在Firestora和数据库中...？

Answer 1

您可以使用angular-firebase npm package，它简单易用

npm install angular-firebase

您只需上传捕获的base 64图像用此代码

this.firebase.uploadString(encodedFile,'images/1.jpg','base64',
(value)=>{
    console.log('Upload progress :'+ value + '% uploaded');   
    // event detect the data uploaded  used to monitor the persentage of the download process
    // this will return 'Upload progress : 24% uploaded'
    // this part will run multiple times until the upload complete
// for example 
}).then((url)=>{
    console.log(url);
    // the URL of uploaded file or image,
    // this part run once when the upload complete
});

上传图片Firebase Ionic 3

1 个答案: