JWT 인증으로 워드프레스 로그인 상태 확인하기

JWT 인증이란 무엇인가요?

먼저, JWT에 대해 간단히 설명드리겠습니다. JWT는 클라이언트와 서버 간의 인증 정보를 안전하게 주고받기 위해 사용하는 표준 토큰입니다. 이는 사용자에게 일회성 로그인 후, 지속적인 인증 상태를 유지할 수 있는 기능을 제공합니다. 쉽게 말해, 한 번 로그인하면 사이트를 돌아다녀도 로그인 상태를 유지할 수 있도록 해주는 것이죠.

로그인 상태 체크: 간단한 코드로 구현하기

워드프레스에서 JWT 인증을 사용하면, 간단한 코드로 로그인 상태를 확인할 수 있습니다. 이를 위해 필요한 것은 단 하나, 사용자의 JWT 토큰입니다. 아래 코드는 사용자의 로그인 상태를 체크하는 간단한 예제입니다:

import axios from 'axios';

const checkLoginStatus = async () => {
  const token = localStorage.getItem('token');
  
  if (!token) {
    return false; // 토큰이 없으면 로그인되지 않은 상태로 처리
  }

  try {
    const response = await axios.post('https://your-wordpress-site.com/wp-json/jwt-auth/v1/token/validate', null, {
      headers: {
        Authorization: `Bearer ${token}`
      }
    });

    return response.data.data.status === 200;
  } catch (error) {
    console.error('Login status check error:', error);
    return false; // 토큰이 유효하지 않거나 에러 발생 시 로그인되지 않은 상태로 처리
  }
};

이 코드를 보면, JWT 토큰을 `localStorage`에서 가져와 워드프레스 서버로 검증 요청을 보내는 것을 알 수 있습니다. 서버는 이 토큰이 유효한지 확인하고, 유효하다면 사용자가 로그인 상태임을 확인해줍니다. 정말 간단하면서도 강력한 기능이죠!

왜 토큰을 저장할 때 LocalStorage를 사용할까요?

JWT 토큰을 `localStorage`에 저장하는 것은 매우 흔한 방식입니다. 그 이유는 간단합니다: 사용자의 인증 상태를 유지하기 위해서입니다. 예를 들어, 사용자가 사이트를 새로고침하거나, 브라우저를 닫았다가 다시 열었을 때도 로그인 상태를 유지하고 싶다면, 이 방법이 매우 유용합니다.

하지만, 여기서 한 가지 짚고 넘어가야 할 점이 있습니다. `localStorage`는 브라우저가 종료되더라도 유지되는 장점이 있지만, 보안에 있어서는 조금 더 신중해야 합니다. XSS(교차 사이트 스크립팅) 공격에 의해 토큰이 탈취될 위험이 있기 때문입니다. 따라서, 가능하다면 HTTP-only 쿠키를 사용하는 것을 추천드립니다. HTTP-only 쿠키는 클라이언트에서 접근이 불가능하므로, 훨씬 더 안전합니다.

결론: 안전하게, 그러나 쉽게 유지하기

워드프레스의 로그인 상태를 JWT로 체크하는 방법은 매우 간단하면서도 효과적입니다. 하지만, 보안에 대한 주의가 필요합니다. `localStorage`를 사용할 때는 보안적인 리스크를 항상 염두에 두고, 가능하다면 더 안전한 방법을 고려하세요.

이제, 여러분의 워드프레스 사이트에서 사용자의 로그인 상태를 안전하고 간편하게 관리해보세요. 당신의 사이트가 더욱 사용자 친화적이고, 신뢰할 수 있는 서비스가 될 것입니다.