>웹 프론트엔드 >JS 튜토리얼 >웹 인증: 쿠키와 토큰

웹 인증: 쿠키와 토큰

Barbara Streisand
Barbara Streisand원래의
2025-01-27 16:31:12553검색

Web Authentication: Cookies vs. Tokens

웹 개발의 안전한 사용자 경험은 강력한 인증에 달려 있습니다. 소셜 미디어 로그인, 뱅킹 앱, 기업 포털 등 사용자 신원을 확인하는 것이 가장 중요합니다. 이를 달성하는 두 가지 주요 방법은 쿠키토큰입니다. 둘 다 사용자를 인증하지만 구현, 보안, 확장성 및 애플리케이션이 크게 다릅니다. 이 문서에서는 차이점을 자세히 설명하고 강점, 약점, 이상적인 사용 사례를 강조하여 최상의 접근 방식을 선택하는 데 도움을 줍니다. 고급 인증 솔루션의 경우 최첨단 보안 프레임워크에 대한 이 리소스를 살펴보세요.


1. 웹 인증 기초

쿠키와 토큰을 비교하기 전에 인증을 정의해 보겠습니다. 즉, 일반적으로 자격 증명(사용자 이름/비밀번호)을 통해 사용자의 신원을 확인합니다. 인증 후 서버는 반복되는 자격 증명 프롬프트 없이 요청 전반에 걸쳐 사용자를 일관되게 인식해야 합니다. 세션관리입니다.

기존 인증은 서버측 세션에 의존합니다. 현대적인 방법은 종종 상태 비저장 토큰을 사용합니다. 쿠키와 토큰은 클라이언트(브라우저, 앱)와 서버 간에 인증 데이터를 전송합니다.


2. 쿠키: 확립된 방법

쿠키 기능

쿠키는 사용자의 브라우저에 저장되는 작은 데이터 조각입니다. 로그인하면 서버는 세션 ID를 생성하여 데이터베이스에 저장한 후 Set-Cookie HTTP 헤더를 통해 클라이언트에 보냅니다. 브라우저는 동일한 도메인에 대한 후속 요청에 이 쿠키를 자동으로 포함하여 서버측 세션 유효성 검사를 활성화합니다.

예:

  1. 사용자가 로그인 자격 증명을 제출합니다.
  2. 서버가 세션 기록을 확인하고 생성한 후 세션 ID 쿠키를 보냅니다.
  3. 브라우저가 쿠키를 저장합니다.
  4. 브라우저는 각 요청과 함께 쿠키를 보냅니다. 서버는 세션 ID의 유효성을 검사합니다.

쿠키의 장점

  • 자동 처리: 브라우저는 쿠키를 원활하게 관리합니다.
  • 내장 보안: 쿠키는 XSS 및 CSRF 공격을 완화하기 위해 Secure, HttpOnlySameSite 플래그를 지원합니다.
  • 서버측 제어: 서버측 기록을 삭제하면 세션이 즉시 무효화됩니다.

쿠키의 단점

  • 확장성 문제: 서버측 세션 스토리지는 데이터베이스 리소스를 소비하므로 트래픽이 많은 앱에 병목 현상이 발생할 가능성이 있습니다.
  • 교차 출처 제한: 쿠키는 도메인별로 다르므로 분산 시스템이나 제3자 API를 사용한 인증이 복잡합니다.
  • CSRF 취약성: 보호 장치(예: CSRF 토큰)가 없으면 쿠키는 공격에 취약합니다.

3. 토큰: 현대적인 접근 방식

토큰 기능

토큰, 특히 JSON 웹 토큰(JWT)은 무상태 인증을 제공합니다. 서버 측 세션 저장소 대신 토큰은 서명된 페이로드에 사용자 정보와 권한을 캡슐화합니다. 인증 후 서버는 토큰을 발행하고 클라이언트 측에 저장되며(주로 localStorage 또는 쿠키에 저장됨) Authorization 헤더

를 통해 각 요청과 함께 전송됩니다.

예:

  1. 사용자가 자격 증명을 제출합니다.
  2. 서버가 서명된 JWT를 검증하고 생성합니다.
  3. 토큰이 클라이언트에게 전송됩니다.
  4. 클라이언트는 후속 요청에 토큰(Authorization: Bearer <token>)을 포함합니다.
  5. 서버는 토큰의 서명을 확인하고 액세스 권한을 부여합니다.

토큰의 장점

  • 상태 비저장: 서버 측 스토리지를 제거하여 확장성을 향상시킵니다.
  • 도메인 간 호환성: 토큰은 도메인과 마이크로서비스 전반에 걸쳐 작동합니다.
  • 세부적인 제어: 토큰은 사용자 역할, 권한 및 만료 시간을 포함할 수 있습니다.
  • 모바일 친화적: 쿠키의 실용성이 떨어지는 앱에 적합합니다.

토큰 단점

  • 취소 불가능: 토큰 차단 목록을 사용하지 않는 한 토큰을 조기에 무효화하기는 어렵습니다.
  • 저장 위험: localStorage에 토큰을 저장하면 XSS 공격에 노출됩니다.
  • 페이로드 오버헤드: 토큰이 크면 요청 크기가 늘어나 성능에 영향을 미칩니다.

4. 쿠키와 토큰: 직접적인 비교

이 표에는 주요 차이점이 요약되어 있습니다.

**Criterion** **Cookies** **Tokens**
**Storage** Browser-managed Client-side (localStorage, cookies)
**Statefulness** Stateful Stateless
**Cross-Origin** Limited by Same-Origin Policy Supported via CORS
**Security** Vulnerable to CSRF, protected by flags Vulnerable to XSS if mishandled
**Scalability** Requires session storage scaling Scales effortlessly
**Use Cases** Traditional web apps SPAs, mobile apps, microservices

5. 보안 모범 사례

쿠키

를 사용하여 JavaScript 액세스를 방지하십시오 https 전용 변속기에

를 사용하십시오
    CSRF를 완화하려면 또는
  • 를 사용하십시오 민감한 동작을 위해 CSRF 토큰을 사용하십시오 HttpOnly 토큰
  • Secure
  • 피하기
  • ; 대신 http 전용 쿠키를 사용하십시오 새로 고침 토큰으로 단기 토큰을 사용하십시오 토큰 서명을 엄격하게 검증합니다 민감한 페이로드 데이터를 암호화합니다 SameSite=Strict Lax
  • 6. 실제 응용 분야
쿠키를 사용하는시기

e- 커머스

: 전통적인 사이트는 쿠키의 간단한 세션 관리로부터 이익을 얻습니다 레거시 시스템 : 서버 측 프레임 워크를 기반으로 구축 된 이전 앱
    간단한 웹 앱 : 최소한의 크로스 도메인 요구가있는 프로젝트 localStorage 토큰을 사용하는시기
  • 스파 : 편안한 API가있는 반응, 각도 또는 vue.js 앱 마이크로 서비스
  • : 서비스 간 인증이 필요한 분산 시스템
  • 모바일 앱 : 브라우저 쿠키 처리가 실용적이지 않은 기본 앱.

    7. 인증의 미래 하이브리드 접근 방식이 떠오르고 있습니다. oauth 2.0

    openId Connect

    쿠키와 토큰 결합하여 안전한 타사 승인을 위해 쿠키와 토큰을 결합하십시오. passkeys (FIDO2)는 생체 인식 및 암호화 키를 사용하여 암호없는 인증을 제공합니다. Next.js 및 Auth0과 같은 프레임 워크는 두 가지 방법을 모두 지원하여 유연성을 제공합니다.

    8. 결론
      쿠키와 토큰은 보완 도구입니다. 쿠키는 단순성과 서버 측 제어를 제공합니다. 토큰은 현대 아키텍처에 확장 성과 유연성을 제공합니다. 선택은 응용 프로그램의 요구에 따라 다릅니다
    • 쿠키 : 기존의 서버 렌더링 된 앱의 경우 토큰 :
    • 스파, 마이크로 서비스 또는 모바일 우선 애플리케이션의 경우
    • 보안 우선 순위 : HTTPS, 보안 스토리지 및 정기 보안 감사가 필수적입니다. 고급 인증 전략은 링크 된 리소스를 참조하십시오 (주의해서 진행하고 브라우저 보안을 확인하십시오).

위 내용은 웹 인증: 쿠키와 토큰의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.