使用文件传输插件时出现错误-Ionic 3

时间:2019-02-09 03:26:51

标签: ionic-framework ionic3 cordova-plugins

我正在尝试使用

将图像上传到我的服务器
"cordova-plugin-file-transfer": "^1.7.1",

"@ionic-native/file-transfer": "^5.0.0",

component.ts

takePicture() {
  const options: CameraOptions = {
    quality: 50,
    destinationType: this.camera.DestinationType.FILE_URI,
    encodingType: this.camera.EncodingType.JPEG,
    mediaType: this.camera.MediaType.PICTURE,
    sourceType: this.camera.PictureSourceType.PHOTOLIBRARY,
    targetWidth: 500,
    targetHeight: 500,
    saveToPhotoAlbum: false
  };

  this.camera.getPicture(options)
  .then((imageData) => this._img.uploadImage(imageData))
  .catch(err => console.log(err));
}

imageProvider.ts

import { FileTransfer, FileUploadOptions, FileTransferObject } from "@ionic-native/file-transfer/ngx";

   ...

uploadImage(img) {

  const url = `${this.apiURL}/images/upload`;

  // File for Upload
  var targetPath = img;

  var options: FileUploadOptions = {
    fileKey: 'image',
    chunkedMode: false,
    mimeType: 'multipart/form-data'
  };

  const fileTransfer: FileTransferObject = this.transfer.create();

  fileTransfer.upload(targetPath, url, options)
    .then(() => {
      console.log('good');
    }, (err) => {
      console.log('bad');
    })
}

我在logcat Android Studio中收到此错误:

  

“ TypeError:无法读取未定义的属性'constructor'”

我发现代码在到达这一行之前效果很好

const fileTransfer: FileTransferObject = this.transfer.create();

2 个答案:

答案 0 :(得分:2)

您使用了错误的本机插件版本,对于Ionic 3,则应使用版本4。

merchant_details.update(
      merchant_name=request.form['merchantname'],
      first_name=request.form['firstname'],
      last_name=request.form['lastname'],
      street_1=request.form['street1'],
      street_2=request.form['street2'],
      state=request.form['state'],
      city=request.form['city'],
      phone=request.form['phone'],
      zipcode=request.form['zip'],
    ).where(merchant_details.merchant_id==session['userid']).execute()

而且,请勿在导入末尾附加 ngx

ionic cordova plugin add cordova-plugin-file-transfer
npm install --save @ionic-native/file-transfer@4

供以后参考,如果您使用的是Ionic 3,请遵循Ionic v3文档,而不要使用最新文档。

V3文档https://ionicframework.com/docs/v3/native/file-transfer/

答案 1 :(得分:0)

在导入后您可能会缺少此行:

constructor(private transfer: FileTransfer, private file: File) { }

至少是documentation所建议的。