next.js에서 같은handler의 API 단점을 사용하는 팁

next.js에서 같은 단말기를 처리 프로그램으로 사용하면 좀 편리하다

용례1: URL을 변경하고 싶을 때

API의 URL을 변경하고 싶은데 후방 스와프를 유지하고 싶은 경우가 있죠.
리디렉션을 설정할 수도 있고 이용Custom Server할 수도 있지만 그 정도로 리디렉션을 하기 싫을 때 복사를 하기 싫을 때 사용할 수 있습니다.
예를 들어, 이러한 API가 /api/greet라고 가정합니다.

// /api/greet.ts

import { NextApiHandler } from "next"

const handler: NextApiHandler = async (req, res) => {
  const { name } = req.query
  res.statusCode = 200
  res.json(`Hello ${name}`)
}
export default handler

가령 그것을 /api/[name]/greet로 바꾸려고 한다면.
일단 새로운 API 쪽에서는 이렇게 합니다.

// /api/[name]/greet.ts
import { NextApiHandler } from "next"

// 利用可能なようにexportする
export const greetHandler: NextApiHandler = async (req, res) => {
  const { name } = req.query
  res.statusCode = 200
  res.json(`Hello ${name}`)
}

export default greetHandler

아래는 낡은 거예요.

// /api/greet.ts

import { NextApiHandler } from "next"
import greetHandler from "./[name]/greet"

export default greetHandler

호출 시 경고 메시지를 보내려면 그래도 되죠

const handler: NextApiHandler = (req, res) => {
  console.warn("Deprecated !")
  return greetHandler(req, res)
}

export default handler

용례 2: 관리자에게 고객용 API 제공

사용자에게 제공되는 API는 Admin 도구에서도 사용할 수 있습니다.
여기에 내부 논리까지 공통화하면 더 예쁘기 때문에 활약할 기회가 없을 수도 있지만 가끔은 편할 때도 있다

// /api/user/something.ts

import { NextApiHandler } from "next"

const handler: NextApiHandler = (req, res) => {
  const { name } = req.query
  res.statusCode = 200
  res.json(`Hello ${name}`)
}

export default userAuthorization(handler)

Admin에 인증을 변경하면 이런 경우죠.

// /api/admin/something.ts

import { NextApiHandler } from "next"
import { somethingHandler } from "../user/something"

export default adminAuthorization(somethingHandler)

인증된 사용자 ID를 사용하려는 경우

만약에 방문한 사용자의 정보를 다시 이용한다면 이런 경우죠.

// /api/user/something.ts
import { NextApiHandler, NextApiRequest, NextApiResponse } from "next"

type UserAuthorizedNextApiHandler<T = any> = (req: NextApiRequest, res: NextApiResponse<T>, authorizedUserId: string) => void | Promise<void>

export const somethingHandler: UserAuthorizedNextApiHandler = (req, res, userId) => {
  const resource = getSomething(userId)
  res.statusCode = 200
  res.json(resource)
}

export default userAuthorization(somethingHandler)

Admin에서 쿼리나 무언가로 userId를 받고 돌아옵니다.

// /api/admin/something.ts
import { NextApiHandler } from "next"
import { somethingHandler } from "../user/something"

const handler: NextApiHandler = (req, res) => {
  const { userId } = req.query
  return somethingHandler(req, res, userId)
}

export default adminAuthorization(somethingHandler)

여기까지만 하면handler에서 진행하지 않고 논리를 재사용하는 것이 타당할 수 있다