SMALL
1. Validate
express-validator
Express.js를 사용하여 웹 애플리케이션을 개발할 때 입력 데이터의 유효성을 검사하기 위한 패키지
npm i express-validator를 통해 validator 설치
모듈 안의 여러 매서드를 사용하여 제한을 걸어줌
- 설치
npm i express-validator
- 파일생성
- validation_ 파라미터에 대한 GET 요청
< validation.js >
import express from 'express';
import {body,param,validationResult} from 'express-validator';
const app = express();
app.use(express.json());
const validate=(req,res,next)=>{
const errors=validationResult(req);
if(errors.isEmpty()){
return next();
}
return res.status(400).json({message:errors.array()[0].msg});
};
app.get('/:email', [param('email').isEmail().withMessage('이메일을 입력하세요!'), validate], (req, res, next) => {
res.send(' 💌 ');
});
< /validation.js >
|
  |
- isLength()
- 길이선정
- 최솟값 최솟값설정 가능
param('email').isLength( {min:7})
 |
- isEMail() : 이메일 형태 확인
param('email').isEmail()
 |
- isInt() : 숫자의 최소 또는 최대값 검증
body('age').isInt()
 |
- matches(): 정규표현식을 사용하여 문자열의 패턴을 검증
param('name').maches()
 |
- trim() : 공백없애기
param('email').trim()
- withMessage() : 문자 보내기
param('email').withMessage('이메일은 7글자 이상!')]
- notEmpty() : 빈칸아닌 형태 인지 확인
param('email').notEmpty()]
- validation_'/users' 엔드포인트에 대한 POST 요청
< validation.js에 추가 >
//[]: validation 기능을 안에다 쓸 수 있다
// 메서드 체이닝으로 벨리데이션 쓰기
// trim: 공백 없애기
// isLength: 최대최소 설정
// post: 자료를 bbody로 받음
// get: param로 받음
app.post('/users', [
body('name').trim().isLength({min:2}).withMessage('이름은 두글자 이상으로 입력!'),
body('age').isInt().withMessage('나이는 숫자로 입력!'),
body('height').isInt({min:100, max:200}).withMessage('키는 100이상 200이하로 입력하세요!'),
body('job').notEmpty(),
validate
], (req, res, next) => {
console.log(req.body);
res.sendStatus(201);
})
app.listen(8080);
</ validation.js >
|
- 문제:
post, put에 text에 대해 빈문자열을 없애고, 최소 3자 이상 입력해야 데이터를 저장하도록 API에 적용
<router> tweets.js >
import express from "express";
import * as tweetController from '../controller/tweet.js'
import { body } from 'express-validator'; //추가
import { validate } from "../middleware/validator.js"; //추가
const router = express.Router();
/*
post, put에 text에 대해 빈문자열을 없애고, 최소 3자 이상 입력해야 데이터를 저장하도록 API에 적용
*/
const validateTweet = [
body('text').trim().isLength({min: 3}).withMessage('최소 3자 이상 입력'), validate
]
//추가
//추가
// 해당 아이디에 대한 트윗 가져오기
// GET
// http://localhost:8080/tweets?username=:username
router.get('/', tweetController.getTweets);
// 글번호에 대한 트윗 가져오기
// GET
// http://localhost:8080/tweets/:id
router.get('/:id', tweetController.getTweet);
// 트윗하기
// POST
// http://localhost:8080/tweets
// name, username, text
// json 형태로 입력 후 추가된 데이터까지 모두 json으로 출력
router.post('/', validateTweet, tweetController.createTweet); //추가
// 트윗 수정하기
// PUT
// http://localhost:8080/tweets/:id
// id, username, text
// json 형태로 입력 후 변경된 데이터까지 모두 json으로 출력
router.put('/:id', validateTweet, tweetController.createTweet); //추가
// 트윗 삭제하기
// DELETE
// http://localhost:8080/tweets/:id
router.delete('/:id', tweetController.deleteTweet);
export default router;
</ router> tweets.js >
|
<middlewear> validator.js >
import { validationResult } from "express-validator";
export const validate = (req, res, next) => {
const errors = validationResult(req);
if(errors.isEmpty()){
return next();
}
return res.status(400).json({message:errors.array()[0].msg})
}
</ middlewear> validator.js >
2. 과제
- 과제
- router, data, controller에 auth.js를 추가하고 tweet.js를 참고하여 적용
- 회원가입, 로그인(회원정보 확인, 아이디를 보내면 해당 객체의 정보만 출력)
usets = [
{
id: '1',
username: 'apple',
password: '1111',
name: '김사과',
email: 'apple@apple.com',
url: 'https://www.logoyogo.com/web/wp-content/uploads/edd/2021/02/logoyogo-1-45.jpg'
},
{
...
}
]
< data > auth.js >
let users = [
{
id: '1',
userid: "apple",
password: "1111",
name: "김사과",
email: "apple@apple.com",
},
{
id: '2',
userid: "banana",
password: "2222",
name: "반하나",
email: "banana@banana.com",
}
]
export async function createUser(username, password, name, email){
const user ={
id: "10",
username,
password,
name,
email,
}
users = [user, ...users]
return users;
}
export async function login(username){
return users.find((users) => users.username === username);
}
</ data > auth.js >
< controller > auth.js >
import * as authRepository from '../data/auth.js';
// 회원가입 함수
export async function signup(req, res, next) {
const {username, password, name, email} = req.body;
const users = await authRepository.createUser(username, password, name, email);
res.status(201).json(users);
}
// 로그인하는 함수
export async function login(req, res, next) {
const {username, password, name, email} = req.body;
const user = await authRepository.login(username);
if(user){
res.status(201).json( `${username} 로그인 완료`);
}else{
res.status(404).json({message: `${username}님의 아디디 또는 비밀번호가 없습니다`})
}
}
</ controller > auth.js >
< router > auth.js >
import express from 'express';
import { body } from 'express-validator';
import * as authController from "../controller/auth.js";
import { validate } from "../middleware/validator.js";
const router = express.Router();
const validateSignup = [
body('username').trim().isLength({ min: 3 }).withMessage('최소 3자 이상 입력'),
body('password').trim().isLength({ min: 4 }).withMessage('최소 4자 이상 입력'),
body('email').trim().isEmail().withMessage('이메일 형식 확인'),
validate
]
router.post('/signup', validateSignup, authController.signup);
router.post('/login', authController.login);
export default router;
< router /js >
< aps.js >
import express from "express";
import morgan from "morgan";
import tweetsRouter from './router/tweets.js'
import authRouter from "./router/auth.js"; //추가
const app = express();
app.use(express.json());
app.use(morgan("dev"));
app.use('/tweets', tweetsRouter);
app.use('/auth', authRouter); //추가
app.use((req, res, next) => {
res.sendStatus(404);
});
app.listen(8080);
</ aps.js >
- Git에 commit 하기
'Web > Node.js' 카테고리의 다른 글
| 14. Postman 정리, 아이디 중복체크 (0) | 2024.05.02 |
|---|---|
| 13. Authentication, bcrypt, JWT (0) | 2024.04.29 |
| 11. 리팩토링 (0) | 2024.04.26 |
| 10. 실습: Tweet (0) | 2024.04.26 |
| 09. git 설치, github 간단 연동 (0) | 2024.04.25 |
