23-06-06 TIL: 'Request failed with status code 405, Axios Error'

'Request failed with status code 405, Axios Error'

 

요즘 웹개발을 해보고 있는데 와중에 발생한 에러

 

구글링을 해보니 보통 프론트와 백의 http method가 일치하지 않았을 때 발생한다고 함.

하지만 내 코드는 아무리 봐도 둘 다 POST로 잘 설정되어 있었음

(근데 왜 코드 블럭 각각의 언어를 별도로 설정 못하는 것인가... 너무 불편하다)

// main.js

        mosaicFile() {
            if (this.file) {
                let formData = new FormData();
                formData.append('video', this.file);
                axios.post('/boonmosa', formData)
                    .then(response => {

 

# app.py
@app.route("/boonmosa", methods=["POST"])
def boonmosa():
    if not request.method == "POST":
        return "Method Not Allowed", 405
    video = request.files['video']

 

열심히 구글링을 하다가 아래 글의 한 파트를 읽게 되었음

https://blog.airbrake.io/blog/http-errors/405-method-not-allowed

405 Method Not Allowed: What It Is and How to Fix It

 

Check the Requested URL

The most common cause of a 405 Method Not Allowed is simply inputting an incorrect URL. As discussed before, many web servers will disallow access to improper URLs. 

This could be anything from trying to access a file directory via a URL to gaining access to a private page meant for other users. Double-check the exact URL returning the 405 Method Not Allowed error.

 

저 글을 읽다가 순간 URL? 설마 포트가 달라서 그런건가 의심하게 됨.

백은 8080포트, 프론트는 Go Live를 사용하여 5500번 포트를 쓰고 있던 상황

백의 포트를 수정해주니 해결!

결국 해당 에러는 코드를 실행해주는 프로그램을 2개 이상 사용하다보니 발생한 것으로...

(처음부터 그냥 Go live 쓰지 말고 python app.py로만 테스트 했으면 없었을 이슈 같음)