본문으로 건너뛰기

WordPress 애플리케이션에 인증 (Authentication) 추가하세요

이 튜토리얼에서는 Logto를 Wordpress 웹사이트에 통합하는 방법을 보여드립니다.

사전 준비 사항​

통합​

플러그인 설치​

OpenID Connect Generic 플러그인을 사용하여 OIDC 프로토콜을 통해 Logto를 WordPress 웹사이트에 통합할 것입니다.

  1. WordPress 사이트에 로그인하세요.
  2. "플러그인"으로 이동하여 "새로 추가"를 클릭하세요.
  3. "OpenID Connect Generic"을 검색하고 daggerhart의 플러그인을 설치하세요.
  4. 플러그인을 활성화하세요.

리디렉션 URI 구성​

먼저 리디렉션 URI를 구성하겠습니다. 플러그인 설정에서 "Notes" 섹션으로 스크롤하여 "Redirect URI" 값을 복사하세요.

Logto Console의 애플리케이션 세부 정보 페이지로 전환하세요. 리디렉션 URI를 추가하고 "변경 사항 저장"을 클릭하세요.

플러그인 설정​

필요한 구성 세부 정보는 다음 표를 참조하세요:

플러그인 필드설명
Client IDLogto 애플리케이션의 앱 ID
Client SecretLogto 애플리케이션의 앱 비밀
OpenID Scopeemail profile openid offline_access를 입력하세요
Login Endpoint URLLogto 애플리케이션의 인가 (Authorization) 엔드포인트 URL, https://[tenant-id].logto.app/oidc/auth, Logto 애플리케이션 페이지에서 "엔드포인트 세부 정보 표시"를 클릭하여 URL을 얻을 수 있습니다.
Userinfo Endpoint URLLogto 애플리케이션의 userinfo 엔드포인트 URL, https://[tenant-id].logto.app/oidc/me.
Token Validation Endpoint URLLogto 애플리케이션의 토큰 검증 엔드포인트 URL, https://[tenant-id].logto.app/oidc/token.
End Session Endpoint URLLogto 애플리케이션의 세션 종료 엔드포인트 URL, https://[tenant-id].logto.app/oidc/session/end.
Identity Key사용자의 아이덴티티를 포함하는 ID 토큰의 고유 키, 구성에 따라 이메일 또는 sub일 수 있습니다.
Nickname Key사용자의 닉네임을 포함하는 ID 토큰의 키, sub로 설정하고 나중에 변경할 수 있습니다.

체크포인트: 애플리케이션 테스트​

이제 애플리케이션을 테스트할 수 있습니다:

  1. WordPress 사이트에서 로그아웃하세요.
  2. WordPress 로그인 페이지를 방문하고 "Logto로 로그인" 버튼을 클릭하세요.
  3. Logto 로그인 페이지로 리디렉션됩니다.
  4. Logto 계정으로 로그인하세요.
  5. WordPress 사이트로 다시 리디렉션되며 자동으로 로그인됩니다.

역할 매핑​

WordPress에는 사용자가 사이트에서 수행할 수 있는 작업 (기능)을 정의하는 내장된 사용자 역할 관리 시스템이 있습니다. 기본 사용자 역할에는 관리자, 편집자, 작성자, 기고자, 구독자가 포함되며, 각 역할은 고유한 기능 세트를 가지고 있습니다.

Logto는 역할 기반 접근 제어 (RBAC)를 인가 (Authorization) 모델로 사용하며, "스코프"를 권한의 최소 단위로 활용합니다. 이러한 스코프는 인증된 사용자가 애플리케이션 내에서 수행할 수 있는 특정 작업을 정의합니다. 그러나 WordPress는 다양한 기능을 함께 묶는 사전 정의된 "역할"에 의존하여 사용자 권한을 관리하는 다른 원칙에 따라 운영됩니다.

이 근본적인 차이를 감안할 때, Logto 내에 WordPress에 정의된 역할에 해당하는 특별한 역할을 생성하는 것이 좋습니다. 이러한 역할은 스코프를 가질 필요는 없으며, 사용자와 WordPress 역할을 매핑하는 참조로만 사용됩니다.

사전 준비 사항​

  • WordPress의 역할에 해당하는 Logto에서 역할을 설정하세요. 예를 들어, WordPress에 'editor' 역할이 있는 경우, Logto에 'group:editors' 역할을 생성하세요.

역할 매핑 구현​

역할 매핑을 구현하기 위해 WordPress 테마의 functions.php 파일에 사용자 정의 코드를 추가할 것입니다. 이는 사용자가 로그인할 때 트리거되는 wp_login 액션 훅을 사용하는 것을 포함합니다. 다음은 이를 설정하는 단계별 가이드입니다:

1단계: 테마의 functions.php 파일에 접근​

테마의 functions.php 파일을 엽니다. 이 파일은 WordPress 관리자 패널에서 외관 > 테마 편집기로 이동하여 오른쪽 파일 목록에서 functions.php를 선택하여 접근할 수 있습니다. 또는 소스 코드에서 WordPress 테마 디렉토리로 이동하여 functions.php 파일을 찾으세요. 이 파일은 WordPress 사이트의 기능을 확장하는 사용자 정의 PHP 함수를 추가할 수 있게 합니다.

2단계: 역할 매핑 함수 작성​

아래는 functions.php에 추가할 수 있는 함수의 간단한 예입니다. 이 함수는 사용자가 로그인할 때 트리거되며, Logto에서 가져온 사용자의 roles 클레임에 따라 역할을 할당합니다.

function logto_handler($user_login, $user = null) {
	if (!$user) {
		$user = get_user_by('login', $user_login);
	}

	$oidc_claims = get_user_meta($user->ID, 'openid-connect-generic-last-user-claim', true);

	if (in_array('group:editors', $oidc_claims['roles'])) {
		$user->set_role('editor');
	} else {
		$user->set_role('subscriber');
	}
}

add_action('wp_login', 'logto_handler', 10, 2);

3단계: 코드 이해 및 사용자 정의​

  • logto_handler 함수: 이 함수는 두 개의 매개변수를 받습니다: $user_login (사용자 이름)과 $user (사용자 객체). Logto에서 사용자 메타로 저장된 openid-connect-generic-last-user-claim에서 역할을 가져와 해당 WordPress 역할에 매핑하고 사용자에게 할당합니다.

  • add_action: 이 줄은 사용자가 로그인한 후 트리거되는 wp_login 액션에 logto_handler 함수를 연결합니다. 10은 우선순위 (기본값)이며, 2는 함수가 수락하는 인수의 수를 나타냅니다.

위의 예는 Logto를 통해 인증된 사용자에게 group:editors 역할 이름으로 'editor' 역할을 할당합니다. 그러나 실제 시나리오에서는 더 다양한 역할 매핑을 구현해야 할 것입니다.

WordPress 역할 및 기능 목록은 여기에서 확인할 수 있습니다.

4단계: 설정 테스트​

이제 Logto에서 group:editors 역할을 가진 사용자로 로그인하여 역할 매핑 함수를 테스트하세요. 로그인 후 WordPress에서 사용자의 역할을 확인하여 매핑이 올바르게 작동하는지 확인하세요.

추가 읽을거리​

최종 사용자 흐름: 인증 흐름, 계정 흐름, 및 조직 흐름 커넥터 구성 API 보호