SDK für Unity / Anmeldung über soziale Netzwerke
  Alle Dokumentation

SDK für Unity

Anmeldung über soziale Netzwerke

Sie können den Benutzern Ihrer Anwendung gestatten, sich über ihr Social-Media-Konto anzumelden. Wenn sich der Benutzer zum ersten Mal über ein soziales Netzwerk anmeldet, wird automatisch ein neues Konto erstellt. Der Benutzer muss weder einen Benutzernamen noch eine E-Mail-Adresse oder andere Daten eingeben.

Es gibt zwei Wege, die Authentifizierung über soziale Netzwerke zu implementieren:

  • Webbasierte Authentifizierung. In diesem Fall öffnet die Anwendung eine Eingabemaske im Browser, um die Authentifizierung über das ausgewählte soziale Netzwerk abzuschließen. Diese Option eignet sich sowohl für mobile Apps als auch für Desktop-Anwendungen.
  • Native Authentifizierung. In diesem Fall erfolgt die Authentifizierung in der Social-Media-App auf dem Gerät des Benutzers. Diese Option ist nur für mobile Apps geeignet.

Hinweis
Damit sich die Benutzer Ihrer iOS-Anwendung per Apple-ID, Face ID oder Touch ID authentifizieren können, müssen Sie die webbasierte Authentifizierung implementieren. In diesem Fall verwenden die SDK-Methoden native iOS-Bibliotheken.

Soziale Netzwerke können als primäre oder alternative Authentifizierungsmethode Ihrer Anwendung dienen.

Wenn Sie soziale Netzwerke als alternative Authentifizierungsmethode verwenden, wird das Social-Media-Konto automatisch mit einem bestehenden Benutzerkonto verknüpft, sofern die folgenden Bedingungen erfüllt sind:

  • Ein Benutzer, der sich mittels Benutzername/E-Mail-Adresse und Passwort registriert hat, meldet sich über sein Social-Media-Konto bei Ihrer Anwendung an.
  • Das soziale Netzwerk gibt eine E-Mail-Adresse zurück.
  • Die E-Mail-Adresse des Benutzers in einem sozialen Netzwerk stimmt überein mit der E-Mail-Adresse, die bei der Registrierung in Ihrer Anwendung angegeben wurde.

Ebenso können Sie die manuelle Verknüpfung eines sozialen Netzwerks implementieren.

Anleitungen

Erfahren Sie mehr über erweiterte Einrichtungen in unseren Anleitungen.

So richten Sie die webbasierte Authentifizierung über soziale Netzwerke ein

Das SDK unterstützt die folgenden Anbieter sozialer Netzwerke:

  • Amazon
  • Apple
  • Baidu
  • Battle.net
  • Discord
  • Facebook
  • GitHub
  • Google
  • Kakao
  • LinkedIn
  • MSN
  • Mail.ru
  • Microsoft
  • Naver
  • Odnoklassniki
  • PayPal
  • QQ
  • Reddit
  • Steam
  • Twitch.tv
  • Twitter
  • VK
  • Vimeo
  • WeChat
  • Weibo
  • Xbox Live
  • Yahoo
  • Yandex
  • YouTube

So richten Sie die Authentifizierung über Webdienste ein:

  1. Ergänzen Sie die Benutzeroberfläche der Anwendung um Schaltflächen für die Authentifizierung über soziale Netzwerke.
  2. Binden Sie im Kundenportal Social-Media-Dienste für ein Login-Projekt ein.
  3. Implementieren Sie die Authentifizierungslogik aufseiten der Anwendung.

Soziale Netzwerke für Login-Projekte im Kundenportal einbinden

Achtung
Im Kundenportal muss die Optionen Passwortlose Anmeldung oder Anmeldung über soziale Netzwerke für das der Anwendung zugeordnete Login-Projekt ausgewählt sein. Sie können die Anmeldemethode später ändern, indem Sie auf den Link Anmeldemethode ändern klicken. Zuvor gespeicherte Einstellungen gehen dabei nicht verloren.
  1. Öffnen Sie Ihr Projekt im Kundenportal.
  2. Klicken Sie in der Seitenleiste auf Login.
  3. Klicken Sie beim gewünschten Login-Projekt auf Konfigurieren.
  4. Scrollen Sie auf der Navigationsseite zum Block Authentifizierung, und klicken Sie auf Anmeldung über soziale Netzwerke.
  1. Verknüpfen Sie die sozialen Netzwerke, über die sich die Spieler registrieren und bei der Anwendung anmelden dürfen:
    • Klicken Sie auf das ⚙-Symbol und dann auf Verknüpfen, um ein soziales Netzwerk zu verknüpfen.
    • Um mehrere soziale Netzwerke auf einmal zu verknüpfen, wählen Sie die gewünschten Anzeigebereiche aus (deren Umrandung färbt sich daraufhin grün). Klicken Sie danach auf das Drop-down-Menü Verwalten, und wählen Sie Verknüpfen aus.
    • Um alle verfügbaren sozialen Netzwerke auf einmal zu verknüpfen, klicken Sie auf Alle auswählen. Klicken Sie danach auf das Drop-down-Menü Verwalten, und wählen Sie Verknüpfen aus.
Hinweis
Die Anwendungs-ID und der geheime Schlüssel von Xsolla werden standardmäßig für die Authentifizierung verwendet. Wurde Ihre Anwendung in einem Entwicklerkonto des Social-Media-Anbieters eingerichtet, können Sie Ihre eigene Anwendungs-ID und Ihren eigenen geheimen Schlüssel angeben. Ausführliche Anweisungen zum Auffinden der Anwendungs-ID und des geheimen Schlüssels finden Sie im Kundenportal in den Einstellungen auf der Karte des jeweiligen sozialen Netzwerks.

Integration aufseiten der Anwendung

Implementieren Sie die folgende die Logik, die beim Klick auf die Social-Media-Schaltfläche abläuft:

  1. Für Desktop-Anwendungen:
    1. Rufen Sie die URL der Registrierungs-/Anmeldeseite mithilfe der SDK-Methode GetSocialNetworkAuthUrl ab.
    2. Öffnen Sie die Registrierungs-/Anmeldeseite in einem Browser mithilfe der Methode BrowserHelper.Instance.InAppBrowser.
    3. Abonnieren Sie das Ereignis URL-Änderung. Fügen Sie dazu den Rückruf BrowserHelper.Instance.InAppBrowser.AddUrlChangeHandler(OnUrlChanged) hinzu.
    4. Tracken Sie die Änderung der Seiten-URL nach einer erfolgreichen Benutzerauthentifizierung.
    5. Rufen Sie den Authentifizierungscode aus der URL der aktiven Seite ab. Dazu können Sie die SDK-Hilfsmethode ParseUtils.TryGetValueFromUrl() nutzen.
    6. Tauschen Sie den Authentifizierungscode gegen einen Token mithilfe der SDK-Methode ExchangeCodeToToken, und nutzen Sie den Token in Anfragen an die Xsolla-Server.
Hinweis

Ein Beispiel für die Implementierung dieser Logik finden Sie im Skript Assets/Xsolla.Demo/Login/Scripts/Login/Auth/SocialAuth.cs des Demoprojekts.

Die Anmeldung über soziale Netzwerke ist in externen Browsern nicht möglich. Das SDK enthält einen integrierten Browser, entwickelt von Xsolla für Desktop-Anwendungen. Sie können entweder Xsollas integrierten Browser verwenden oder eine andere integrierte Browser-Lösung, sofern sich damit URL-Änderungen tracken lassen.

  1. Für Android-Anwendungen:
    1. Erstellen Sie ein Objekt der Klasse AndroidSDKSocialAuthHelper.
    2. Rufen Sie die Methode PerformSocialAuth auf, und übermitteln Sie ihr die folgenden Parameter:
      • SocialProvider – Name des sozialen Netzwerks
      • onSuccess – Rückruf bei erfolgreicher Benutzerauthentifizierung
      • onCancelled – Rückruf bei Abbruch der Benutzerauthentifizierung
      • onError – Rückruf bei einem Fehler
    3. Verwenden Sie den Token, den der Rückruf onSuccess im Parameter token zurückgibt, in Anfragen an die Xsolla-Server.
Hinweis
Ein Beispiel für die Implementierung dieser Logik finden Sie im Skript Assets/Xsolla.Demo/Login/Scripts/Login/Auth/AndroidSocialAuth.cs des Demoprojekts.
  1. Für iOS-Anwendungen:
    1. Erstellen Sie ein Objekt der Klasse IosSDKSocialAuthHelper.
    2. Rufen Sie die Methode PerformSocialAuth auf, und übermitteln Sie ihr die folgenden Parameter:
      • SocialProvider – Name des sozialen Netzwerks
      • onSuccess – Rückruf bei erfolgreicher Benutzerauthentifizierung
      • onCancelled – Rückruf bei Abbruch der Benutzerauthentifizierung
      • onError – Rückruf bei einem Fehler
    3. Verwenden Sie den Token, den der Rückruf onSuccess im Feld access_token des Objekts LoginOAuthJsonResponse zurückgibt, in Anfragen an die Xsolla-Server.
Hinweis
Ein Beispiel für die Implementierung dieser Logik finden Sie im Skript Assets/Xsolla.Demo/Login/Scripts/Login/Auth/IosSocialAuth.cs des Demoprojekts.
War dieser Artikel hilfreich?
Vielen Dank!
Gibt es etwas, das wir verbessern können? Nachricht
Das tut uns leid
Bitte erläutern Sie, weshalb dieser Artikel nicht hilfreich ist. Nachricht
Vielen Dank für Ihr Feedback!
Wir werden Ihr Feedback aufgreifen und dazu nutzen, Ihr Erlebnis verbessern.
Ausblenden

So richten Sie die native Authentifizierung über soziale Netzwerke ein

Mit der nativen Authentifizierung können sich Benutzer über ein auf einem mobilen Gerät konfigurierten Social-Media-Konto bei Ihrer Anwendung anmelden.

Wenn sich ein Benutzer zum ersten Mal anmeldet, wird die Social-Media-Anwendung gestartet und bittet um Erlaubnis, den Benutzer zu authentifizieren. Danach erfolgt die Authentifizierung automatisch, ohne dass der Benutzer etwas tun muss.

Derzeit unterstützt das SDK die native Authentifizierung über die folgenden sozialen Netzwerke:

  • Google
  • Facebook
  • WeChat
  • QQ

So konfigurieren Sie die native Authentifizierung:

  1. Ergänzen Sie die Benutzeroberfläche der Anwendung um Schaltflächen für die Authentifizierung über soziale Netzwerke.
  2. Erstellen Sie die Build Ihres Unity-Projekts für Android.
  3. Konfigurieren Sie die Anwendung im Entwicklerkonto des entsprechenden sozialen Netzwerks:
    1. Gehen Sie für die Authentifizierung über Facebook wie folgt vor:
      1. Registrieren Sie sich, und erstellen Sie eine neue Anwendung.
      2. Konfigurieren Sie die Anwendungsseite in Ihrem Facebook-Entwicklerkonto.
    2. Konfigurieren Sie für die Authentifizierung über Google das Projekt in der Google API Console.
    3. Gehen Sie für die Authentifizierung über WeChat wie folgt vor:
      1. Registrieren Sie sich, und erstellen Sie eine neue Anwendung.
      2. Reichen Sie die Anwendung zur Überprüfung ein.
    4. Gehen Sie für die Authentifizierung über QQ wie folgt vor:
      1. Registrieren Sie sich, und erstellen Sie eine neue Anwendung.
      2. Reichen Sie die Anwendung zur Überprüfung ein.

  1. Konfigurieren Sie die Authentifizierung über soziale Netzwerke aufseiten von Xsolla:
    1. Für Facebook bzw. Google müssen Sie das jeweilige soziale Netzwerk im Kundenportal einbinden.
    2. Für WeChat und QQ müssen Sie sich an Ihren Account Manager wenden.
  2. Konfigurieren Sie das Asset für Ihr Unity-Projekt.
  3. Implementieren Sie die Authentifizierungslogik aufseiten der Anwendung.

Unity-Projekt-Build für Android erstellen

  1. Wechseln Sie zu Ihrem Unity-Projekt.
  2. Klicken Sie im Hauptmenü auf File > Build settings.
  3. Klicken SIe im Platform-Fensterbereich auf Android.
  4. Klicken Sie auf Build.

Zur weiteren Konfiguration der nativen Authentifizierung benötigen Sie Folgendes:

  • Paketname. Diesen finden Sie im Inspector-Fensterbereich im Feld Package Name nach Auswahl von Android als Plattform unter File > Build settings.
  • Android-Klassenname – der Klassenname der Hauptaktivität, einschließlich des Namespace der Anwendung (z. B.: com.domain.appname.activity). Den Klassennamen finden Sie in der AndroidManifest.xml. Das Hauptaktivität-Tag sollte ein intent-filter-Tag mit der Aktion android.intent.action.MAIN und der Kategorie android.intent.category.LAUNCHER enthalten.
  • Android-Hashkey. Dieser lässt sich per OpenSSL abrufen.

Anwendungsseite in Ihrem Facebook-Entwicklerkonto einrichten

  1. Wechseln Sie in die Projekteinstellungen des Facebook-Entwicklerkontos.
  2. Navigieren Sie zu Einstellungen > Allgemeines.
  3. Klicken Sie auf Plattform hinzufügen, und wählen Sie Android aus.
  4. Geben Sie den Paketnamen aus Ihrem Unity-Projekt im Feld Google Play Package-Name an.
  5. Geben Sie den Android-Klassennamen aus Ihrem Unity-Projekt im Feld Klassenname an.
  6. Geben Sie den Android-Haskey aus Ihrem Untiy-Projekt im Feld Key-Hashes an.
  7. Klicken Sie auf Änderungen speichern.

Zur weiteren Konfiguration der nativen Authentifizierung benötigen Sie eine App-ID und einen App-Geheimcode. Beide finden Sie in den Projekteinstellungen unter Einstellungen > Allgemeines.

Projekt in der Google API Console einrichten

  1. Wechseln Sie zur Google API Console.
  2. Klicken Sie auf Neues Projekt.
  3. Geben Sie den Projektnamen und den Speicherort an, und klicken Sie auf Erstellen.
  4. Wechseln Sie zum erstellten Projekt, und klicken Sie im Seitenmenü auf OAuth-Zustimmungsbildschirm.
  5. Wählen Sie die Option Extern aus, und klicken Sie auf Erstellen.
  6. Geben Sie die nötigen Parameter an, und klicken Sie auf Speichern.
  7. Klicken Sie im Seitenmenü auf Anmeldedaten.
  8. Erstellen Sie einen OAuth 2.0-Client für die Unity-Anwendung:
    1. Klicken Sie auf Anmeldedaten erstellen, und wählen Sie OAuth-Client-ID aus.
    2. Wählen Sie unter Anwendungstyp die Option Android aus.
    3. Geben Sie einen Namen an.
    4. Geben Sie den Paketnamen aus dem Unity-Projekt im Feld Paketname an.
    5. Geben Sie den Android-Hashkey aus dem Unity-Projekt im Feld SHA-1-Zertifikatfingerabdruck an.
    6. Klicken Sie auf Erstellen.
    7. Klicken Sie auf OK.
  1. Erstellen Sie einen OAuth 2.0-Client für die Webanwendung:
    1. Klicken Sie auf Anmeldedaten erstellen, und wählen Sie OAuth-Client-ID aus.
    2. Wählen Sie unter Anwendungstyp die Option Webanwendung aus.
    3. Geben Sie einen Namen an.
    4. Klicken Sie unter Autorisierte Weiterleitungs-URIs auf URI hinzufügen, und geben Sie folgende URI an: https://login.xsolla.com/api/social/oauth2/callback.
    5. Klicken Sie auf Erstellen.
    6. Klicken Sie auf OK.

Zur weiteren Konfiguration der nativen Authentifizierung benötigen Sie eine Client-ID und einen Clientschlüssel. Beide finden Sie in den Einstellungen der Client-ID für die Webanwendung.

Soziale Netzwerke für Login-Projekte im Kundenportal einbinden

Achtung
Im Kundenportal muss die Optionen Passwortlose Anmeldung oder Anmeldung über soziale Netzwerke für das der Anwendung zugeordnete Login-Projekt ausgewählt sein. Sie können die Anmeldemethode später ändern, indem Sie auf den Link Anmeldemethode ändern klicken. Zuvor gespeicherte Einstellungen gehen dabei nicht verloren.
  1. Öffnen Sie Ihr Projekt im Kundenportal.
  2. Klicken Sie in der Seitenleiste auf Login.
  3. Klicken Sie beim gewünschten Login-Projekt auf Konfigurieren.
  4. Scrollen Sie auf der Navigationsseite zum Block Authentifizierung, und klicken Sie auf Anmeldung über soziale Netzwerke.
  1. Klicken Sie auf der Karte des gewünschten sozialen Netzwerks, rechts neben dem Titel, auf das ⚙-Symbol und dann auf Verknüpfen.
Hinweis
Um die Autorisierung über soziale Netzwerke verwenden zu können, müssen Sie die Anwendungs-ID und den geheimen Schlüssel der Anwendung in Ihrem Projekt eingeben. Das können Sie in den Einstellungen auf der Karte des jeweiligen sozialen Netzwerks erledigen. Die Anwendungs-ID und den geheimen Schlüssel finden Sie im Entwicklerkonto des Social-Media-Anbieters. Detaillierte Anweisungen dazu finden Sie im Kundenportal in den Einstellungen auf der Karte des jeweiligen sozialen Netzwerks.

Inhalte für Ihr Unity-Projekt einrichten

  1. Wechseln Sie zu Ihrem Unity-Projekt.
  2. Klicken Sie im Hauptmenü auf Window > Xsolla > Edit Settings.
  3. Geben Sie die Anwendungs-ID an:
    1. Geben Sie die App-ID aus Ihrem Facebook-Entwicklerkonto im Feld Facebook App ID an.
    2. Geben Sie die Client-ID für eine Webanwendung aus der Google API Console im Feld Google server ID an.
    3. Geben Sie die AppID aus den WeChat-Anwendungseinstellungen im Feld WeChat App ID an.
    4. Geben Sie die AppID aus den QQ-Anwendungseinstellungen im Feld QQ App ID an.

Integration aufseiten der Anwendung

Implementieren Sie die folgende Logik, wenn Sie auf die soziale Anmeldeschaltfläche klicken:

  • Für Android-Anwendungen erstellen Sie eine Instanz von AndroidSDKSocialAuthHelper und rufen die Methode PerformSocialAuth auf. Ein Implementierungsbeispiel ist im Skript Assets/Xsolla.Demo/Login/Scripts/Login/Auth/AndroidSocialAuth.cs im Demoprojekt enthalten.
  • Für iOS-Anwendungen erstellen Sie eine Instanz von IosSDKSocialAuthHelper und rufen die Methode PerformSocialAuth auf. Ein Implementierungsbeispiel ist im Skript Assets/Xsolla.Demo/Login/Scripts/Login/Auth/IosSocialAuth.cs im Demoprojekt enthalten.
War dieser Artikel hilfreich?
Vielen Dank!
Gibt es etwas, das wir verbessern können? Nachricht
Das tut uns leid
Bitte erläutern Sie, weshalb dieser Artikel nicht hilfreich ist. Nachricht
Vielen Dank für Ihr Feedback!
Wir werden Ihr Feedback aufgreifen und dazu nutzen, Ihr Erlebnis verbessern.
Ausblenden

Nützliche Links

Letztmalig aktualisiert: 10. Oktober 2023

Haben Sie einen Tippfehler oder einen anderen Textfehler gefunden? Wählen Sie den Text aus und drücken Sie Strg+Eingabe.

Problem melden
Wir überprüfen unsere Inhalte ständig. Ihr Feedback hilft uns, sie zu verbessern.
Geben Sie eine E-Mail-Adresse an, damit wir Sie erreichen können
Vielen Dank für Ihr Feedback!