FedCM 업데이트: Domain Hint API

Eiji Kitamura

Chrome 123부터 Federated Credential Management API(FedCM)와 함께 도메인 힌트를 사용할 수 있습니다. Domain Hint API를 사용하면 개발자가 수락한 도메인의 제휴 로그인 계정만 표시하여 더 나은 사용자 환경을 제공할 수 있습니다.

Domain Hint API

FedCM을 사용하면 사용자가 ID 공급업체 (IdP)에서 제공한 계정 정보를 사용하여 신뢰 당사자 (웹사이트를 가리키는 RP)에 더 쉽게 로그인할 수 있습니다. 하지만 RP가 이미 특정 도메인과 연결된 계정만 사이트에 로그인할 수 있다는 사실을 알고 있는 경우도 있습니다. 이는 액세스하는 사이트가 기업 도메인으로 제한된 엔터프라이즈 시나리오에서 특히 일반적입니다. 더 나은 사용자 환경을 제공하기 위해 FedCM API는 RP에 로그인하는 데 사용할 수 있는 계정만 RP에 표시하도록 허용합니다. 이렇게 하면 사용자가 회사 도메인 외부의 계정을 사용하여 RP에 로그인하려고 하는데 올바른 계정 유형이 사용되지 않아 나중에 오류 메시지가 표시되거나 로그인이 작동하지 않는 경우 무음으로 표시되는 시나리오를 방지할 수 있습니다.

Domain Hint API를 사용하면 RP가 FedCM API 호출에서 domainHint 속성을 지정하여 사용자와 일치하는 계정만 표시할 수 있습니다. IdP는 계정 목록 엔드포인트의 응답의 일부로 domain_hints 속성을 제공하여 계정이 연결된 도메인을 나타낼 수 있습니다. 이렇게 하면 브라우저가 요청된 도메인 힌트를 IdP에 공개하지 않고도 일치하는 계정을 표시할 수 있습니다.

계정 목록 엔드포인트의 JSON 응답 예는 다음과 같습니다.

{
 "accounts": [{
   "id": "1234",
   "given_name": "John",
   "name": "John Doe",
   "email": "john_doe@idp.example",
   "picture": "https://idp.example/profile/123",
   "approved_clients": ["123", "456", "789"],
  }, {
   "id": "5678",
   "given_name": "Johnny",
   "name": "Johnny",
   "email": "johnny@idp.example",
   "picture": "https://idp.example/profile/456"
   "approved_clients": ["abc", "def", "ghi"],
   "domain_hints": ["corp.example"]
  }]
}

RP는 domainHint 속성이 있는 navigator.credentials.get()를 호출하여 계정을 필터링할 수 있습니다. 예를 들어 사용자가 corp-partner.example을 방문하여 corp.example의 계정으로 로그인한다고 가정해 보겠습니다. 사이트에서는 다음과 같이 API를 호출합니다.

return await navigator.credentials.get({
  identity: {
    providers: [{
      configURL: "https://idp.example/manifest.json",
      clientId: "abc",
      nonce: nonce,
      domainHint : "corp.example"
    }]
  }
});

domainHint 값은 IdP의 지문 식별 벡터가 될 수 있으므로 서버 측 필터링을 위해 계정 목록 엔드포인트로 전송되지 않습니다. 대신 Chrome은 평소와 같이 FedCM 요청을 수행하고 navigator.credentials.get() 호출에서 지정된 domainHint 값과 일치하지 않는 계정을 필터링합니다. 그런 다음 Chrome은 새 계정 목록이 포함된 FedCM 대화상자를 사용자에게 표시합니다. 이 접근 방식은 Login Hint API와 비슷하지만 이 두 API는 서로 다른 질문에 답변합니다. Login Hint API는 '원하는 사용자의 식별자는 무엇인가요?'라는 질문에 답하는 것을 목표로 하고, Domain Hint는 '이 계정이 속해야 하는 회사 또는 서버는 무엇인가요?'라는 질문에 답하는 것을 목표로 합니다.

domainHint: "any"가 사용되면 Chrome은 도메인이 없는 계정 (즉, domain_hints가 전달되지 않거나 비어 있는 계정)을 필터링합니다. 예를 들어 RP가 가입 프로세스에서 관리 계정만 허용하는 사용 사례를 허용합니다.

domainHint와 일치하는 계정이 없으면 FedCM 대화상자에 로그인 프롬프트가 표시됩니다. 이 메시지를 통해 사용자는 RP가 요청한 힌트와 일치하는 IdP 계정에 로그인할 수 있습니다. 사용자가 메시지를 탭하면 구성 파일에 지정된 로그인 URL로 팝업 창이 열립니다. 그러면 링크에 로그인 힌트와 도메인 힌트 쿼리 매개변수가 추가됩니다.