메인 콘텐츠로 건너뛰기

Hasura

통합하기 전에, 우리는 로컬에 Casdoor를 배포해야 합니다.

그런 다음 다음 단계를 따라 우리의 앱에서 Casdoor 기반 로그인 페이지를 빠르게 구현할 수 있습니다.

Casdoor 애플리케이션 구성

  1. 기존의 Casdoor 애플리케이션을 생성하거나 사용합니다.
  2. 리디렉트 URL 추가: http://CASDOOR_HOSTNAME/login Casdoor 애플리케이션 설정
  3. 클라이언트 ID를 복사하세요; 이것이 다음 단계에서 필요합니다.

Casdoor에 사용자 추가

이제 애플리케이션을 가지고 있지만 사용자는 없습니다. 즉, 사용자를 생성하고 역할을 할당해야 합니다.

"사용자" 페이지로 이동하고 오른쪽 상단의 "사용자 추가"를 클릭하세요. 새로운 사용자를 추가할 수 있는 새 페이지가 열립니다.

사용자 페이지를 보여주는 사진

사용자 이름을 추가하고 Hasura 조직을 추가한 후 사용자를 저장하세요(다른 세부 사항은 선택 사항입니다).

이제 사용자의 비밀번호를 설정해야 하는데, "비밀번호 관리"를 클릭하여 설정할 수 있습니다.

사용자의 비밀번호를 선택하고 확인합니다.

Hasura 앱 빌드

Docker 또는 Hasura Cloud를 통해 Hasura를 시작하세요.

이제 다음 열이 있는 users 테이블을 생성합니다:

  • id 타입의 텍스트 (기본 키)
  • username 타입의 텍스트

참조를 위해 아래 이미지를 참조하세요.

Hasura에서 테이블을 생성하는 방법을 보여주는 그림

다음 단계는 앱에 대한 user 역할을 생성하는 것입니다. 사용자는 자신의 레코드만 볼 수 있어야 하며 다른 사람의 레코드는 볼 수 없어야 합니다.

아래 이미지에 표시된대로 user 역할을 구성합니다. 자세한 정보는 Hasura에서 권한 규칙 구성에 대해 읽어보세요.

Hasura에서 권한을 설정하는 방법을 보여주는 그림

이렇게 하면 사용자는 다른 사람의 레코드를 읽을 수 없습니다. 그들은 자신의 것에만 접근할 수 있습니다.

테스트 목적으로 더미 사용자를 추가합니다. JWT 토큰을 사용할 때 다른 사용자의 세부 정보가 아닌 자신의 사용자 세부 정보만 볼 수 있도록 하기 위함입니다.

Hasura에서 테이블 레코드를 추가하는 방법을 보여주는 그림

이제 Hasura에서 JWT_SECRET을 설정해야 합니다.

Hasura를 Casdoor와 구성

이 단계에서는 HASURA_GRAPHQL_JWT_SECRET을 Hasura에 추가해야 합니다.

그렇게 하려면 Hasura docker-compose.yaml로 이동한 다음 아래와 같이 새로운 HASURA_GRAPHQL_JWT_SECRET을 추가합니다.

HASURA_GRAPHQL_JWT_SECRET은 다음 형식이어야 합니다. <Casdoor endpoint>을 자신의 Casdoor의 URL(예: https://door.casdoor.com)로 변경하세요.

HASURA_GRAPHQL_JWT_SECRET: '{"claims_map": {
"x-hasura-allowed-roles": {"path": "$.roles"},
"x-hasura-default-role": {"path": "$.roles[0]"},
"x-hasura-user-id": {"path": "$.id"}
},"jwk_url":"<Casdoor endpoint>/.well-known/jwks"}'

변경 사항을 저장하고 도커를 다시 로드하세요.

Clerk JWT URL을 Hasura에 추가

JWT 토큰 검색

클라이언트 구현이 없으므로 아래 URL로 요청을 보내서 액세스 토큰을 얻을 수 있습니다:

http://localhost:8000/login/oauth/authorize?client_id=<client ID>&response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A8080%2Flogin&scope=read&state=app-built-in<public certificate>>

client ID를 이전에 복사한 ID로 변경하고 Casdoor의 공개 인증서를 입력하세요. 이는 Casdoor의 Certs 페이지에서 찾을 수 있습니다.

이전에 Hasura에 생성한 사용자 이름과 비밀번호를 입력하세요.

"로그인"을 클릭하세요

JWT 토큰 검색

Casdoor/Token 페이지로 돌아가세요.

토큰 페이지

이전에 입력한 사용자 이름을 찾은 다음 "편집"을 클릭하세요

액세스 토큰 복사

액세스 토큰

이제 액세스 토큰을 사용하여 인증된 요청을 만들 수 있습니다. Hasura는 데이터베이스의 모든 사용자를 반환하는 대신 적절한 사용자를 반환했습니다.

Casdoor에서 얻은 액세스 토큰이 Hasura에서 사용되는 것을 보여주는 사진