웹 개발에서 가장 중요한 주제가 무엇일까요? 우리가 앞서 다른 포스팅에서도 볼 수 있었지만 바로 인증(Authentication)과 보안(Security)입니다. 이 부분은 세션, 쿠키, 로그인, JWT, CSRF, XSS 등 여러가지 로 구분되고 설명됩니다.
이 편에서는 입문자에게 특히 어렵고, 실무에서는 한 줄 설정 실수로 사고가 나는 세션/쿠키/로그인/JWT/CSRF/XSS 등을 25개 핵심 지식으로 완전히 정리해드립니다.

1. 인증(Authentication)이란?
“당신이 누구인지 확인하는 절차”입니다.
로그인 기능의 본질도 인증입니다.
2. 인가(Authorization)이란?
“권한이 있는지 확인하는 절차”입니다.
예: 관리자 페이지 접근 가능 여부 확인.
3. 세션(Session)이란?
서버가 사용자 상태를 저장하는 기술입니다.
로그인한 사용자를 서버 메모리에 저장해 두는 방식입니다.
4. 쿠키(Cookie)이란?
브라우저가 저장하는 작은 데이터 조각입니다.
세션 ID(sessionId)도 쿠키로 브라우저에 저장됩니다.
5. 세션 기반 로그인 동작 원리
- 사용자가 로그인 요청
- 서버가 사용자 검증 후 세션 저장
- 세션 ID를 쿠키에 담아 클라이언트로 전송
- 이후 요청마다 쿠키가 자동 포함
- 서버가 세션 ID로 유저 식별
✔ 예제 코드 (Spring Boot)
@PostMapping("/login")
public String login(HttpSession session, @RequestParam String id) {
session.setAttribute("userId", id);
return "login-success";
}
6. 쿠키 기반 로그인 원리
서버가 사용자를 기억하지 않고 브라우저가 인증 정보를 보관합니다.
document.cookie = "token=abc123; path=/; Secure; HttpOnly;";
7. JWT(JSON Web Token)란?
“서버 메모리에 저장하지 않는 인증 방식”
토큰 자체가 사용자 정보를 품고 있음.
8. JWT 구조(3단계)
header.payload.signature
eyJhbGciOi... (Header)
eyJ1c2VySWQiOi... (Payload)
sKasD2... (Signature)
9. JWT 발급 예제 (Node.js)
const jwt = require("jsonwebtoken");
const token = jwt.sign({ userId: 1 }, "SECRET", { expiresIn: "1h" });
10. JWT 검증 예제
jwt.verify(token, "SECRET", (err, decoded) => {
if(err) return "INVALID";
console.log(decoded.userId);
});
11. 세션 vs JWT 비교
| 항목 | 세션 | JWT |
|---|---|---|
| 저장 | 서버 | 클라이언트 |
| 확장성 | 낮음 | 높음 |
| 보안 | 상대적으로 안전 | 토큰 탈취 시 위험 |
| 복잡도 | 낮음 | 중간 |
12. Access Token이란?
실제로 API에 접근할 때 쓰는 인증 토큰입니다.
유효기간이 짧습니다.
13. Refresh Token이란?
Access Token이 만료되면 재발급하는 토큰.
보안 위험 때문에 보관 위치에 매우 신경 써야 합니다.
14. HttpOnly Cookie란?
JavaScript로 읽을 수 없는 쿠키 → XSS로부터 안전
Set-Cookie : token=abc; HttpOnly;
15. Secure Cookie란?
HTTPS 연결에서만 전송되는 쿠키 → 네트워크 도청 방지
16. SameSite 옵션
CSRF 공격을 방지하는 핵심 속성
Strict: 외부 사이트 요청에서 쿠키 전송 안 함Lax: 기본값, 일부 요청 허용None: 모든 요청 허용 + Secure 필수
17. CSRF(Cross Site Request Forgery)란?
사용자 모르게 “의도치 않은 요청”을 보내는 공격
✔ 방지 예시 (Spring Security)
http.csrf().enable();
18. CSRF Token이란?
요청마다 난수 토큰을 함께 전송하도록 해서 위조 요청을 막는 방식입니다.
19. XSS(Cross Site Scripting)란?
사용자가 입력한 스크립트를 그대로 출력할 때 발생하는 공격.
✔ 방지 예시
<%= HtmlUtils.htmlEscape(input) %>
20. 인증 미들웨어란?
“요청 전에 사용자 인증 여부를 검사하는 로직”
function auth(req, res, next) {
if(!req.user) return res.status(401).send("NO LOGIN");
next();
}
21. OAuth2란?
구글/카카오 로그인 같은 “대리 인증 방식”
22. HTTPS란?
HTTP + TLS 암호화
쿠키·비밀번호 모두 암호화된 채 전송됨.
23. Rate Limit(요청 제한)이란?
로그인 시도 횟수 제한 → 무차별 비밀번호 대입 공격(Brute force) 방지
24. 로그아웃 원리
세션 삭제 혹은 JWT 파기
session.invalidate();
25. 실무에서 권장하는 인증 아키텍처
- 웹: 세션 기반 + HttpOnly Cookie + SameSite=Lax
- 모바일/SPA: JWT Access/Refresh 구조
- 보안 레벨이 높은 사이트: MFA(2단계 인증) 적용
미니 실습 코드 – 로그인 흐름 전체 예시
입문자도 직접 따라 해볼 수 있는 실습 예제입니다. 충분히 하실 수 있으니 천천히 읽어보시면서 해보세요!
// 1) 로그인 요청 → 토큰 발급
app.post("/login", (req, res) => {
const token = jwt.sign({ id: 1 }, process.env.SECRET, { expiresIn: "1h" });
res.cookie("token", token, { httpOnly: true, secure: true });
res.send("Logged in");
});
// 2) 인증 미들웨어
function auth(req, res, next) {
const token = req.cookies.token;
if(!token) return res.status(401).send("NO LOGIN");
jwt.verify(token, process.env.SECRET, (err, decoded) => {
if(err) return res.status(403).send("INVALID TOKEN");
req.user = decoded;
next();
});
}
// 3) 보호된 페이지
app.get("/mypage", auth, (req, res) => {
res.send("Welcome User " + req.user.id);
});
외부 참고 링크(입문자 필수)
(신뢰도 높은 공식 문서들만 포함)
- MDN Cookies
https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies - MDN Authentication
https://developer.mozilla.org/en-US/docs/Web/Security/Authentication - JWT 공식 문서
https://jwt.io/introduction - Spring Security CSRF 설명
https://docs.spring.io/spring-security/reference/servlet/exploits/csrf.html - OWASP Top 10 (XSS·CSRF 공식 설명)
https://owasp.org/www-project-top-ten/
마무리
다음 편에서는 이 25개의 개념을 기반으로 실제 실무에서 어떤 인증 전략을 선택해야 하는지, 그리고 OAuth2·로그아웃·토큰 무효화 전략까지 심화 내용을 이어서 다룰 예정입니다. 많은 기대 부탁드리겠습니다!
[필수용어 실무] 이전 편을 보지 못했다면? 필수용어 실무 시리즈 바로가기
[필수용어 실무 1편] 비전공자가 실무에서 바로 활용 가능한 데이터 연동 & 서버 흐름 25선
[필수용어 실무 2편] 실무에서 마주치는 예외 처리 & 트러블슈팅 핵심 25선
[필수용어 실무 3편] JSP & MVC 패턴 실무 흐름 완전정복 25선
[필수용어 실무 4편] JSP 데이터 처리 & EL/JSTL 실무활용 25선
[필수용어 실무 5편] JSP + AJAX 비동기 데이터 통신 완전정복 25선