[Error] React axios post 415 error

장고(django)와 리액트(react) 연동 중 POST 기능이 동작하지 않아 애를 먹었다.

415 unsupported media type error
detail: "Unsupported media type "multipart/form-data; boundary=--WebKitFormBoundary12mZg03XXxiQoXkX\" in request."

 

 

await axios
      .post("/testapp/api/create", formData, {
        headers: {
          "Content-Type": "multipart/form-data",
        },
      })

 

 

axios post 헤더에 Content-Type 을 multipart/form-data라고 명시해 줬는데도 안 먹히는 건지 415 오류가 나는 모습이었다.

스택오버플로우의에서 봤던 react 부분을 건드리는 해결책은 전부 소용이 없었고 장고에서 설정을 변경해 줘야겠다고 생각했다.

 

 

 

왜냐하면 백엔드 쪽에서의 media type이 application/json밖에 지원되지 않는 모습이었기 때문.

파일을 전송하기 위해서는 content-type을 multipart/form-data로 지정하는 것이 필수적이다.

원인은 django의 settings.py에 있었다

 

 

 

 

## settings.py 

REST_FRAMEWORK = {
    'DEFAULT_PARSER_CLASSES': (
        'rest_framework.parsers.JSONParser',
        'rest_framework.parsers.FormParser',
        'rest_framework.parsers.MultiPartParser'
    )
}

default_parser_classes를 jsonParser로 설정해 놨었는데 위와 같이 FormParser, MultiPartParser도 추가해 주거나 아예 파서 클래스를 지정하지 않으면 된다.

 

 

진짜 이것 때문에 죽는 줄... ^^ 보는 사람이 있다면 도움이 되길 바란다.