在 ionic 3 中将 http 请求中的图像附加到节点服务器时出现错误 413

Question

我正在开发应用程序，它需要上传最多 4 张图像和其他数据（图像是可选的）。使用 Ionic Native HTTP 请求 将多个图像和其他数据上传到节点服务器（API 在 nodejs 中创建）时，出现以下错误。

error:{"statusCode":413,"error":"Request Entity Too Large","message":"Payload content lenght greater than maximum allowed: 1048576"}

我搜索了这个问题，但除了之外没有找到解决方案，但不知道如何在我的 ionic 3 应用程序中应用它。

这是我的代码。

openGallery(){
    if (
      this.thumb1 != "" &&
      this.thumb2 != "" &&
      this.thumb3 != "" &&
      this.thumb4 != ""
    ) {
         this.presentToast("You can not upload more than 4 images.");
         return;
    }
    var options = {
        sourceType: this.camera.PictureSourceType.PHOTOLIBRARY,
        encodingType: this.camera.EncodingType.JPEG,
        quality: 10,
        destinationType: this.camera.DestinationType.DATA_URL
       // destinationType: this.camera.DestinationType.FILE_URI
    };
    this.camera.getPicture(options).then(imageData => { 
        let base64File = "data:image/jpeg;base64," + imageData;
        if (this.Image_0 === null) {
          this.Image_0 = base64File;
        } else if (this.Image_1 === null) {
          this.Image_1 = base64File;
        } else if (this.Image_2 === null) {
          this.Image_2 = base64File;
        } else if (this.Image_3 === null) {
          this.Image_3 = base64File;
        }

    let base64Image = base64File;
    if (this.thumb1 == "") {
      this.thumb1 = base64Image;
      this.thumb1 = this.sanitizer.bypassSecurityTrustResourceUrl(
        this.thumb1
      );
    } else if (this.thumb2 == "") {
      this.thumb2 = base64Image;
      this.thumb2 = this.sanitizer.bypassSecurityTrustResourceUrl(
        this.thumb2
      );
    } else if (this.thumb3 == "") {
      this.thumb3 = base64Image;
      this.thumb3 = this.sanitizer.bypassSecurityTrustResourceUrl(
        this.thumb3
      );
    } else if (this.thumb4 == "") {
      this.thumb4 = base64Image;
      this.thumb4 = this.sanitizer.bypassSecurityTrustResourceUrl(
        this.thumb4
      );
    }
  }).catch(e => {
    console.log("Error while picking from gallery", e);
  });
}
postForm(){
   let loading = this.loadingCtrl.create({
    spinner: "bubbles"
  });
  loading.present();
   let myData: any = {
     Type: 1,
     CustomerId: this.CustomerId,
     Rating: Rating,
     Review: this.review.value.comment
   };
   if (this.Image_0 != null) {
    myData.Image_0 = this.Image_0;
  }
  if (this.Image_1 != null) {
    myData.Image_1 = this.Image_1;
  }
  if (this.Image_2 != null) {
    myData.Image_1 = this.Image_2;
  }
  if (this.Image_3 != null) {
    myData.Image_3 = this.Image_3;
  }
  this.http
    .post(
      global.apiUrl + "restaurants/" + this._id + "/reviews",
      myData,
      headers
    )
    .then(data => {
    })
    .catch(error => {
      loading.dismiss();
      alert(JSON.stringify(error, Object.getOwnPropertyNames(error)));
    });
}

从最近几天开始，我一直在努力寻找解决方案，但找不到解决方案，因此，在此处发布。

更新：我们正在使用 Hapi 服务器。

Answer 1

我已成功完成图片上传。错误是我没有指定图片的高度和宽度。

const options: CameraOptions = {
  quality: 100,
  destinationType: this.camera.DestinationType.FILE_URI,
  mediaType: this.camera.MediaType.PICTURE,
  targetWidth: 250,
  targetHeight: 200,
  correctOrientation: true
};

在 ionic 3 中将 http 请求中的图像附加到节点服务器时出现错误 413

Getting Error 413 when attach image in the http request to node server in ionic 3

ionic-framework

ionic3