从相机胶卷中选择图像和 gif答案

【问题标题】：Select image and gif from Camera roll从相机胶卷中选择图像和 gif
【发布时间】：2019-04-16 22:32:04
【问题描述】：

我正在使用 Angular 和 Firebase 构建一个 Ionic 应用程序。

我希望能够将图像和 gif 上传到我的 firebase 数据库，但我只能让 image 工作。另外，我不想要视频。

我的代码如下：

takePhoto(sourceType:number) {
    const options: CameraOptions = {
      quality: 40,
      destinationType: this.camera.DestinationType.DATA_URL,
      encodingType: this.camera.EncodingType.JPEG,
      mediaType: this.camera.MediaType.PICTURE,
      correctOrientation: true,
      sourceType:sourceType,
    }

    this.camera.getPicture(options).then((imageData) => {
      let base64Image = 'data:image/jpeg;base64,' + imageData;
      this.uploadToStorage(base64Image);
    }, (err) => {
      // Handle error
    });
  }

  uploadToStorage(src) {
    this.uploadProgress = true;
    let storageRef = firebase.storage().ref();
    // Create a timestamp as filename
    this.imageFileName = Math.floor(Date.now() / 1000) + "_" + this.userData.uid;
    // Create a reference to 'images/todays-date.jpg'
    const imageRef = storageRef.child('posts/'+this.imageFileName+'.jpg');
    imageRef.putString(src, firebase.storage.StringFormat.DATA_URL).then((snapshot)=> {
      snapshot.ref.getDownloadURL().then(downloadURL => {
        this.imageURL = downloadURL;
        this.uploadProgress = false;
        this.uploadSuccess = true;
        console.log(this.imageURL)
        this.logEvent("Uploaded Image");
      });
    }, (err) => {
      console.log(err)
    });
  }

但这仅允许静止图像。根据Ionic Camera 的文档您可以将 mediaType: this.camera.MediaType.PICTURE 更改为 mediaType: this.camera.MediaType.ALLMEDIA 但这对我不起作用。当我在我的电脑上测试时它可以工作，但在 iOS 或 Android 上不行。

有什么想法可以让我选择图像和 GIF 吗？谢谢！

【问题讨论】：

您的问题是，您无法选择 gif 图像？如果是这样，请向我确认，您可以选择哪些文件。
@Vasanth 完全正确，我无法选择 gif。我可以选择像 png 和 jpeg 这样的常规图像。如果我将 mediaType 更改为 ALLMEDIA 我可以选择 gif，但它在 android 上不起作用，我不想能够选择视频...
当你将它设置为ALLMEDIA时，是否选择了正确的gif文件？通过记录，您可以检查它。如果这工作正常，那么我会告诉你一个上传文件的方法。
@Vasanth 是的，这很好，但在 Android 上它不允许你选择任何文件.. 只有在 iOS 上它才有效。
如果您只想从移动设备中选择文件而不想从相机拍摄图像，请使用ionicframework.com/docs/native/file-chooser。那会很直接，你所有的问题都会得到解决。

标签： javascript cordova ionic-framework ionic2 ionic3

【解决方案1】：

photos ; 
 OpenGallery(){
      console.log("taktit");
      const options: CameraOptions = {
        quality: 100,
        destinationType: this.camera.DestinationType.DATA_URL,
        sourceType: this.camera.PictureSourceType.SAVEDPHOTOALBUM 
      }

      this.camera.getPicture(options).then((imageData) => {
       // imageData is either a base64 encoded string or a file URI
       // If it's base64:
       console.log("taktit");
       let base64Image = 'data:image/jpeg;base64,' + imageData;
       this.photos.push(base64Image);
       this.photos.reverse();

      }, (err) => {
       // Handle error
      });  else {    }
    }

现在您可以将对象照片上传到 Firebase

【讨论】：

将 gif 转换为 base64 并使用它们，请参阅 google "convert gif to base64 whit javascript