spring - IONIC HTTP post multipart/form-data - 图像与 JSON 一起上传

Question

我正在尝试通过 HTTP Post 以多部分方式上传图像和表单数据。当我尝试使用 postman 时，我可以上传，但是当我尝试将文件连同表单数据作为多部分请求上传时，使用前端，我收到错误的请求错误。我真的很感谢你的意见。现在已经为此工作了 2 天。

我的后端是 Spring: 后端代码:

  @RequestMapping(value = "/lender/signup", method = RequestMethod.POST, consumes = MediaType.MULTIPART_FORM_DATA_VALUE, produces =MediaType.APPLICATION_JSON_VALUE)

   @ResponseStatus(HttpStatus.CREATED)

    Object signUpLender(@RequestPart("file") MultipartFile file, 

    @RequestPart("lender") LenderInfo lenderRequest) throws Exception {

    log.info("SignUp Received, preparing to process lender")
    lenderRequest.base64Logo = mediaService.getBase64Media(file)
    Optional<Object> lenderInfo = Service.signUpLender(lenderRequest)
    log.info("Fetched LenderInfo: ${lenderInfo.get()}")
    lenderInfo.get()
}

前端:: ionic :

 uploadImage() {
    // Destination URL
    var url = LENDER_URL;

    // File for Upload
    var targetPath = this.pathForImage(this.correctPath);

    // File name only
    var filename = this.correctPath;
      //const filetransfer: TransferObject = this.transfer.create();
    var options = {
        fileKey: "file",
        fileName: this.currentName,
        chunkedMode: false,
        mimeType: "multipart/form-data",
        params: {'lender':this.userData,
            'file':this.currentName},
        httpMethod:'POST'
    };
      let headers = new HttpHeaders();
      headers.append('Content-Type', undefined);
      headers.append('Access-Control-Allow-Origin', '*');
      headers.append('Access-Control-Allow-Methods', 'POST, GET, OPTIONS,PUT');
        this.formData.then((_)=>{
            this.loading = this.loadingCtrl.create({
                content: 'Uploading...',
            });
            this.loading.present();
            this.network.postService(url,options,headers).then(()=>{
                this.loading.dismissAll();
                this.presentToast('Image succesful uploaded.');
            }, err => {
                this.loading.dismissAll();
                console.log(JSON.stringify(err));
                this.presentToast('Error while uploading file.');
            });
        },err=>{JSON.stringify(err)});

在 Postman 中，当我尝试访问端点时，我可以在选择图像(文件)和 JSON 作为文件时发布值。请让我知道您的意见。

谢谢

Answer 1

我已经解决了这个问题，解决它的一种方法是指定类型 @RequestPart (value = "nameOfResource"and consumes = {"multipart/form-data")

不要忘记在 Ionic 中指定内容的名称。希望对您有所帮助。

下面是一个 Java 示例:

RequestMapping(value = "/add", method = RequestMethod.POST, consumes = {"multipart/form-data"}, produces = "application/json")
        public ResponseEntity<?> add(@RequestPart(value = "image", required = true) MultipartFile image, 
                                     @RequestPart(value = "team", required = true) @Valid Team team, BindingResult bResult) {

}