Node.js에서 보안 인증 마스터하기: bcrypt.js 및 JWT를 사용한 로그인/로그아웃

출시를 앞두고 있는 웹 애플리케이션을 구축하고 있다고 상상해 보세요. 사용자 인터페이스를 세심하게 디자인하고 흥미로운 기능을 추가했으며 모든 것이 원활하게 실행되도록 했습니다. 그러나 출시 날짜가 가까워질수록 보안에 대한 걱정이 앞서기 시작합니다. 구체적으로, 올바른 사용자만 애플리케이션의 올바른 부분에 액세스할 수 있도록 하는 방법입니다. 여기서 인증이 들어갑니다.

인증은 사용자가 누구인지 확인하는 과정으로, 웹 개발에 있어서 중요한 부분입니다. 광대한 디지털 환경에서는 사용자가 애플리케이션에 안전하게 로그인하고 로그아웃할 수 있도록 보장하는 것이 무엇보다 중요합니다. 한 번 실수하면 앱이 공격에 취약해 사용자 데이터가 위험해질 수 있습니다.

소개

이 기사에서는 bcrypt.js를 사용하여 비밀번호를 해시하고 JWT 토큰을 사용하여 사용자 세션을 관리하는 Node.js의 보안 인증을 살펴보겠습니다. 마지막에는 강력한 로그인/로그아웃 시스템을 구현하여 사용자 데이터를 안전하게 유지하는 방법을 확실하게 이해하게 될 것입니다.

이제 환경 설정부터 JWT를 통한 경로 확보까지 방탄 인증 시스템 구축을 위한 여정을 시작해 보겠습니다. Node.js 앱을 잠글 준비가 되셨나요? 시작해 보세요.

Node.js 프로젝트 환경 설정

먼저 npm init -y를 사용하여 Node.js 프로젝트를 초기화합니다. 그러면 기본 설정으로 package.json 파일이 생성됩니다. 다음으로 필수 패키지를 설치합니다. 서버 설정을 위한 express, MongoDB 관리를 위한 mongoose, JWT 토큰 처리를 위한 jsonwebtoken, 비밀번호 해싱을 위한 bcryptjs, 환경 변수를 위한 dotenv, Cross-Origin Resource Sharing 활성화를 위한 cors, 쿠키 구문 분석을 위한 cookie-parser. 마지막으로 nodemon을 개발 종속성으로 추가하여 코드가 변경되면 서버를 자동으로 다시 시작합니다.

1.`npm init -y`
2.`npm install express mongoose jsonwebtoken bcryptjs dotenv cors cookie-parser`
3.`npm install nodemon -D`

이제 package.json 파일을 수정하세요. 내 코드 및 유형과 같은 스크립트를 추가하세요.

"scripts": {
    "dev": "nodemon backend/index.js",
    "start": "node backend/index.js"
  },
"type": "module",

기본 서버 설정

다음으로 기본 Express 서버를 설정하겠습니다. index.js 라는 파일을 만듭니다. 이 코드는 Express를 초기화하고 애플리케이션의 인스턴스를 생성합니다. 그런 다음 들어오는 HTTP GET 요청을 처리하기 위해 루트 URL("/")에 대한 경로를 정의합니다. 그런 다음 포트 8000에서 서버를 시작하여 들어오는 요청을 수신할 수 있습니다.

import express from "express";
const app = express();

app.get("/", (req, res) => {
  res.send("Server is ready");
});

app.listen(8000, () => {
  console.log("Server is running on PORT 8000");
});

기본 인증 경로 설정

이제 'routes'라는 폴더를 만들고 그 폴더에 authRoute.js라는 새 파일을 만들고 아래 코드를 붙여넣어 기본 경로를 살펴보겠습니다.

이 코드 조각에서는 Express를 사용하여 다양한 인증 엔드포인트에 대한 경로를 설정합니다. 먼저 Express 라이브러리를 가져오고 새 라우터 인스턴스를 만듭니다. 그런 다음 /signup, /login 및 /logout의 세 가지 GET 경로를 정의합니다. 각각은 해당 엔드포인트에 도달했음을 나타내는 JSON 개체로 응답합니다. 마지막으로 라우터 인스턴스를 기본 내보내기로 내보내 애플리케이션의 다른 부분에서 사용할 수 있도록 합니다.

1.`npm init -y`
2.`npm install express mongoose jsonwebtoken bcryptjs dotenv cors cookie-parser`
3.`npm install nodemon -D`

이제 끝점을 테스트하기 위해 인증 경로를 추가하는 index.js를 변경하세요.

"scripts": {
    "dev": "nodemon backend/index.js",
    "start": "node backend/index.js"
  },
"type": "module",

이제 브라우저에서 테스트할 수 있지만... 저는 편의상 Postman을 사용하겠습니다. 이렇게 모든 엔드포인트를 테스트할 수 있습니다.

마찬가지로 로그아웃 및 가입과 같은 다른 경로도 볼 수 있습니다.

이제 기본 앱이 준비되었습니다. 이제 강력하고 적절한 인증 시스템을 만들어 보세요.

Mongoose 스키마를 사용하여 사용자 모델 생성

이제 먼저 mongoDB 데이터베이스를 준비하세요. 이를 수행하려면 Model 폴더를 만들고 그 아래에 User.js 파일을 만들고 이 파일에 mongoDB 데이터베이스의 사용자에 대한 Mongoose 스키마와 모델을 추가합니다. 스키마에는 사용자 이름, 전체 이름, 비밀번호 및 이메일에 대한 필드가 포함되어 있으며 각 필드에는 고유성 및 필수 상태와 같은 지정된 데이터 유형 및 제약 조건이 있습니다. 비밀번호 필드의 길이도 최소 6자입니다.

import express from "express";
const app = express();

app.get("/", (req, res) => {
  res.send("Server is ready");
});

app.listen(8000, () => {
  console.log("Server is running on PORT 8000");
});

Mongoose를 사용하여 MongoDB에 연결

이제 데이터베이스에 연결해 보겠습니다. db라는 폴더를 만들고 그 안에 connectDB.js라는 파일을 만듭니다. 이 파일에서는 Mongoose를 사용하여 MongoDB 데이터베이스에 연결을 시도하는 비동기 함수 connectMongoDB를 정의합니다. MONGO_URI 환경 변수에서 데이터베이스 연결 문자열을 가져옵니다. 연결이 성공하면 호스트 이름과 함께 성공 메시지가 기록됩니다. 실패하면 오류를 기록하고 상태 코드 1로 프로세스를 종료합니다. 함수는 애플리케이션의 다른 부분에서 사용하기 위해 내보내집니다.

import express from "express";

// Create a new Express router instance
const router = express.Router();

// Define a GET route for the signup endpoint
router.get("/signup", (req, res) => {
  // Return a JSON response indicating that the signup endpoint was hit
  res.json({
    data: "You hit signup endpoint",
  });
});

// Define a GET route for the login endpoint
router.get("/login", (req, res) => {
  // Return a JSON response indicating that the login endpoint was hit
  res.json({
    data: "You hit login endpoint",
  });
});

// Define a GET route for the logout endpoint
router.get("/logout", (req, res) => {
  // Return a JSON response indicating that the logout endpoint was hit
  res.json({
    data: "You hit logout endpoint",
  });
});

// Export the router instance as the default export
export default router;

이제 MONGO_URI를 사용하려면 .env 파일로 만들어야 합니다. 여기서는 로컬 mongoDB 설정 연결 문자열을 사용했습니다. 원한다면 mongoDB 아틀라스를 사용할 수도 있습니다.

import express from "express";
import authRoute from "./routes/authRoutes.js";
const app = express();

app.get("/", (req, res) => {
  res.send("Server is ready");
});

app.use("/api/auth", authRoute);

app.listen(8000, () => {
  console.log("Server is running on PORT 8000");
});

회원가입 기능

이제 회원가입 기능을 만들어 보세요. 이를 위해 먼저 폴더 컨트롤러를 만들고 거기에 authController.js
파일을 만듭니다.

import mongoose from "mongoose";

// Define the User schema with various fields and their data types
const userSchema = new mongoose.Schema(
  {
    // The unique username of the user
    username: {
      type: String,
      required: true,
      unique: true,
    },
    fullName: {
      type: String,
      required: true,
    },
    // The password of the user (min length: 6)
    password: {
      type: String,
      required: true,
      minLength: 6,
    },
    // The email of the user (unique)
    email: {
      type: String,
      required: true,
      unique: true,
    },
  },
  { timestamps: true }
);

// Create the User model based on the userSchema
const User = mongoose.model("User", userSchema);

// Export the User model
export default User;

먼저 요청 본문에서 전체 이름, 사용자 이름, 이메일, 비밀번호를 추출합니다. 정규식을 사용하여 이메일 형식의 유효성을 검사하고 형식이 유효하지 않은 경우 400 상태를 반환합니다.

다음으로 이 함수는 사용자 이름이나 이메일이 데이터베이스에 이미 존재하는지 확인합니다. 둘 중 하나를 선택하면 오류 메시지와 함께 400 상태가 반환됩니다. 또한 비밀번호가 6자 이상인지 확인하고 이 조건이 충족되지 않으면 또 다른 400 상태를 보냅니다.

그런 다음 비밀번호는 bcrypt를 사용하여 안전하게 해시됩니다. 제공된 데이터로 새 사용자 인스턴스가 생성되어 데이터베이스에 저장됩니다.

저장 후 함수는 JWT 토큰을 생성하여 쿠키로 설정하고 사용자 ID, 이름, 사용자 이름 및 이메일과 함께 201 상태를 반환합니다. 오류가 발생하면 기록되며 "내부 서버 오류" 메시지와 함께 500 상태가 전송됩니다.

이 기능을 활성화하려면 다음을 가져와야 합니다

1.`npm init -y`
2.`npm install express mongoose jsonwebtoken bcryptjs dotenv cors cookie-parser`
3.`npm install nodemon -D`

뭔가 눈치채셨나요? generateTokenAndSetCookie라는 새로운 기능...코드를 살펴보겠습니다. utils 폴더를 만들고 거기에서 generateTokenAndSetCookie.js를 만듭니다.

"scripts": {
    "dev": "nodemon backend/index.js",
    "start": "node backend/index.js"
  },
"type": "module",

**generateTokenAndSetCookie **함수는 JWT를 생성하고 이를 사용자 인증을 위해 쿠키에 저장합니다.

JWT세대:

이 함수는 jsonwebtoken 라이브러리를 사용하여 JWT를 생성합니다. 사용자 ID와 비밀 키(환경 변수의 JWT_SECRET)로 토큰에 서명하고 15일 후에 만료되도록 설정합니다.

쿠키 설정:

토큰은 사용자 브라우저의 쿠키에 저장됩니다. 쿠키는 여러 보안 속성으로 구성됩니다.

• maxAge: 쿠키의 수명을 15일로 설정합니다.
• httpOnly: JavaScript를 통해 쿠키에 액세스할 수 없도록 하여 XSS(Cross-Site Scripting) 공격으로부터 보호합니다.
• sameSite: "strict": 쿠키가 동일한 사이트의 요청에만 전송되도록 제한하여 CSRF(Cross-Site Request Forgery) 공격을 방지합니다.
• 보안: 개발 환경이 아닌 경우 쿠키가 HTTPS를 통해서만 전송되도록 보장하여 보안 계층을 추가합니다.

따라서 이 기능은 사용자 세션의 보안과 지속성을 보장하여 인증 프로세스의 중요한 부분이 됩니다.

여기서 .env에 또 다른 환경 변수 JWT_SECRET를 추가해야 합니다. 이와 같이 숫자와 문자열을 혼합하여 어떤 유형이든 추가할 수 있습니다.

import express from "express";
const app = express();

app.get("/", (req, res) => {
  res.send("Server is ready");
});

app.listen(8000, () => {
  console.log("Server is running on PORT 8000");
});

이제 가입 기능이 완료되었습니다..지금 바로 경로를 만들어 보세요.

import express from "express";

// Create a new Express router instance
const router = express.Router();

// Define a GET route for the signup endpoint
router.get("/signup", (req, res) => {
  // Return a JSON response indicating that the signup endpoint was hit
  res.json({
    data: "You hit signup endpoint",
  });
});

// Define a GET route for the login endpoint
router.get("/login", (req, res) => {
  // Return a JSON response indicating that the login endpoint was hit
  res.json({
    data: "You hit login endpoint",
  });
});

// Define a GET route for the logout endpoint
router.get("/logout", (req, res) => {
  // Return a JSON response indicating that the logout endpoint was hit
  res.json({
    data: "You hit logout endpoint",
  });
});

// Export the router instance as the default export
export default router;

좋아요, 이제 index.js를 수정해 보겠습니다. 여기에 몇 가지 새로운 가져오기를 추가했습니다. dotenv: .env에서 환경 변수를 안전하게 로드합니다. express.json(): 들어오는 JSON 요청을 구문 분석합니다. express.urlencoded({ Extended: true }): URL로 인코딩된 데이터를 구문 분석합니다. cookieParser: JWT 토큰용 쿠키를 처리합니다. connectMongoDB(): 데이터 저장을 위해 MongoDB에 연결합니다. 경로: /api/auth는 가입, 로그인 및 로그아웃을 관리합니다.

index.js의 업데이트된 코드는 다음과 같습니다

1.`npm init -y`
2.`npm install express mongoose jsonwebtoken bcryptjs dotenv cors cookie-parser`
3.`npm install nodemon -D`

그래요. 이제 Postman의 가입 기능을 테스트할 차례입니다. 작동하는지 아닌지 확인해 보세요.

그럼 결과는 이렇습니다.

여기서 제대로 작동하는 것을 볼 수 있으며 mongoDB 데이터베이스도 확인할 수 있습니다.

로그인 기능

이제 로그인 기능을 만들어 보세요. authController.js 파일로 다시 이동해 보겠습니다

"scripts": {
    "dev": "nodemon backend/index.js",
    "start": "node backend/index.js"
  },
"type": "module",

로그인 컨트롤러는 사용자 이름과 비밀번호를 확인하여 사용자를 인증합니다. 먼저 사용자 이름을 사용하여 데이터베이스에서 사용자를 검색합니다. 발견되면 bcrypt를 사용하여 데이터베이스에 저장된 해시된 비밀번호와 제공된 비밀번호를 비교합니다. 사용자 이름이나 비밀번호가 올바르지 않으면 오류 응답을 반환합니다. 확인에 성공하면 JWT 토큰을 생성하고 generateTokenAndSetCookie를 사용하여 이를 쿠키로 설정한 후 사용자가 성공적으로 로그인했음을 나타내는 성공 메시지로 응답합니다.

authRoutes.js에 로그인 경로를 추가해 보겠습니다

import express from "express";
const app = express();

app.get("/", (req, res) => {
  res.send("Server is ready");
});

app.listen(8000, () => {
  console.log("Server is running on PORT 8000");
});

Postman에서 테스트해 보겠습니다.

여기에서 로그인이 성공적으로 표시되는 것을 볼 수 있습니다.

로그아웃 기능

알겠습니다. 이제 마지막 기능, 즉 로그아웃 기능입니다. 이것을 구현해 봅시다. 꽤 간단합니다.

import express from "express";

// Create a new Express router instance
const router = express.Router();

// Define a GET route for the signup endpoint
router.get("/signup", (req, res) => {
  // Return a JSON response indicating that the signup endpoint was hit
  res.json({
    data: "You hit signup endpoint",
  });
});

// Define a GET route for the login endpoint
router.get("/login", (req, res) => {
  // Return a JSON response indicating that the login endpoint was hit
  res.json({
    data: "You hit login endpoint",
  });
});

// Define a GET route for the logout endpoint
router.get("/logout", (req, res) => {
  // Return a JSON response indicating that the logout endpoint was hit
  res.json({
    data: "You hit logout endpoint",
  });
});

// Export the router instance as the default export
export default router;

로그아웃 컨트롤러는 res.cookie를 사용하여 클라이언트 브라우저에서 JWT 쿠키를 삭제하고 값을 빈 문자열로 설정하고 maxAge를 0으로 설정하여 즉시 만료되도록 하여 사용자를 안전하게 로그아웃시킵니다. 쿠키가 성공적으로 삭제되면 사용자가 성공적으로 로그아웃되었음을 나타내는 메시지와 함께 성공 응답을 보냅니다. 이 과정에서 오류가 발생하면 오류를 포착하여 기록하고 내부 서버 오류 응답을 반환합니다.

authRoute.js에 이 경로를 추가하세요

import express from "express";
import authRoute from "./routes/authRoutes.js";
const app = express();

app.get("/", (req, res) => {
  res.send("Server is ready");
});

app.use("/api/auth", authRoute);

app.listen(8000, () => {
  console.log("Server is running on PORT 8000");
});

알겠습니다. 마지막 기능이 제대로 작동하는지 테스트해 보겠습니다.

오!…매우 잘 작동하고 있어요. ??

이제 이 인증에 대한 완전한 백엔드가 준비되었습니다. ??

내 npm 패키지

모든 것을 직접 코딩하고 싶지 않고 빠른 해결 방법을 원한다면 auth0_package라는 npm 패키지를 만들었습니다. 여기에서 받으실 수 있습니다.

Github 저장소

여기 이 Github 저장소에서 위의 모든 코드를 얻을 수 있습니다.

이제 백엔드 애플리케이션이 완료되었습니다. 다음 블로그에서는 이를 프런트엔드와 통합하는 방법을 설명하겠습니다. 그러니 계속 지켜봐 주시기 바랍니다 ??.

결론

결론적으로, Node.js 애플리케이션에서 보안 인증을 구현하는 것은 사용자 데이터를 보호하고 승인된 사용자만 애플리케이션의 특정 부분에 액세스할 수 있도록 하는 데 매우 중요합니다. 비밀번호 해싱에 bcrypt.js를 사용하고 세션 관리에 JWT 토큰을 사용하면 강력한 로그인/로그아웃 시스템을 만들 수 있습니다. 이 접근 방식은 보안을 강화할 뿐만 아니라 원활한 사용자 경험을 제공합니다. MongoDB 데이터베이스를 설정하고 라우팅을 위해 Express를 사용하면 백엔드 인프라가 더욱 강화됩니다. 이러한 도구와 기술을 사용하면 웹 애플리케이션이 무단 액세스 및 잠재적인 보안 위협으로부터 잘 보호된다는 사실을 알고 자신있게 웹 애플리케이션을 시작할 수 있습니다.

위 내용은 Node.js에서 보안 인증 마스터하기: bcrypt.js 및 JWT를 사용한 로그인/로그아웃의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!