IdentityProvider: statische Methode getUserInfo()

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

Die statische Methode getUserInfo() der IdentityProvider-Schnittstelle gibt Informationen über einen angemeldeten Benutzer zurück. Diese können verwendet werden, um eine personalisierte Willkommensnachricht und eine Anmeldeschaltfläche anzuzeigen. Die Methode muss innerhalb eines vom IdP stammenden <iframe> aufgerufen werden, damit Skripte der Relying Party (RP) nicht auf die Daten zugreifen können. Der Aufruf muss erfolgen, nachdem sich der Benutzer bei einer RP-Website angemeldet hat.

Dieses Muster ist auf Websites, die Identity Federation für die Anmeldung verwenden, bereits verbreitet. getUserInfo() ermöglicht es jedoch, es ohne Drittanbieter-Cookies umzusetzen.

Syntax

IdentityProvider.getUserInfo(config)

Parameter

config

Ein Konfigurationsobjekt, das die folgenden Eigenschaften enthalten kann:

configURL: Die URL der Konfigurationsdatei des Identitätsanbieters, von dem Sie Benutzerinformationen abrufen möchten.
clientId: Die vom IdP vergebene Client-Kennung der RP.

Rückgabewert

Ein Promise, das mit einem Array von Objekten erfüllt wird. Jedes Objekt enthält Informationen zu einem eigenen Benutzerkonto und hat die folgenden Eigenschaften:

email: Ein String mit der E-Mail-Adresse des Benutzers.
name: Ein String mit dem vollständigen Namen des Benutzers.
givenName: Ein String mit dem Vornamen oder einer Kurzform des Namens des Benutzers.
picture: Ein String mit der URL des Profilbilds des Benutzers.

Ausnahmen

InvalidStateError DOMException: Wird ausgelöst, wenn die angegebene configURL ungültig ist oder der Origin des eingebetteten Dokuments nicht mit der configURL übereinstimmt.
NetworkError DOMException: Wird ausgelöst, wenn der Browser keine Verbindung zum IdP herstellen kann oder getUserInfo() aus dem Top-Level-Dokument aufgerufen wird.
NotAllowedError DOMException: Wird ausgelöst, wenn das einbettende <iframe> keine identity-credentials-get-Permissions-Policy hat, die die Verwendung von getUserInfo() erlaubt, oder wenn die FedCM API durch eine Richtlinie des Top-Level-Dokuments global deaktiviert ist.

Beschreibung

Wenn getUserInfo() aufgerufen wird, sendet der Browser nur dann eine Anfrage an den Endpunkt für die Kontenliste des angegebenen IdP, um Benutzerinformationen abzurufen, wenn beide folgenden Bedingungen erfüllt sind:

Der Benutzer hat sich zuvor über FedCM beim IdP auf derselben Browserinstanz bei der RP angemeldet, und die Daten wurden nicht gelöscht.
Der Benutzer ist auf derselben Browserinstanz beim IdP angemeldet.

getUserInfo() muss innerhalb eines eingebetteten <iframe> aufgerufen werden, und der Origin der eingebetteten Website muss mit der configURL des IdP übereinstimmen. Außerdem muss der einbettende HTML-Code die Verwendung über die identity-credentials-get-Permissions-Policy ausdrücklich erlauben:

html

<iframe
  src="https://idp.example/signin"
  allow="identity-credentials-get"></iframe>

Beispiele

Grundlegende Verwendung von `IdentityProvider.getUserInfo()`

Das folgende Beispiel zeigt, wie die Methode IdentityProvider.getUserInfo() verwendet werden kann, um Informationen über einen Benutzer abzurufen, der sich zuvor über einen bestimmten IdP angemeldet hat.

// Iframe displaying a page from the https://idp.example origin
const userInfo = await IdentityProvider.getUserInfo({
  configURL: "https://idp.example/fedcm.json",
  clientId: "client1234",
});

// IdentityProvider.getUserInfo() returns an array of user information.
if (userInfo.length > 0) {
  // Returning accounts should be first, so the first account received
  // is guaranteed to be a returning account
  const name = userInfo[0].name;
  const givenName = userInfo[0].given_name;
  const displayName = givenName || name;
  const picture = userInfo[0].picture;
  const email = userInfo[0].email;

  // …

  // Render the personalized sign-in button using the information above
}

Spezifikationen

Spezifikation
Federated Credential Management API # dom-identityprovider-getuserinfo

Browser-Kompatibilität

Siehe auch

Federated Credential Management API auf developer.chrome.com (2023)

Help improve MDN

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden