Azure App Service(Node Stack)에 웹 서비스(NestJS)를 배포하는 방법

먼저

취미로 만든 웹 서비스(NestJS)를 Azure App Service 에 무료로 공개하는 방법을 기재합니다.
우선, Azure 공식 문서 「 Azure에서 Node.js 웹 앱 만들기 」를 참고로 실시하면, 솔직하게 동작했습니다.
그러므로, NestJS 하지만 문제 없다고 생각해 배포하고, 브라우저로 표시하면 이하의 에러가 표시되어 버렸습니다.

대체 수단 조사

음, 곤란했다…
누군가를 해결해주지 않았는지 검색하면 Azure Functions에 배포하는 사람과 Azure Web App for Containers에서 Docker 컨테이너를 배포하는 사람이있었습니다.

Azure Functions 개발 환경을 NestJS로 구축하는 방법

Node.js 앱을 Azure App Service에 가장 적합한 형태로 배포

두 방법 모두 요구 사항이 일치하면 사용하고 싶었지만,,,
Azure Functions를 이용하는 방법이라면, 무료로 할 수 있을 것 같지만 웹 서비스내의 메모리 캐쉬는 사용할 수 있을까? 의문에 느꼈기 때문에 삼가하기로 했습니다.
Docker 컨테이너를 이용하는 방법이라면 컨테이너를 배포하기 위해서는 유료의 Azure Container Registry 가 필요하게 되기 때문에 단념했습니다.

해결 수단

소스를 일부 수정하는 것과 Azure App Service의 설정을 한 곳 추가하여 해결할 수 있었습니다.
이후에 제가 동작 확인한 순서를 기재합니다.

NestJS 초기화

NestJS를 초기화하려면 다음 명령을 실행합니다.

> npm i -g @nestjs/cli
> nest new websrv

실행 후 다음과 같은 websrv 폴더가 생성됩니다.

+---websrv
    +---node_modules
    +---src
        \---main.ts
    \---test

NestJS 소스 수정

src/main.ts 를 수정합니다.

src/main.ts

import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);

  // 元のソースコード
  // await app.listen(3000);

  // 追加したソースコード
  // Azure App Serviceはポート8080を利用する。
  // ポート番号は環境変数PORTで定義されているようなので、
  // 環境変数PORTを優先して利用するように修正する。
  const port = process.env.PORT || 3000;
  await app.listen(port);
}
bootstrap();

빌드

소스를 수정했으면 빌드합니다.

> npm run build

Azure App Service 만들기

배포할 Azure App Service을 만듭니다.
생성 후 구성 -> 일반 설정 -> 시작 명령으로 node dist/main를 설정합니다.

2021-08-12 추가: 시작 명령으로 설정하는 것 외에도 package.json start 스크립트를 nest start에서 node dist/main로 변경할 수 있습니다.

배포

VSCode 플러그인 "Azure App Service for Visual Studio Code"을 사용하여 배포합니다.
구체적인 절차는 "Deploy to Azure(Azure에 배포)"을 참조하십시오.

동작 확인

브라우저에서 Azure App Service URL을 열면 성공했습니다!