Ionic 4 Загрузка изображений с использованием Angular HTTP - PullRequest
Новая
       21

Ionic 4 Загрузка изображений с использованием Angular HTTP

0 голосов
/ 21 апреля 2019

Я использую Ionic 4 и Angular 7 с PHP в качестве Back-end. Я пытаюсь загрузить файлы (изображения / видео / PDF / аудио). Есть ли общий способ отправить его. Я попытался отправить изображение с помощью плагина камеры, он возвращает URI и работает в приложении с помощью тега img. Но я не могу получить файл самостоятельно, чтобы отправить его с помощью formData 

openCamera() {

    const options: CameraOptions = {
      quality: 100,
      destinationType: this.camera.DestinationType.FILE_URI,
      encodingType: this.camera.EncodingType.JPEG,
      mediaType: this.camera.MediaType.PICTURE,
      sourceType: this.camera.PictureSourceType.PHOTOLIBRARY
    };

    this.camera.getPicture(options).then((imageData) => {
      this.imageData = imageData; 
      this.image = (<any>window).Ionic.WebView.convertFileSrc(imageData); 
       // this.image works fine in img tag
      this.sendMsg(this.image);
    }, (err) => {
      // Handle error
      alert('error ' + JSON.stringify(err));
    });

  }

  sendMsg(file?) {
    const data = new FormData();
    data.set('group_id', this.groupId);
    data.set('text', this.msg);
    if (file) {
      data.set('file', this.image);
      data.set('text', '');
    }

    this.messeges.push(data);

    this._messengerService.postMsg(data).subscribe(
      res => {
        console.log('res ', res);

        if (res.success === true) {
          console.log('data added ', res);

        }
      }
    );
  }

Я хочу использовать URI для получения фактического файла

1 Ответ

0 голосов
/ 21 апреля 2019

Плагин Ionic Native вернет только base64.По вашему вопросу вам необходимо конвертировать formdata.Итак, вам нужно конвертировать base64 в formdata извне. 

  dataURItoBlob(dataURI) {
    // convert base64/URLEncoded data component to raw binary data held in a string
    var byteString;
    if (dataURI.split(',')[0].indexOf('base64') >= 0)
      byteString = atob(dataURI.split(',')[1]);
    else
      byteString = unescape(dataURI.split(',')[1]);
    // separate out the mime component
    var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0];
    // write the bytes of the string to a typed array
    var ia = new Uint8Array(byteString.length);
    for (var i = 0; i < byteString.length; i++) {
      ia[i] = byteString.charCodeAt(i);
    }
    return new Blob([ia], { type: mimeString });
  }

и 

 profileUpdate(options) {
    this.camera.getPicture(options).then((imageData) => {
      let base64Image = 'data:image/jpg;base64,' + imageData;
      let data = this.dataURItoBlob(base64Image);
      let formData = new FormData();
      formData.append('profile', data, "filename.jpg");
      //here you pass the formdata to to your API
    })
...