Schritt-für-Schritt-Anleitung für die Anmeldung mit Google und Apple

Diese Anleitung richtet sich an den Administrator eines White-Label-Kontos. Sie zeigt, was Sie bei Google und bei Apple anlegen müssen, damit Ihre Kunden auf Ihrer eigenen Domain Weiter mit Google und Weiter mit Apple nutzen können. Jeden Teil erledigen Sie einmal. Springen Sie unten zu Google oder Apple und schließen Sie unter Einstellungen > Anmeldung auf Ihrer Domain ab.

Beide Anbieter brauchen von Ihnen zwei Adressen. Einstellungen > Anmeldung auf Ihrer Domain zeigt sie für Ihre Domain an, jede mit einer Kopierschaltfläche: Kopieren Sie sie immer von dort und fügen Sie sie ein, tippen Sie sie nie ab, denn ein einziges falsches Zeichen genügt, damit der Anbieter die Anmeldung ablehnt. Sie sehen so aus, nur zur Orientierung:

• JavaScript origin: Ihre Domain mit https davor und nichts danach (kein Pfad, kein abschließender Schrägstrich)
• Google-Rücksprungadresse (Redirect URI): <your domain>/gorouter/ai/wl/oauth/google/callback
• Apple-Rücksprungadresse (Return URL): <your domain>/gorouter/ai/wl/oauth/apple/callback

Google und Apple benennen ihre Menüs von Zeit zu Zeit um. Entspricht eine Bezeichnung unten nicht genau dem, was Sie sehen, suchen Sie die ähnlichste: Die Schritte bleiben gleich.

Google#

Sie brauchen ein Google-Konto, das Sie selbst kontrollieren. Die hier verwendete einfache Anmeldung fragt nur nach Name, E-Mail-Adresse und Profilbild des Kunden (die Scopes openid, email und profile) und nach nichts sonst.

1. Anmelden und ein Projekt wählen#

1. Öffnen Sie die Google Cloud Console (console.cloud.google.com) und melden Sie sich mit Ihrem Google-Konto an.
2. Wählen Sie in der Projektauswahl in der oberen Leiste ein Projekt oder klicken Sie auf New project, geben Sie einen Namen ein und legen Sie es an. Achten Sie darauf, dass dieses Projekt ausgewählt ist, bevor Sie weitermachen.

2. Den Zustimmungsbildschirm einrichten#

Das ist der Bildschirm, den Google Ihren Kunden zeigt. Er liegt unter Google Auth Platform.

1. Öffnen Sie Google Auth Platform und klicken Sie auf Get started.
2. App information: Geben Sie den App-Namen ein, den Ihre Kunden wiedererkennen (Ihre eigene Marke, nicht unsere), und eine Support-E-Mail-Adresse.
3. Audience: Wählen Sie External. Internal lässt nur Konten Ihrer eigenen Google-Workspace-Organisation zu, was für Kunden nicht passt.
4. Contact information: Geben Sie eine E-Mail-Adresse ein, unter der Google Sie zum Projekt erreichen kann.
5. Akzeptieren Sie die Richtlinie zu Nutzerdaten und klicken Sie auf Create.

3. Testnutzer eintragen oder die App veröffentlichen#

Eine neue App beginnt im Status Testing. Dort beschränkt Google die Anmeldung auf die Adressen, die Sie eintragen, höchstens 100.

• Zum Eintragen öffnen Sie Audience, suchen Test users und fügen jede Google-Adresse hinzu, die sich anmelden wird. Tun Sie das für sich selbst und für alle, die die Anmeldung vor der Veröffentlichung ausprobieren.
• Damit sich jeder Kunde anmelden kann, veröffentlichen Sie die App: Ändern Sie unter Audience den Veröffentlichungsstatus mit der Schaltfläche zum Veröffentlichen von Testing auf In production. Da diese Anmeldung nur die einfachen Scopes openid, email und profile nutzt, verlangt Google keine Prüfung Ihrer Scopes und zeigt Kunden keine Warnung vor einer „nicht überprüften App“. Google kann dennoch verlangen, dass Sie Ihre Marke bestätigen, bevor App-Name und Logo auf dem Zustimmungsbildschirm erscheinen: Das Verification Center in der Google Auth Platform zeigt es Ihnen an.

4. Den Client anlegen#

1. Öffnen Sie in der Google Auth Platform Clients und klicken Sie auf Create client.
2. Wählen Sie als Application type Web application und vergeben Sie einen Namen.
3. Klicken Sie unter Authorized JavaScript origins auf Add URI und fügen Sie den JavaScript origin ein, den Sie aus Einstellungen > Anmeldung auf Ihrer Domain kopiert haben.
4. Klicken Sie unter Authorized redirect URIs auf Add URI und fügen Sie die Google-Rücksprungadresse ein, die Sie von derselben Stelle kopiert haben.
5. Klicken Sie auf Create.

5. Client ID und Client secret kopieren#

Google zeigt jetzt die Client ID und das Client secret. Kopieren Sie beide sofort. Bei einem neuen Client zeigt Google das Secret nur in diesem Moment und behält danach nur seine letzten vier Zeichen. Wenn Sie es verlieren, erzeugen Sie auf der Seite des Clients ein neues Secret.

6. In den Einstellungen abschließen#

Fügen Sie unter Einstellungen > Anmeldung auf Ihrer Domain die Client ID und das Client secret im Bereich Google ein, schalten Sie Google ein und speichern Sie.

Wenn Google ablehnt#

• Die Konsole akzeptiert die Rücksprungadresse wegen ihrer Domain nicht: Öffnen Sie Branding, suchen Sie Authorized domains und tragen Sie Ihre Domain ein, dann fügen Sie die Adresse erneut hinzu.
• redirect_uri_mismatch direkt nach dem Anlegen des Clients: Google braucht für eine Änderung von wenigen Minuten bis zu mehreren Stunden. Warten Sie und versuchen Sie es erneut. Bleibt der Fehler, vergleichen Sie die Adresse im Client mit der in den Einstellungen Zeichen für Zeichen.
• Der Zugriff wird nur für eine Person blockiert: Ist die App noch im Status Testing, tragen Sie die Adresse dieser Person unter Test users ein oder veröffentlichen Sie die App.

Apple#

Sie brauchen eine kostenpflichtige Mitgliedschaft im Apple Developer Program: Ohne sie lässt Apple Sie diese Elemente nicht anlegen. Alle Schritte unten erfolgen in Ihrem Apple-Developer-Konto (developer.apple.com/account) unter Certificates, Identifiers & Profiles.

1. Eine App ID mit Sign in with Apple#

Apple verknüpft eine Website mit einer App ID. Hat Ihr Konto schon eine App ID mit aktiviertem Sign in with Apple, verwenden Sie diese und gehen Sie zum nächsten Schritt. Andernfalls:

1. Öffnen Sie Identifiers und klicken Sie auf die Schaltfläche zum Hinzufügen (+).
2. Wählen Sie App IDs, dann den Typ App, und fahren Sie fort.
3. Geben Sie eine Beschreibung und eine Bundle ID Ihrer Wahl ein, zum Beispiel in der Form com.yourcompany.signin.
4. Haken Sie in der Liste der Capabilities Sign in with Apple an, fahren Sie fort und registrieren Sie.

2. Die Services ID anlegen#

1. Klicken Sie in Identifiers auf die Schaltfläche zum Hinzufügen (+), wählen Sie Services IDs und fahren Sie fort.
2. Geben Sie eine Beschreibung und eine Kennung Ihrer Wahl ein, zum Beispiel com.yourcompany.signin.web. Diese Kennung ist Ihre Services ID: Notieren Sie sie.
3. Fahren Sie fort und registrieren Sie, öffnen Sie dann die neue Services ID in der Liste.
4. Haken Sie Sign in with Apple an und klicken Sie auf Configure.
5. Wählen Sie als Primary App ID die App ID aus dem vorigen Schritt.
6. Tragen Sie bei den Website-URLs Ihre Domain unter Domains and Subdomains ein, ohne das Präfix https, zum Beispiel app.yourcompany.com.
7. Fügen Sie unter Return URLs die Apple-Rücksprungadresse ein, die Sie aus Einstellungen > Anmeldung auf Ihrer Domain kopiert haben.
8. Klicken Sie auf Done, dann auf Continue, dann auf Save.

3. Den Schlüssel anlegen#

1. Öffnen Sie Keys und klicken Sie auf die Schaltfläche zum Hinzufügen (+).
2. Geben Sie einen Schlüsselnamen ein, haken Sie Sign in with Apple an und klicken Sie daneben auf Configure.
3. Wählen Sie dieselbe Primary App ID und speichern Sie.
4. Fahren Sie fort und registrieren Sie den Schlüssel.
5. Klicken Sie auf Download und bewahren Sie die Datei auf, die auf .p8 endet. Apple lässt Sie sie nur einmal herunterladen. Eine Primary App ID kann höchstens zwei Schlüssel haben.
6. Notieren Sie die Key ID, die für den Schlüssel angezeigt wird.

4. Die Team ID finden#

Öffnen Sie in Ihrem Developer-Konto Membership details. Dort steht die Team ID, zehn Zeichen lang.

5. In den Einstellungen abschließen#

Geben Sie unter Einstellungen > Anmeldung auf Ihrer Domain im Bereich Apple die Services ID, die Team ID und die Key ID ein, laden Sie die .p8-Datei hoch, schalten Sie Apple ein und speichern Sie.

Gut zu wissen#

• Apple übermittelt den Namen eines Kunden nur bei der ersten Anmeldung, danach nicht mehr.
• Ein Kunde kann seine E-Mail verbergen. Apple gibt dann eine private Weiterleitungsadresse, die an die echte weiterleitet.
• Damit Ihre E-Mails diese Weiterleitungsadressen erreichen, registrieren Sie die Domain oder die Adresse, von der Sie senden, unter Sign in with Apple for Email Communication: Öffnen Sie in Certificates, Identifiers & Profiles den Bereich Services, klicken Sie daneben auf Configure und fügen Sie sie unter Email Sources hinzu. Veröffentlichen Sie außerdem einen SPF-Eintrag für diese Domain, wie Apple es verlangt.
• Lehnt Apple die Anmeldung ab, prüfen Sie, ob Domain und Rücksprungadresse in der Services ID genau die in den Einstellungen angezeigten sind und ob der Schlüssel nicht widerrufen wurde.

Wenn Sie fertig sind#

Schalten Sie eine Methode erst ein, wenn ihre Felder ausgefüllt sind, und speichern Sie. Probieren Sie sie in einem privaten Browserfenster auf Ihrer eigenen Domain aus. Die kurze Übersicht der Funktion steht im Artikel Anmeldung auf Ihrer Domain mit Google, Apple oder einem Code per E-Mail.