[Typescript] typescript에서 express의 request를 확장해서 사용하는 방법

express + typescript 환경 사용중에 express의 requset에 임의의 객체를 추가해야 하는 상황이 생겼다.

request 객체를 확장해서 객체를 추가하고 타입도 추론되게 만들어보자.

 

환경

typescript: 4.4.3
express: 4.x

 

Request 확장

typescript 환경에서 Express 사용시 Request는 아래와 같은 방식으로 확장할 수 있다.

request 객체 안에서 사용될 객체를 아래 문법을 사용해서 app.ts 최상단에 선언한다.

declare global {
  namespace Express {
    export interface Request {
      test?: string
    }
  }
}

이제 Request안에서 test라는 커스텀 객체를 사용할 수 있다.

실제로 타입추론이 되는지 확인해보자

 

app.get('/test',(req, res, next) => {
  const test = req.test; // string | undefined
});

 

 

정상적으로 타입추론이 되고 req 객체안에 들어가 있는걸 확인할 수 있다.

 

 

중첩 객체

만약 한단계 더 중첩을 하고 싶다면 아래와 같은 방식을 사용하면 된다.

declare global {
  namespace Express {
    export interface Request {
      test: {
        innerTest?: number;
        innerTest2?: string;
      };
    }
  }
}

마찬가지로 타입 확장을 해준 후 test 객체 안의 innerTest와 innerTest2가 있다.

이 때 test가 undefined인 상태로 test에 추가하면 에러가 발생하므로 아래 미들웨어를 장착해서 해결해주자.

 

app.use((req, res, next) => {
  req.test = {};
  next();
});

req.test의 객체를 빈 객체로 초기화 해준후 다음 미들웨어로 보내준다. 그 다음 아래와 같은 방식으로 사용할 수 있다.

 

app.get('/test', (req, res, next) => {
  const { innerTest, innerTest2 } = req.test;
});

 

타입이 제대로 잡히는 것을 확인할 수 있다.