Next.js 개발 중, MongoDB 중복 접속 방지 TS 코드

src/util/database.ts
경로에 다음의 코드를 작성해두고 사용하자(근데 다른데 둬도 상관은 없당)

.env.local 에 아래의 값을 넣어주자
MONGODB_URI="몽고DB 접속url"

import { MongoClient } from "mongodb";

if (!process.env.MONGODB_URI) {
  throw new Error("Please add your Mongo URI to .env.local");
}

const uri: string = process.env.MONGODB_URI;
let client: MongoClient;
let clientPromise: Promise<MongoClient>;

if (process.env.NODE_ENV === "development") {
  // In development mode, use a global variable so that the value
  // is preserved across module reloads caused by HMR (Hot Module Replacement).

  let globalWithMongoClientPromise = global as typeof globalThis & {
    _mongoClientPromise: Promise<MongoClient>;
  };

  if (!globalWithMongoClientPromise._mongoClientPromise) {
    client = new MongoClient(uri);
    globalWithMongoClientPromise._mongoClientPromise = client.connect();
  }

  clientPromise = globalWithMongoClientPromise._mongoClientPromise;
} else {
  // In production mode, it's best to not use a global variable.
  client = new MongoClient(uri);
  clientPromise = client.connect();
}

// Export a module-scoped MongoClient promise. By doing this in a
// separate module, the client can be shared across functions.
export default clientPromise;

 

ts 가 아니라 js 사용 시는 아래의 코드를 사용하면 된다
아래 코드에서는 env 파일에서 db접속url 을 받고 있지는 않지만,
아래 예시보다는 위의 ts 코드처럼 db접속url을 따로 env 에 넣어서 불러오는 것이 좋을 것이다 (물론 선택이긴 하다)

import { MongoClient } from 'mongodb'
const url = 'DB접속URL'
const options = { useNewUrlParser: true }
let connectDB

if (process.env.NODE_ENV === 'development') {
  if (!global._mongo) {
    global._mongo = new MongoClient(url, options).connect()
  }
  connectDB = global._mongo
} else {
  connectDB = new MongoClient(url, options).connect()
}
export { connectDB }

 

참고 링크는 아래와 같다

https://stackoverflow.com/questions/70766870/next-js-with-mongodb-convert-to-typescript

Next.js with-mongodb convert to TypeScript