1

I want to upload the file with spring boot and vue. But, I have an error '415 : Unsupported MediaType'.

This is my spring boot controller.

@PostMapping(consumes = {MediaType.MULTIPART_FORM_DATA_VALUE}, produces = {MediaType.APPLICATION_JSON_VALUE})
@ResponseBody
@ApiOperation(value = "회원 가입", notes = "<strong>아이디와 패스워드</strong>를 통해 회원가입 한다.") 
@ApiResponses({
    @ApiResponse(code = 200, message = "성공"),
    @ApiResponse(code = 401, message = "인증 실패"),
    @ApiResponse(code = 404, message = "사용자 없음"),
    @ApiResponse(code = 500, message = "서버 오류")
})
public ResponseEntity<User> register(
        @RequestParam("file") MultipartFile file,) throws IllegalStateException, IOException, URISyntaxException {
    ...

}

And, this is my vue code.

<el-form-item prop="profileImg" label="프로필 사진" :label-width="state.formLabelWidth" >
  <input @change="fileSelect()" id="profileimg" type="file" accept="image/*">
</el-form-item>

const formData = new FormData()
        formData.append('userId', state.form.userId)
        formData.append('userName', state.form.userName)
        formData.append('password', state.form.password)
        formData.append('age', state.form.age)
        formData.append('gender', state.form.gender)
        formData.append('phoneNum', state.form.phoneNum)
        formData.append('email', state.form.email)
        formData.append('mbti', state.form.mbti)
        formData.append('guide', state.form.guide)
        formData.append('file', state.form.profileImg)

profileImg ({ commit }, payload) {
  return axios
    .post(`${BASE_URL}/api/v1/users`, payload,
      { 
        headers: {
          "Accept": "*/*", 
          "Content-Type": "multipart/form-data"
        }
      }
    )
}

I tried @RequestPart MultipartFile file, but had the same error. How can I fix it?

subeen
  • 11
  • 2

2 Answers2

0

Sorry, I can't add comments, this answer is just my guess

what if you output

request.getHeader(HttpHeaders.CONTENT_TYPE);

Content-Type may have been changed if your request pass through Nginx or other agent

Zhang Sen
  • 26
  • 2
0

I found an answer here on GitHub All you have to do is change

@RequestParam("file") MultipartFile file)

with :

@RequestParam("file") FilePart file)
Hosten
  • 138
  • 1
  • 11