[Node.js] 로그인시 JWT생성

2022. 8. 9. 22:59·개발/node.js
728x90
반응형

1. JWT

Json Web Token의 줄임말로 두개체의 JSON객체를 사용해서 정보를 안정성 있게 전달해준다.

JWT는 사용할 정보를 자체적으로 가지고 있다.(우리가 필요한 것들)

JWT로 발급한 토큰은 기본정보(유저의 정보 프로필)

그리고 토큰이 정상인지 검증된 토큰 signature(서명)을 포함하고 있다.

 

웹서버는 http의 헤더에 넣어서 전달 가능

url params 파라미터로도 전달가능하다.

 

JWT는 주로 로그인이 정상적인지 회원 인증 권한에서 사용한다.

JWT는 유저가 로그인을 요청하면 서버는 유저의 정보를 가지고 정상적인 유저면 토큰을 발급해서 전달해준다.

유저가 서버에 요청할때마다 JWT를 포함해서 전달하면 서버가 클라이언트의 요청을 

받을때마다 해당 토큰이 정상적인지 확인후 정상적이라면 클라이언트가 요청한 작업을 응답한다.

서버는 유저의 세션을 유지할 필요가 없고 유저가 로그인 되었는지 확인할 필요가 없다.

요청했을때만 토큰을 확인해서 처리하기 때문에 서버 자원을 아낄수 있다.

 

JWT쓰는 이유는 안정성인데 자체적으로 암호화를 해서 주고받기 때문에 안정성이 있다.

JWT를 사용하면 JWT의 패키지가 자동으로 인코딩과 해싱 작업을 지원해 준다.

 

2. HMAC SHA256 인코딩 및 해싱

HMAC : 해싱 기법을 적용해서 메시지의 위변조를 방지하는 기법

SHA256 : 임의의 길이 메시지를 256비트의 축약된 메시지로 만들어내는 해시 알고리즘

 

3. JWT의 구조

토큰의 정보

header = {
  alg: "HS256",
  typ: "JWT",
};
payload = {
  //토큰의제목
  sub: "4151533",
  //유저의 이름
  name: "sjsiejfli",
  //토큰이 발급된 시간 - 발급된지 얼마나 지났는지
  lat: "11343153",
};
signature = HMACSHA256(BASE64URL(header) + BASE64URL(payload));

(1) header : 타입과 알고리즘의 정보를 가지고 있다.

(2) payload : 유저의 정보들과 만료기간 객체를 가지고 있다.

(3) signature : header, payload를 인코딩하고 합쳐서 비밀키로 해쉬

 

4. 사용

(1) HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    페이지확인용
    <form action="/login" method="post">
      <button>로그인</button>
    </form>
  </body>
</html>

(2) JS

const express = require("express");
const app = express();
const fs = require("fs");
const bodyParser = require("body-parser");
const jwt = require("jsonwebtoken");
const { allowedNodeEnvironmentFlags } = require("process");
const PORT = 3000;

app.listen(PORT, () => {
  console.log("server start");
});

app.get("/", (req, res) => {
  fs.readFile("index.html", "utf-8", (err, data) => {
    res.send(data);
  });
});

app.post("/login", (req, res) => {
  //로그인하면 토큰 발급
  // 토큰을 만들어 보자
  // 우리가 지금은 넘길 정보가 없으니까 변수로 만들기
  // .env파일을 쓰는 이유 데이터 유출을 막기 위해
  // env사용할때 설치할 모듈 dotenv
  const dot = require("dotenv");
  dot.config();
  // 애플리케이션이 실행될때 처음부터 특정 값을 넘길 변수를 저장해놓는다.
  const name = "ejrijf",
    profile = "djfiadjf",
    key = process.env.KEY;

  // jwt 토큰 생성하는 함수 반환값 있음
  let token = jwt.sign(
    {
      //타입 JWT임
      type: "JWT",
      //유저 이름
      name,
    },
    //암호화
    key,
    {
      //토큰 유효 만료될 시간 5분
      expiresIn: "5m",
      // 토큰을 발급한 사람
      issuer: "Me",
    }
  );
  let data = {
    msg: "token msg",
    token,
  };
  res.send(JSON.stringify(data));
});

5. express session

session 과 JWT는 주머니와 영화표라고 생각하면된다.

JWT를 안전하게 보관하기 위해 session에 넣어서 보관한다.

JWT는 안전을 위해 다시한번 자체적으로 암호화를 시킨다.

 

6. session 사용

const app = require("express")(),
  fs = require("fs"),
  jwt = require("jsonwebtoken"),
  PORT = 4000,
  dot = require("dotenv"),
  session = require("express-session"),
  FileStore = require("session-file-store")(session);

dot.config();

//설치할 모듈
// express-session
// 저장된 세션의 정보를 파일로 보기 위해서
// session-file-store
app.listen(PORT, () => {
  console.log("server start");
});

app.use(
  session({
    // 세션을 발급할때 사용되는 키 소스코드 노출 안되게 하자
    secret: "sadjfidsaf",
    //세션을 저장하고 불러올때 다시 저장할지 여부
    resave: false,
    // 세션에 저장할때 초기화 여부
    saveUninitialized: true,
    // 저장소를 만들지 여부
    store: new FileStore(),
  })
);

app.get("/", (req, res) => {
  if (!req.session.key) {
    req.session.key = "gdgdajiid";
  }
  res.send(`key: ${req.session.key}`);
});

app.get("/shop", (req, res) => {
  res.send(`난 샵${req.session.key}`);
});
728x90
반응형

'개발 > node.js' 카테고리의 다른 글

[Node.js] exports router  (0) 2022.08.10
[Node.js] 로그인시 jwt과 session  (0) 2022.08.09
[Node.js] 채팅, 귓속말 기능 만들기  (0) 2022.07.29
[Node.js, jquery] 비행기 예약 시스템 만들기  (0) 2022.07.29
[Node.js] socket.io 로 채팅방 만들기  (0) 2022.07.26
'개발/node.js' 카테고리의 다른 글
  • [Node.js] exports router
  • [Node.js] 로그인시 jwt과 session
  • [Node.js] 채팅, 귓속말 기능 만들기
  • [Node.js, jquery] 비행기 예약 시스템 만들기
TeTedo.
TeTedo.
  • TeTedo.
    TeTedo 개발 일기
    TeTedo.
  • 전체
    오늘
    어제
    • 분류 전체보기 (319)
      • 개발 (274)
        • Article (4)
        • 정리 (21)
        • Spring Boot (17)
        • JPA (2)
        • JAVA (6)
        • Database (4)
        • 자료구조 (11)
        • 알고리즘 (32)
        • React (20)
        • Docker (10)
        • node.js (18)
        • Devops (11)
        • Linux (4)
        • TypeScript (3)
        • Go (10)
        • HyperLedger (4)
        • BlockChain (43)
        • html, css, js (48)
        • CS (3)
        • AWS (3)
      • 모아두고 나중에 쓰기 (3)
      • 팀프로젝트 (18)
        • SNS(키보드워리어) (9)
        • close_sea (9)
      • 개인프로젝트 (1)
        • Around Flavor (1)
        • CHAM (13)
        • ethFruitShop (5)
      • 독서 (0)
        • 스프링부트와 AWS로 혼자 구현하는 웹 서비스 (0)
  • 블로그 메뉴

    • 홈
    • 개발일기
    • CS
    • 실습
    • 코딩테스트
    • 웹
    • Go
    • node.js
    • 팀플
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    30일챌린지
    ERC721
    mysql
    React
    node.js
    nodejs
    30일 챌린지
    컨테이너
    erc20
    js
    go언어
    도커
    명령어
    프로그래머스
    node
    블록체인
    go
    하이퍼레저
    CSS
    html
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.1
TeTedo.
[Node.js] 로그인시 JWT생성
상단으로

티스토리툴바