ABOUT ME

-

  • [ Next ] MongoDB 연결
    Front/Next 2025. 9. 27. 23:57
    반응형

    db를 사용하기 위해 간단한 정보를 저장할 것이기에 무료 클라우드 DB인 mongoDB를 사용하기로 했다.

     

     


    Installment

    우선 mongoDB를 사용하기 위해 mongoDB라이브러리를 설치

    npm install mongodb

    Initalized

    mongoDB 페이지를 에서 connect 버튼을 누르면 connect정보를 준다.

     

    이를 .env.local에 환경변수를 등록

     

    이때 env.local에 환경변수를 저장할때는 따옴표 안에 넣어서 사용 이상하게 따옴표안에 안넣으면 계속 DB연결에서 오류가 발생했다.

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

    이후 mongoDB util파일을 만든다.

    이는 매번 DB를 호출할때 DB를 연결을 하지 않기 위해서

    처음 실행했을때 해당 유틸이 실행되면서 client instatnce에 연결정보를 저장하고 이를 가져다만 쓰면 쉽게 db 접속이 가능하다.

    import { MongoClient } from "mongodb";
    
    const uri = process.env.MONGO_URI!;
    const options = {};
    
    let client: MongoClient;
    
    if (!globalThis._mongoClientPromise) {
        client = new MongoClient(uri, options);
        globalThis._mongoClientPromise = client.connect();
    }
    
    const clientPromise = globalThis._mongoClientPromise;
    
    export default clientPromise;

    Useage

    간단하게 로그인 api를 호출해서 테스트를 해보았다.

    우선 api에 로그인 아이디와 비밀번호 입력값을 보내주어 이를 통해 db에서 해당 데이터를 찾곡 난후 bcrypt로 인코딩된 비밀번호를 비교해서 정상적인지 아닌지 판단한 후 로그인을 처리

    export async function POST(request: Request) {
        const {username, password} = await request.json()
    
        const  client = await clientPromise
        const db = client.db("camp")
    
        const user = await db.collection("user").findOne({username})
        if(!user) {
            return NextResponse.json({error: 'User not found'})
        }
    
        const isMatch = await bcrypt.compare(password,user.password)
        if(!isMatch) {
            return NextResponse.json({error: 'Invalid password'})
        }
    
        return NextResponse.json({success: true, user: user})
    }

     

    이후 클라이언트 쪽에서는 fetch를 통해 해당 api를 호출하며 아이디와 비밀번호를 전달해준다.

    const onClickLogin = async () => {
          const res = await fetch("/api/auth/login", {
              method: "POST",
              body: JSON.stringify({username, password}),
              headers: { "Content-Type": "application/json" },
          })
    
          const data = await res.json()
    
        }

     

    그러면 로그인이 정상적으로 되는 것을 확인할 수 있다.

     

    728x90
    반응형