[노드 2] 10장. 웹 API 서버 만들기

23-24/Node.js 2

by _도담 2023. 12. 22. 10:00

728x90

🌟10장 키워드🌟

라우터

JWT

토큰

서버

시크릿키

10장 웹 API 서버 만들기

10.1 API 서버 이해하기

API: Application Programming Interface. 다른 애플리케이션에서 현재 프로그램의 기능 사용 가능하게 하는 접점

웹 API: 다른 웹 사버스의 기능을 사용하거나 자원을 가져올 수 있는 창구.

제한: 사용자의 인증 유무, 가져간 횟수 등을 기준으로 제한을 둘 수 있음.

웹 API 서버: 서버에 API를 올려서 URL을 통해서 접근할 수 있게 만든 것.

크롤링: 웹사이트가 자체적으로 제공하는 API가 없거나, 이용에 제한에 있을 때 사용하는 방법. 웹 사이트의 정보를 일정 주기로 수집해 자체적으로 가공하는 기술. 하지만 웹사이트에서 직접 제공하는 API는 아님. 법적인 문제가 발생할 수 있음.

10.2 프로젝트 구조 갖추기

NodeBird 서비스와 데이터 베이스 공유. 프론트쪽 보다 데이터나 서비스를 이용하는 창구 쪽 집중.

인증받은 사용자로 하여금 서비스 게시글, 해시태그, 사용자 정보를 JSON형식으로 제공하도록 만들 것.

먼저 프로젝트를 진행할 폴더를 생성, package.json 파일을 생성합니다.

//package.json

{
  "name": "nodebird-api",
  "version": "0.0.1",
  "description": "NodeBird API 서버",
  "main": "app.js",
  "scripts": {
    "start": "nodemon app",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "Jimin",
  "license": "ISC",
  "dependencies": {
    "bcrypt": "^4.0.1",
    "cookie-parser": "^1.4.5",
    "dotenv": "^8.2.0",
    "express": "^4.17.1",
    "express-session": "^1.17.1",
    "morgan": "^1.10.0",
    "mysql2": "^2.1.0",
    "nunjucks": "^3.2.1",
    "passport": "^0.4.1",
    "passport-kakao": "1.0.0",
    "passport-local": "^1.0.0",
    "sequelize": "^5.21.7",
    "uuid": "^7.0.3"
  },
  "devDependencies": {
    "nodemon": "^2.0.3"
  }
}

이후 npm init으로 dependencies를 설치해도 되고, 코드를 복사해도 됩니다.

npm i 를 통해서 해당 패키지를 설치합니다.

대표사진 삭제

사진 설명을 입력하세요.

이후 config, models, passport 폴더와 내용물을 모두 복사해 이 json파일을 만든 곳에 붙여 넣습니다.

본 교재시 참고하라 주어진 깃허브를 애용합니다.

이미지 썸네일 삭제

GitHub - gilbutITbook/006982: Node.js 교과서

Node.js 교과서. Contribute to gilbutITbook/006982 development by creating an account on GitHub.

github.com

이후 views 폴더를 생성해 에러를 표시할 파일을 만들어줍니다.

퍼그, 기억하시나요?

// error.pug

h1= message
h2= error.status 
pre #{error.stack}

이후 views밖으로 나와 상위 폴더에 app.js파일을 생성합니다.

// app.js

const express = require('express');
const path = require('path');
const cookieParser = require('cookie-parser');
const passport = require('passport');
const morgan = require('morgan');
const session = require('express-session');
const nunjucks = require('nunjucks');
const dotenv = require('dotenv');

dotenv.config();
const authRouter = require('./routes/auth');
const indexRouter = require('./routes');
const { sequelize } = require('./models');
const passportConfig = require('./passport');

const app = express();
passportConfig();
app.set('port', process.env.PORT || 8002);
app.set('view engine', 'html');
nunjucks.configure('views', {
  express: app,
  watch: true,
});
sequelize.sync({ force: false })
  .then(() => {
    console.log('데이터베이스 연결 성공');
  })
  .catch((err) => {
    console.error(err);
  });

app.use(morgan('dev'));
app.use(express.static(path.join(__dirname, 'public')));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser(process.env.COOKIE_SECRET));
app.use(session({
  resave: false,
  saveUninitialized: false,
  secret: process.env.COOKIE_SECRET,
  cookie: {
    httpOnly: true,
    secure: false,
  },
}));
app.use(passport.initialize());
app.use(passport.session());

app.use('/auth', authRouter);
app.use('/', indexRouter);

app.use((req, res, next) => {
  const error =  new Error(`${req.method} ${req.url} 라우터가 없습니다.`);
  error.status = 404;
  next(error);
});

app.use((err, req, res, next) => {
  res.locals.message = err.message;
  res.locals.error = process.env.NODE_ENV !== 'production' ? err : {};
  res.status(err.status || 500);
  res.render('error');
});

app.listen(app.get('port'), () => {
  console.log(app.get('port'), '번 포트에서 대기중');
});

현재 포트 번호는 8002번입니다.

추후 만들 클라이언트인 nodebird-call 서버는 8003번 번호에서 실행됩니다.

도메인(인터넷 주소)을 추가합니다.

models파일에 domain.js 파일을 추가합니다.

// domain.js

const Sequelize = require('sequelize');

module.exports = class Domain extends Sequelize.Model {
  static init(sequelize) {
    return super.init({
      host: {
        type: Sequelize.STRING(80),
        allowNull: false,
      },
      type: {
        type: Sequelize.ENUM('free', 'premium'),
        allowNull: false,
      },
      clientSecret: {
        type: Sequelize.STRING(36),
        allowNull: false,
      },
    }, {
      sequelize,
      timestamps: true,
      paranoid: true,
      modelName: 'Domain',
      tableName: 'domains',
    });
  }

  static associate(db) {
    db.Domain.belongsTo(db.User);
  }
};

위에 있는 정보는 host(인터넷 주소), 도메인 종류(type), 클라이언트 비밀키(관리 유의)입니다.

그리고 validate라는 데이터 추가 검증 속성과

unknownType이라는 검증 메소드가 있습니다. free, premium 두 가지 외의 경우에는 에러가 발생합니다.

도메인 모델을 시퀄라이즈와 연결하는데 index.js파일은 아래와 같고

// index.js

const express = require('express');
const { v4: uuidv4 } = require('uuid');
const { User, Domain } = require('../models');
const { isLoggedIn } = require('./middlewares');

const router = express.Router();

router.get('/', async (req, res, next) => {
  try {
    const user = await User.findOne({
      where: { id: req.user && req.user.id || null },
      include: { model: Domain },
    });
    res.render('login', {
      user,
      domains: user && user.Domains,
    });
  } catch (err) {
    console.error(err);
    next(err);
  }
});

router.post('/domain', isLoggedIn, async (req, res, next) => {
  try {
    await Domain.create({
      UserId: req.user.id,
      host: req.body.host,
      type: req.body.type,
      clientSecret: uuidv4(),
    });
    res.redirect('/');
  } catch (err) {
    console.error(err);
    next(err);
  }
});

module.exports = router;

사용자 모델과 일대 다 관계를 가진 도메인 관계를 login.pug 파일에 작성해 줍니다.

// login.pug

doctype
html
    head
        meta(charset='utf-8')
    title NodeBird 로그인
    style.
        .input-group label {
            width: 200px;
            display: inline-block;
    }
    body
    if user && user.id
        span.user-name='안녕하세요!' + user.nick +'님'
        a(href='/auth/logout'): button 로그아웃
        fieldset
            legend 도메인 등록
            form(action='/domain' method='post')
            div
            label(for='type-free') 무료
            input#type-free(type='radio' name='type' value='free')
            label(for='type-premium') 프리미엄
            input#type-premium(type='radio' name='type' value='premium')
        div
            label(for='host') 도메인
            input#host(name='host' placeholder="ex) zerocho.com")
        button 저장
        table
            tr
            th 도메인 주소
            th 타입
            th 클라이언트 비밀키
        for domain in user.domains
            tr
                td= domain.host
                td= domain.type
                td= domain.clientSecret
    else
        form#login-form(action='/auth/login' method='post')
            h2 NodeBird 계정으로 로그인하세요.
            .input-group
                label(for='email') 이메일
                input#email(type='email' name='email' required autofocus)
            .input-group
                label(for='password') 비밀번호
                input#password(type='password' name='password' required)
            if loginError
                .error-message= loginError
            a(href='/join'): button#join(type='button') 회원가입
            button#login(type='submit') 로그인

이후에는 도메인을 등록하는 화면을 만듭니다. 아래와 같은 구조를 가집니다.

로그인 O -> 도메인 등록 화면

로그인 X -> 로그인 창

루트 라우터(Get /)와 도메인 등록 라우터(Post /domain)입니다. 루트 라우터는 접속 시 로그인 화면을 보여주고 도메인 등록 라우터는 폼으로부터 온 데이터를 도메인 모델에 저장합니다.

이에 대한 내용은 rountes 폴더 내 index.js파일에 저장합니다.

// index.js

const express = require('express');
const { v4: uuidv4 } = require('uuid');
const { User, Domain } = require('../models');
const { isLoggedIn } = require('./middlewares');

const router = express.Router();

router.get('/', async (req, res, next) => {
  try {
    const user = await User.findOne({
      where: { id: req.user && req.user.id || null },
      include: { model: Domain },
    });
    res.render('login', {
      user,
      domains: user && user.Domains,
    });
  } catch (err) {
    console.error(err);
    next(err);
  }
});

router.post('/domain', isLoggedIn, async (req, res, next) => {
  try {
    await Domain.create({
      UserId: req.user.id,
      host: req.body.host,
      type: req.body.type,
      clientSecret: uuidv4(),
    });
    res.redirect('/');
  } catch (err) {
    console.error(err);
    next(err);
  }
});

module.exports = router;

clientSecret을 uuid(범용 고유 식별자) 모듈을 통해 생성합니다. 고유한 문자열 부여가 목표입니다.

서버를 실행하고

http://localhost:8002/ 이 주소로 이동합니다.

NodeBird https://nodebird.com/ 앱의 아이디로 로그인해 들어가면 됩니다.

이미지 썸네일 삭제

NodeBird

dd님이 리트윗 하셨습니다. 2023.12.20 리 리액트마스터기원1일차 안녕하세요 :) =) 2023.12.20 d dd ddf 리액트마스터기원1일차님이 리트윗하셨습니다. 2023.12.17 제 제로초 5MB 이상 파일과 이름에 띄어쓰기 있는 이미지는 업로드되지 않습니다. 2023.12.17 리 리액트마스터기원1일차 안녕하세요 :) =) 2023.11.23 제 제로초 5MB 이상 파일과 이름에 띄어쓰기 있는 이미지는 업로드되지 않습니다. 2023.11.23 제 제로초 이미지 업로드 복구 테스트 111님이 리트윗하셨습니다. 2023....

nodebird.com

대표사진 삭제

사진 설명을 입력하세요.

대표사진 삭제

사진 설명을 입력하세요.

위와 같이 사이트에서 회원가입 후 게시글 작성이 가능하다.

이와 같은 계정을 이용해서 도메인을 등록할 수 있다.

클라이언트 비밀키는 랜덤 문자열이다.

10.3 JWT 토큰으로 인증하기

다른 클라이언트가 NodeBird API를 가져갈 수 있게 해야 하는 과정은 별도의 인증과정이 필요하다.

JWT는 JSON Web Token의 약어로 JSON 형식 데이터를 저장하는 토큰이다.

JWT의 구조는 아래 세 가지이다.

헤더: 토큰 종류, 해시 알고리즘 정보
페이로드: 토큰 내용물이 인코딩
시그니처: 토큰 변조 여부를 확인하는 문자열 -> JWT를 비밀키로 만든다.

시그니처는 숨길 필요가 없지만, 비밀키는 숨겨야 한다.

토큰 내용을 해석해 주는 사이트도 있다.

이미지 썸네일 삭제

JWT.IO

JSON Web Tokens are an open, industry standard RFC 7519 method for representing claims securely between two parties.

jwt.io

encode부분에 값을 넣으면 decode부분에서 내용을 알려준다. id, node, message 등의 정보도 보인다. 때문에 중요한 내용을 담으면 안 된다.

토큰은 내용이 들어있기 때문에 사용하는데, JWT 토큰은 비밀키를 모르면 변조를 할 수없다. 즉 내용물의 정보를 믿고 사용할 수 있다.

단점은 용량이 크고, 외부 노출 가능한 정보만 담을 수 있다는 점이다.

구분 기준은 비용이 될 수 있다.

랜덤 스트링으로 사용자 정보를 매번 조회하는 작업 vs 내용물이 들어있는 JWT 토큰 사용 작업

JWT 모듈 설치부터 시작해 이를 이용한 토큰 인증 과정 구현을 살펴보자

모듈을 아래의 명령어를 통해서 설치한다.

$ npm i jsonwebtoken

이후 API를 만들 것인데 이전에 진행한 것처럼, 새로운 nodebird 폴더를 생성한 후, 이 폴더에서 진행한다.

JWT 토큰을 발급받고 인증받아야 하는데 env 파일과 middlewares.js 파일을 생성한다.

// .env

COOKIE_SECRET=nodebirdsecret
KAKAO_ID=5d4daf57becfd72fd9c919882552c4a6
JWT_SECRET=jwtSecret

// middlewares.js

const jwt = require('jsonwebtoken');

exports.isLoggedIn = (req, res, next) => {
  if (req.isAuthenticated()) {
    next();
  } else {
    res.status(403).send('로그인 필요');
  }
};

exports.isNotLoggedIn = (req, res, next) => {
  if (!req.isAuthenticated()) {
    next();
  } else {
    res.redirect('/');
  }
};

exports.verifyToken = (req, res, next) => {   // 토큰 검증
  try {
    req.decoded = jwt.verify(req.headers.authorization, process.env.JWT_SECRET);
    return next();
  } catch (error) {  // 비밀키 일치 x, 유효기간 지날 경우
    if (error.name === 'TokenExpiredError') { // 유효기간 초과
      return res.status(419).json({
        code: 419,
        message: '토큰이 만료되었습니다',
      });
    }
    return res.status(401).json({
      code: 401,
      message: '유효하지 않은 토큰입니다',
    });
  }
};

요청 헤더에 저장된 토큰 req.headers.authorization 을 사용하는데, 쿠키처럼 헤더에 토큰을 넣어 보낸다.

받아낸 토큰 내용을 미들웨어에서 사용하도록 하는 v1.js코드

// v1.js

const express = require('express');
const jwt = require('jsonwebtoken');

const { verifyToken } = require('./middlewares');
const { Domain, User } = require('../models');

const router = express.Router();

router.post('/token', async (req, res) => {
  const { clientSecret } = req.body;
  try {
    const domain = await Domain.find({
      where: { clientSecret },
      include: {
        model: User,
        attribute: ['nick', 'id'],
      },
    });
    if (!domain) {
      return res.status(401).json({
        code: 401,
        message: '등록되지 않은 도메인입니다. 먼저 도메인을 등록하세요',
      });
    }
    const token = jwt.sign({         .. 토큰 발급 메서드
      id: domain.user.id,
      nick: domain.user.nick,
    }, process.env.JWT_SECRET, {   // 비밀키  유출에 주의
      expiresIn: '1m', // 1분 유효기간
      issuer: 'nodebird',  // 발급자
    });
    return res.json({
      code: 200,         // 200번대이면 괜찮고, 아니면 에러 
      message: '토큰이 발급되었습니다',
      token,
    });
  } catch (error) {
    console.error(error);
    return res.status(500).json({
      code: 500,
      message: '서버 에러',
    });
  }
});

router.get('/test', verifyToken, (req, res) => {
  res.json(req.decoded);
});

module.exports = router;

라우터는 한 번 버전이 정해진 이후 함부로 수정하면 안 된다.

버전을 올려야 한다면 새로운 라우터 파일을 새로 등록하고, 기존 사용자들에게 새로운 게 나왔음을 알려야 함.

이렇게 만든 라우터를 서버에 연결한다.

// app.js

const express = require('express');
const path = require('path');
const cookieParser = require('cookie-parser');
const passport = require('passport');
const morgan = require('morgan');
const session = require('express-session');
const nunjucks = require('nunjucks');
const dotenv = require('dotenv');

dotenv.config();
const v1 = require('./routes/v1');
const authRouter = require('./routes/auth');
const indexRouter = require('./routes');
const { sequelize } = require('./models');
const passportConfig = require('./passport');

const app = express();
passportConfig();
app.set('port', process.env.PORT || 8002);
app.set('view engine', 'html');
nunjucks.configure('views', {
  express: app,
  watch: true,
});
sequelize.sync({ force: false })
  .then(() => {
    console.log('데이터베이스 연결 성공');
  })
  .catch((err) => {
    console.error(err);
  });

app.use(morgan('dev'));
app.use(express.static(path.join(__dirname, 'public')));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser(process.env.COOKIE_SECRET));
app.use(session({
  resave: false,
  saveUninitialized: false,
  secret: process.env.COOKIE_SECRET,
  cookie: {
    httpOnly: true,
    secure: false,
  },
}));
app.use(passport.initialize());
app.use(passport.session());

app.use('/v1', v1);     // 연결 부분
app.use('/auth', authRouter);
app.use('/', indexRouter);

app.use((req, res, next) => {
  const error =  new Error(`${req.method} ${req.url} 라우터가 없습니다.`);
  error.status = 404;
  next(error);
});

app.use((err, req, res, next) => {
  res.locals.message = err.message;
  res.locals.error = process.env.NODE_ENV !== 'production' ? err : {};
  res.status(err.status || 500);
  res.render('error');
});

app.listen(app.get('port'), () => {
  console.log(app.get('port'), '번 포트에서 대기중');
});

10.4 호출 서버 만들기

서버지만 다른 서버에 요청을 보내므로 클라이언트 역할을 한다.

API사용자의 입장-NodeBird의 앱 데이터를 가져오고 싶은-에서 이용한다.

새로 NodeBird 폴더를 마들고 이와 같은 폴터에 Nodecat이라는 새로운 폴더를 만든다.

json파일과 app.js파일, error.pug파일 그리고 env 파일을 만들어 나의 비밀키를 넣는다.

이후 중요한 작용을 할 index.js파일이다.

// index.js
const express = require('express');
const axios = require('axios');

const router = express.Router();

router.get('/test', async (req, res, next) => { // 토큰 테스트 라우터
  try {
    if (!req.session.jwt) { // 세션에 토큰이 없으면 토큰 발급 시도
      const tokenResult = await axios.post('http://localhost:8002/v1/token', {
        clientSecret: process.env.CLIENT_SECRET,
      });
      if (tokenResult.data && tokenResult.data.code === 200) { // 토큰 발급 성공
        req.session.jwt = tokenResult.data.token; // 세션에 토큰 저장
      } else { // 토큰 발급 실패
        return res.json(tokenResult.data); // 발급 실패 사유 응답
      }
    }
    // 발급받은 토큰 테스트
    const result = await axios.get('http://localhost:8002/v1/test', {
      headers: { authorization: req.session.jwt },
    });
    return res.json(result.data);
  } catch (error) {
    console.error(error);
    if (error.response.status === 419) { // 토큰 만료 시
      return res.json(error.response.data);
    }
    return next(error);
  }
});

module.exports = router;

localhost:8002는 API서비스를 제공하는 NodeBird-api서버이고

localhose:8003은 API서비스를 사용하는 nodecate 서버이다.

접속해 토큰 내용을 확인할 수 있다.

유효기간에 따라 만료 알림 유무도 확인할 수 있다.

다음 절에서 만료 시 갱신하는 코드를 알려준다

10.5 SNS API서버 만들기

다시 nodebird-api 입장으로 돌아와 라우터를 작성한다.

// v1.js

const express = require('express');
const jwt = require('jsonwebtoken');

const { verifyToken } = require('./middlewares');
const { Domain, User, Post, Hashtag } = require('../models');

const router = express.Router();

router.post('/token', async (req, res) => {
  const { clientSecret } = req.body;
  try {
    const domain = await Domain.findOne({
      where: { clientSecret },
      include: {
        model: User,
        attribute: ['nick', 'id'],
      },
    });
    if (!domain) {
      return res.status(401).json({
        code: 401,
        message: '등록되지 않은 도메인입니다. 먼저 도메인을 등록하세요',
      });
    }
    const token = jwt.sign({
      id: domain.User.id,
      nick: domain.User.nick,
    }, process.env.JWT_SECRET, {
      expiresIn: '1m', // 1분
      issuer: 'nodebird',
    });
    return res.json({
      code: 200,
      message: '토큰이 발급되었습니다',
      token,
    });
  } catch (error) {
    console.error(error);
    return res.status(500).json({
      code: 500,
      message: '서버 에러',
    });
  }
});

router.get('/test', verifyToken, (req, res) => {
  res.json(req.decoded);
});

router.get('/posts/my', verifyToken, (req, res) => {    // cnrk
  Post.findAll({ where: { userId: req.decoded.id } })
    .then((posts) => {
      console.log(posts);
      res.json({
        code: 200,
        payload: posts,
      });
    })
    .catch((error) => {
      console.error(error);
      return res.status(500).json({
        code: 500,
        message: '서버 에러',
      });
    });
});

router.get('/posts/hashtag/:title', verifyToken, async (req, res) => {   // 추가 
  try {
    const hashtag = await Hashtag.findOne({ where: { title: req.params.title } });
    if (!hashtag) {
      return res.status(404).json({
        code: 404,
        message: '검색 결과가 없습니다',
      });
    }
    const posts = await hashtag.getPosts();
    return res.json({
      code: 200,
      payload: posts,
    });
  } catch (error) {
    console.error(error);
    return res.status(500).json({
      code: 500,
      message: '서버 에러',
    });
  }
});

module.exports = router;

포스트와 검색 결과를 가져오는 라우터.

index.js파일에 위의 api를 이용하는 코드를 추가한다.

// index.js
const express = require('express');
const axios = require('axios');
const router = express.Router();
const URL ='http://localhost:8002/v1';
const request = async (req, api) => {
try {
if (!req.session.jwt) { // 세션에 토큰이 없으면
const tokenResult = await axios.post(${URL}/token, {
clientSecret: process.env.CLIENT_SECRET,
});
req.session.jwt = tokenResult.data.token; // 세션에 토큰 저
장
}
return await axios.get(${URL}${api}, {
headers: { authorization: req.session.jwt },
}); // API 요청
} catch (error) {
console.error(error);
if (error.response.status < 500) { // 410이나 419처럼 의도된
에러면 발생
return error.response;
}
throw error;
}
};
router.get('/mypost', async (req, res, next) => {
try {
const result = await request(req,'/posts/my');
res.json(result.data);
} catch (error) {
console.error(error);
next(error);
}
});
ff
router.get('/search/:hashtag', async (req, res, next) => {
try {
const result = await request(
req, /posts/hashtag/${encodeURIComponent(req.params.ha
shtag)},
);
res.json(result.data);
} catch (error) {
if (error.code) {
console.error(error);
next(error);
}
}
});
module.exports = router;

..실습 하십시오..! (위 내용은 깃허브에 있는 것과 다름)

10.6 사용량 제한 구현하기

일단 인증된 사용자만 API를 사용할 수 있지만, 과도하게 이를 이용하면 서버에 무리가 간다.

횟수 제한을 둠으로서 서버의 트래픽을 제한하는 것이 중요하다.

유료 라면 과금 체계와 횟수로 이를 연결 지을 수 있다.

이는 기존 npm 패키지를 이용해서 만들 수 있다.

npm i express-rate-limit

그리고 apiLimiter 미들웨어를 추가한다.

...

exports.apiLimiter = new RateLimit({
  windowMs: 60 * 1000, // 1분
  max: 10,
  delayMs: 0,
  handler(req, res) {
    res.status(this.statusCode).json({
      code: this.statusCode, // 기본값 429
      message: '1분에 한 번만 요청할 수 있습니다.',
    });
  },
});


exports.deprecated = (req, res) => {  // 사용하면 안되는 라우터에 붙여줌
  res.status(410).json({
    code: 410,
    message: '새로운 버전이 나왔습니다. 새로운 버전을 사용하세요.',
  });
};

 
...

이제 apiLimiter 미들웨어를 라우터에 넣으면 라우터에 사용량 제한이 걸린다.

아래와 같은 옵션이 있다.

windowMs 기준 시간
max 허용 횟수
delayMs 호출 간격
handler 제한 초과 시 콜백함수

제한 초과시 439 상태 코드와 함께 허용량 초과했다는 응답 전송.

클라이언트로 보내는 응답 코드

0열 선택0열 다음에 열 추가
1열 선택1열 다음에 열 추가

0행 선택0행 다음에 행 추가
1행 선택1행 다음에 행 추가
2행 선택2행 다음에 행 추가

셀 전체 선택

열 너비 조절

행 높이 조절

응답 코드	메시지
200	Json데이터

셀 병합
행 분할
열 분할
너비 맞춤
삭제

v2라우터를 새로 생성해 사용량 제한에 대한 내용 추가

+ 토큰 유효기간 30분으로 연장

+ v1이용 시 경고 메시지

// v2.js

const express = require('express');
const jwt = require('jsonwebtoken');

const { verifyToken, apiLimiter } = require('./middlewares');
const { Domain, User, Post, Hashtag } = require('../models');

const router = express.Router();

router.post('/token', apiLimiter, async (req, res) => {
  const { clientSecret } = req.body;
  try {
    const domain = await Domain.findOne({
      where: { clientSecret },
      include: {
        model: User,
        attribute: ['nick', 'id'],
      },
    });
    if (!domain) {
      return res.status(401).json({
        code: 401,
        message: '등록되지 않은 도메인입니다. 먼저 도메인을 등록하세요',
      });
    }
    const token = jwt.sign({
      id: domain.User.id,
      nick: domain.User.nick,
    }, process.env.JWT_SECRET, {
      expiresIn: '30m', // 30분
      issuer: 'nodebird',
    });
    return res.json({
      code: 200,
      message: '토큰이 발급되었습니다',
      token,
    });
  } catch (error) {
    console.error(error);
    return res.status(500).json({
      code: 500,
      message: '서버 에러',
    });
  }
});

router.get('/test', verifyToken, apiLimiter, (req, res) => {
  res.json(req.decoded);
});

router.get('/posts/my', apiLimiter, verifyToken, (req, res) => {
  Post.findAll({ where: { userId: req.decoded.id } })
    .then((posts) => {
      console.log(posts);
      res.json({
        code: 200,
        payload: posts,
      });
    })
    .catch((error) => {
      console.error(error);
      return res.status(500).json({
        code: 500,
        message: '서버 에러',
      });
    });
});

router.get('/posts/hashtag/:title', verifyToken, apiLimiter, async (req, res) => {
  try {
    const hashtag = await Hashtag.findOne({ where: { title: req.params.title } });
    if (!hashtag) {
      return res.status(404).json({
        code: 404,
        message: '검색 결과가 없습니다',
      });
    }
    const posts = await hashtag.getPosts();
    return res.json({
      code: 200,
      payload: posts,
    });
  } catch (error) {
    console.error(error);
    return res.status(500).json({
      code: 500,
      message: '서버 에러',
    });
  }
});

module.exports = router;

라우터와 서버 연결

// app.js

app.use('/v1', v1);
app.use('/v2', v2);
app.use('/auth', authRouter);
app.use('/', indexRouter);

그리고 index.js 파일에 아래 코드 추가

const URL = 'http://localhost:8002/v2';

10.7 CORS 이해하기

nodecat의 프론트에서 nodebird-api의 서버 api를 호출한 경우

nodecat의 index파일 수정

// index.js

const express = require('express');
const axios = require('axios');

const router = express.Router();
const URL = 'http://localhost:8002/v2';

axios.defaults.headers.origin = 'http://localhost:4000'; // origin 헤더 추가
const request = async (req, api) => {
  try {
    if (!req.session.jwt) { // 세션에 토큰이 없으면
      const tokenResult = await axios.post(`${URL}/token`, {
        clientSecret: process.env.CLIENT_SECRET,
      });
      req.session.jwt = tokenResult.data.token; // 세션에 토큰 저장
    }
    return await axios.get(`${URL}${api}`, {
      headers: { authorization: req.session.jwt },
    }); // API 요청
  } catch (error) {
    if (error.response.status === 419) { // 토큰 만료시 토큰 재발급 받기
      delete req.session.jwt;
      return request(req, api);
    } // 419 외의 다른 에러면
    return error.response;
  }
};

router.get('/mypost', async (req, res, next) => {
  try {
    const result = await request(req, '/posts/my');
    res.json(result.data);
  } catch (error) {
    console.error(error);
    next(error);
  }
});

router.get('/search/:hashtag', async (req, res, next) => {
  try {
    const result = await request(
      req, `/posts/hashtag/${encodeURIComponent(req.params.hashtag)}`,
    );
    res.json(result.data);
  } catch (error) {
    if (error.code) {
      console.error(error);
      next(error);
    }
  }
});

router.get('/', (req, res) => {
  res.render('main', { key: process.env.CLIENT_SECRET });
});

module.exports = router;

그리고 main퍼그 파일 수정

// main.pug

doctype
html
head
title 프런트 API 요청
body
#result
script.
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
if (xhr.readyState === xhr.DONE) {
if (xhr.status === 200) {
document.querySelector('#result').textContent = xhr.responseText;
} else {
console.error(xhr.responseText);
}
}
};
xhr.open('POST','http://localhost:8002/v2/token');
xhr.setRequestHeader('Content-Type','application/json');
xhr.send(JSON.stringify({ clientSecret:'#{key}' }));      // 비밀키로 랜더링

현재 상태에서 실행하면 CORS문제 발생

현재 요청을 보내는 클라이언트와 요청을 받는 서버의 도메인 문제.

Network 탭(개발자 탭)에서 Method가 Post가 아닌 Option으로 표시되는데 이 메서드는 실제 요청 보내기 전에, 이서버가 도메인을 허용하는지 체크한다

CORS문제 해결을 위해서 응답 해더에 Access-Control-Allow-Origin이라는 해더 넣어주어야 한다.

혹은 npm을 설치한다. 단 nodebird-api에서 설치한다.

npm i cors

이후 v2.js에 적용한다.

Node.js #2

Editor : 라마

728x90

'23-24 > Node.js 2' 카테고리의 다른 글

[노드 2] 12장. 웹 소켓으로 실시간 데이터 전송하기 (0)	2024.01.05
[노드 2] 11장. 노드 서비스 테스트하기 (1)	2023.12.29
[노드 2] 9장. 익스프레스로 SNS 서비스 만들기 (1)	2023.12.01
[노드 2] 8장. MongoDB (0)	2023.11.24
[노드 2] 7장. MySQL (0)	2023.11.17

고정 헤더 영역

메뉴 레이어

메뉴 리스트

검색 레이어

검색 영역

상세 컨텐츠

본문 제목

본문

Node.js #2

Editor : 라마

'23-24 > Node.js 2' 카테고리의 다른 글

관련글 더보기

추가 정보

인기글

최신글

티스토리툴바