강의

멘토링

로드맵

인프런 커뮤니티 질문&답변

김유신님의 프로필 이미지
김유신

작성한 질문수

Next.js - Vercel net::ERR_ABORTED 405

작성

·

1K

0

API Route관련 질문입니다.. 로컬 환경에선 잘 작동하는api route가 vercel 배포 후에 계속 제목에 적어놓은 405 에러가 발생합니다. 파일은 정확하게 pages/api/myapi.ts 이런식으로 되어있구요. 핸들러에 접근도 못하는 상황 입니다 매우답답하네요,,POST 나 GET 등 메소드 관련 로직은 당연히 다 적용 시켜봤습니다 머리로는 도저히 이해가 안가는 상황이라 같은 경우 겪어보신분 계시면 답좀 부탁드리겠습니다.. vercel 커뮤니티에서도 저랑 비슷한경우인 분들 계시던데 답을 다 못받으셧더라구요 혹시나 해서 질문올립니다. 참고로 405가 일반적으로 생기는 경우는 다 막아놨습니다.

혹시나 코드에서 문제가 있다고 생각하시는분들 계실 수도 있으시니 클라이언트, 서버 코드 올려놓겠습니다.

server

export const config = {
    runtime: 'edge',
};

export default async function handler (req: Request): Promise<Response> { 
      if(req.method === 'POST') {
          // some code  
      }
}

client

  const response = await fetch(endpoint, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                },
                signal: controller.signal,
                body
            });

답변 1

0

안녕하세요, 인프런 AI 인턴이에요. API Route 관련 질문에 답변드릴게요.

405 에러는 서버에 요청을 보냈을 때 해당 메소드가 허용되지 않을 때 발생하는 오류입니다. 문제가 발생하는 상황에 대해서 몇 가지 원인을 제시할게요.

  1. Vercel 설정 확인: Vercel로 배포된 후에는 호스팅 환경이 바뀌게 되는데, 해당 환경에서는 API Route가 올바르게 작동하지 않을 수 있습니다. Vercel 설정을 확인해보세요. 또한, Vercel의 서버 로그를 확인하여 어떤 오류가 발생했는지 알아보세요.

  2. CORS(Cross-Origin Resource Sharing) 설정: 클라이언트와 서버 간의 도메인이 다른 경우, CORS 관련 문제가 발생할 수 있습니다. fetch 요청을 할 때, 요청 헤더에 Access-Control-Allow-Origin을 포함시켜보세요. 추가로, Vercel 환경에서 CORS 설정을 확인해보세요.

  3. 서버 코드 확인: 서버 코드에서 문제가 발생할 수도 있습니다. POST 요청에 대한 핸들러가 정확히 작성되어 있는지 확인해보세요. 또한, 필요한 미들웨어가 누락되지 않았는지도 확인해보세요.

위의 원인들을 참고하여 문제를 해결해보세요. 추가로, 다른 사람들이 비슷한 문제로 겪고 있는지 확인하기 위해 Vercel 커뮤니티나 관련 포럼에서 검색해보시는 것도 좋을 것 같아요.

더 자세한 도움이 필요하시다면, 서버 코드 상세 내용이나 Vercel 설정 등을 공유해주시면 더 정확한 도움을 드릴 수 있을 것 같아요. 혹은 Vercel의 지원팀에 문의하여 도움을 받으실 수도 있어요. 감사합니다.

김유신님의 프로필 이미지
김유신

작성한 질문수

질문하기