"405 Method Not Allowed"
Visual Studio Code의 Live Server 확장 기능을 사용할 때, 백엔드 호출 시 이런 오류가 발생하는 이유 중 하나는 Live Server와 Node.js 서버를 혼동하는 경우입니다.
클라이언트(HTML, CSS, JS 파일)는 Live Server를 통해 제공되고, 백엔드 API(server.js)는 Node.js 서버를 통해 제공됩니다. 클라이언트 측 JavaScript에서 API 요청을 할 때, 올바른 서버 주소(예: http://localhost:3000/api/sample)를 사용하면 "405 Method Not Allowed" 오류를 해결할 수 있습니다.
Live Server
Live Server는 일반적으로 정적 파일(HTML, CSS, JavaScript 등)을 제공하는 데 사용됩니다. 이때, index.js 파일은 정적 파일로 제공되며, server.js는 별도의 Node.js 서버로 실행되어야 합니다. Live Server는 server.js등 서버단 코드를 실행하지 않습니다. 일반적으로 Live Server는 기본 포트인 5500 또는 8080을 사용합니다.
따라서 Node.js 서버를 실행하려면 터미널에서 node server.js 명령을 사용하여 별도로 실행해야 할 필요가 있습니다.
서로 다른 포트에서 실행하는 것이 일반적
두 서버가 서로 독립적으로 동작하여 충돌을 방지할 수 있기에, 개발의 원활함을 위해 Live Server와 server.js를 서로 다른 포트에서 실행하는 것이 일반적입니다. 기본적으로 Live Server는 자동으로 할당된 포트(일반적으로 5500번대)에서 실행되며, Node.js 서버는 코드 내에서 지정된 포트(예: 3000)에서 실행됩니다.
- Live Server 포트 설정:
- Live Server의 포트를 변경하려면 VS Code 설정을 사용합니다.
- VS Code에서 File > Preferences > Settings로 이동한 다음, Live Server Config를 검색합니다.
- 여기에서 Live Server: Port 설정을 찾아 원하는 포트 번호로 변경할 수 있습니다.
- Node.js 실행 파일 포트 설정:
- Node.js 실행 파일에서는 환경 변수 PORT를 사용하여 포트 번호를 설정하며, 설정되지 않은 경우 기본적으로 3000번 포트를 사용합니다.
- 실행:
- Live Server: index.html 파일을 열고, 오른쪽 하단의 'Go Live' 버튼을 클릭하여 Live Server를 실행합니다.
- Node.js 서버: VS Code 터미널에서 node server.js (예시) 명령을 실행하여 Node.js 서버를 시작합니다.
