○오류 내용・상황

The GET method is not supported for this route. Supported methods: POST.

로컬 환경에서는 동일한 코드에서도 문제없이 작동했지만 릴리스 환경이 된 후 405 오류가 발생했습니다.

○해결 방법

원인은

Vue.js측의 axios로 POST로 기재하고 있지만, GET가 되어 버리고 있는 일이었습니다.

sample.vue

const url = '/post/search/';
$('.bath-search .error').text('');
axios.post(url, {
    prefecture: this.selectedPrefecture,
    keyword: this.keyword,
})

원인 코드는 여기

const url = '/post/search/';

마지막 슬래시가 필요하지 않습니다.

const url = '/post/search';

○슬래시의 유무로 결과가 바뀌는 이유

말미의 슬래시의 유무로, 액세스 대상이 디렉토리인가 파일인가가 바뀌어 버립니다.

후행 슬래시가 포함된 경우 웹 서버(Apache, nginx 등)는 종종 HTTP 상태 301의 리디렉션 응답을 반환합니다. 이 리디렉션시에는 원래의 리퀘스트가 POST 메소드이어도 강제적으로 GET 메소드가 되어, 리디렉트원과는 전혀 다른 API 를 두드리게 되어 버그가 될 수 있습니다.

○참고