ファイルアップロードのエラーがSpring起動時Rest API

Question

Angular2からプロファイルイメージをアップロードしようとしていて、バックエンドがマルチパートデータをサポートしているSpring Boot Rest APIにあります。私はバックエンドに要求し、400

コードのエラーとクロムのリターンを受け取ることができなかったのです以下の通りである：

フロントエンド：

HTML：

<input class="file" type="file" (change)="uploadProfileImgOnChange($event)"> 

TS：

uploadProfileImgOnChange(event: any) { 
     let fileList: FileList = event.target.files; 
     if (fileList.length > 0) { 
      this.file = fileList[0]; 

      this.requestsService.postRequestMultipartFormData(
       '/admin/uploadProfileImg/' + this.id 
       , this.file) 
       .subscribe(
        (response: Response) => { 
         if (response['responseCode'] === 'ADM_SUC_08') { 
          console.log(); 
         } 
        }, 
        (error: any) => { 
         this.apUtilServer.tokenExpired(error.json()['error']); 
         //console.log(error.json()) 
        } 
       ); 
} 
} 

postRequestMultipartFormData(url: any, data: any) { 
     data = this.removeUndefined(data); 
     var formData = new FormData(); 
     const headers = new Headers(); 
     formData.append('file', data, data.name); 
     if (this.getToken()) { 
      headers.append('Authorization', 'Bearer ' + this.getToken()); 
     } 
     headers.append('Accept', 'application/json'); 
     console.log(headers); 
     return this.http.post('http://127.0.0.1:8080/AdminPortal/admin/' + url, formData, {headers: headers}) 
      .map((response: Response) => { 
       return response.json(); 
      }) 
    } 

バックエンド：事前に

@RequestMapping(value = "/uploadProfileImg/{id}", method = RequestMethod.POST) 
    public ResponseEntity<?> uploadProfileImage(HttpServletRequest request, 
               @PathVariable("id") long id, 
               @RequestParam("file") MultipartFile file) { 
     logger.info("Update Admin API called {" + id); 

感謝。

URLに問題はありませんので、チルドレンのコメントを無視してください。

Answer 1

Angular4でSpring Bootにファイルをアップロードする際に問題がありました。私は私の問題を解決したポストをここに見つけました。ここでhttps://stackoverflow.com/a/35669598/1474815

私は、ファイルを投稿するために使用するコードです：

はここでオリジナルのポストです。それは魅力のように働く。

uploadFile(file:File):Promise<MyEntity> { 
    return new Promise((resolve, reject) => { 

     let xhr:XMLHttpRequest = new XMLHttpRequest(); 
     xhr.onreadystatechange =() => { 
      if (xhr.readyState === 4) { 
       if (xhr.status === 200) { 
        resolve(<MyEntity>JSON.parse(xhr.response)); 
       } else { 
        reject(xhr.response); 
       } 
      } 
     }; 

     xhr.open('POST', this.getServiceUrl(), true); 

     let formData = new FormData(); 
     formData.append("file", file, file.name); 
     xhr.send(formData); 
    }); 
}