Passer au contenu principal
Ce tutoriel a pour but de vous guider dans l’authentification PlayFab avec Facebook et HTML5/JavaScript.

Configuration requise

Si vous n’êtes pas sûr de disposer de la configuration requise pour cette activité, consultez le tutoriel Exécution d’un serveur HTTP pour les tests.

Serveur et domaine

Parmi les conditions requises pour configurer votre authentification PlayFab, vous devez disposer d’un serveur avec un domaine valide. Si vous n’avez pas encore de domaine inscrit ni de serveur web distant, suivez notre tutoriel Exécution d’un serveur HTTP pour les tests pour exécuter un serveur web local avec un nom de domaine valide. Tout au long de ce guide, nous supposerons que votre domaine est ['http://playfab.example'](http://playfab.example).

Inscription d’une application Facebook

Commencez par accéder au portail des développeurs Facebook.
  1. Sélectionnez le bouton My Apps.
Facebook : ajouter une nouvelle application
  1. Sélectionnez Create App pour créer une nouvelle application.
Facebook : créer une nouvelle application Une nouvelle fenêtre contextuelle Application s’ouvre.
  1. Entrez un nom pour votre Application dans le champ sous Add an app name.
  2. Entrez une adresse e-mail de contact dans le champ sous App contact email.
  3. Sélectionnez le bouton Create app pour enregistrer.
Veillez à choisir votre propre nom d’application unique et votre propre adresse e-mail, comme illustré dans l’exemple ci-dessous.
Facebook : nouvel ID d'application
  1. Accédez à l’onglet Settings.
  2. Sélectionnez le sous-onglet Basic.
  3. Repérez votre App ID.
Copiez votre App ID en lieu sûr ; nous l’utiliserons plus tard pour configurer le Facebook SDK.
Facebook : enregistrer l'ID d'application
  1. Accédez au menu situé à gauche de votre écran et sélectionnez l’élément Products.
  2. Repérez Configure dans la zone Facebook Login et sélectionnez Settings dans le menu déroulant.
Facebook Login : prise en main La page doit s’ouvrir et afficher l’exemple illustré ci-dessous.
  1. Vérifiez que Client OAuth et Web OAuth sont tous deux activés (marqués Yes).
  2. Définissez Valid OAuth redirect URIs sur l’URI de votre propre page d’authentification.
Dans votre cas, il s’agit de playfab.example.
Paramètres du produit Facebook Login Dans l’écran Client OAuth Settings :
  1. Vérifiez que Login with the JavaScript SDK est activé (marqué Yes)
  2. Définissez Valid OAuth redirect URIs sur l’URI de votre propre page d’authentification.
Dans votre cas, il s’agit de playfab.example.
  1. Sélectionnez Save Changes pour valider.
Facebook : définir l'URI de redirection OAuth Dans la page Application Manager :
  • Ouvrez Settings/Basic (1) dans votre menu.
  • Sélectionnez le bouton Add Platform (2).
Facebook Application Manager : ajouter une plateforme Une fenêtre contextuelle apparaît à l’écran :
  1. Sélectionnez l’icône Website.
  2. Sélectionnez ensuite Next.
Facebook : options de la plateforme Website Le panneau de configuration Website doit maintenant apparaître.
  1. Dans le champ Site URL, entrez l’URL de votre page d’authentification (dans votre cas, playfab.example).
  2. Sélectionnez Save changes pour valider.
Panneau de configuration du site web Facebook

Test

Utilisez le fichier HTML suivant pour tester votre authentification PlayFab avec Facebook.
Veillez à remplacer YOUR-APPLICATION-ID et YOUR-PLAYFAB-TITLE par vos propres valeurs.
Demandez ce fichier à votre serveur en utilisant le domaine que vous avez configuré lors de la configuration de l’application Facebook (playfab.example dans notre cas).
  1. Une fois la page Facebook Auth Example ouverte, sélectionnez le bouton Log In with Facebook.
  2. Suivez les instructions de Facebook dans la fenêtre contextuelle.
Observez la sortie. Exemple d'authentification Facebook Vous obtiendrez un ticket de session PlayFab. À ce stade, vous avez correctement configuré l’authentification PlayFab et Facebook avec HTML5 et JavaScript.
Dernière modification le 6 octobre 2026