Partager

Comment se connecter avec un compte Google en utilisant PHP et MySQLi.

Apprenez à vous connecter avec un compte Google en utilisant PHP et MySQL.

Vous essayez d'ajouter une fonctionnalité de connexion à un compte social à votre application web, comme la connexion avec un compte Gmail. Voici un tutoriel rapide.

Google dispose d'une API oAuth qui permet aux utilisateurs de se connecter à des applications Web en utilisant les informations d'identification de leur compte Gmail.

Après l'authentification auprès de Google, les utilisateurs n'ont pas à remplir un formulaire d'inscription. Ils peuvent accéder au site Web directement après s'être inscrits.

Cette fonctionnalité vous permettra d'attirer davantage de visiteurs sur votre site Web. Il est facile de se connecter et c'est rapide. Vous pouvez également utiliser cette fonctionnalité pour partager les données de session des utilisateurs avec les données du compte Google via MySQLi.

Connexion au compte Google avec PHP

Commençons. Nous allons décrire les étapes pour accéder à l'API Oauth de Google.

Pour accéder à l'API Oauth de Google, vous devez d'abord créer un projet Google. Suivez ces étapes.

Étapes pour créer un projet Google API Console

Étape 1 : Ouvrez Google API Console.

( Voici le lien : console.cloud.google.com) service API

Étape 2 : Sélectionnez l'option Sélectionner un projet, comme indiqué ci-dessous.

console.cloud.google.PNG

Étape 3 : Vous pouvez rechercher des projets qui ont été créés précédemment ou cliquer sur l'option "Nouveau projet", pour créer un projet.

Saisissez votre nom de projet et Google créera automatiquement un ID de projet. Ce nom peut être modifié mais doit rester unique au niveau mondial.

select google project

Étape 4 : Ensuite, cliquez sur l'option de l'écran de consentement OAuth. Choisissez votre type d'utilisateur en fonction de vos besoins.

google project setting

Saisissez le nom de votre application, l'adresse électronique du support et les domaines autorisés, puis cliquez sur Enregistrer pour sauvegarder. Vous pouvez suivre les étapes indiquées dans l'image ci-dessous pour choisir la portée.

google project setting consent

Étape 5 : Sélectionnez la bibliothèque "Personnes".

google project add library

Étape 6 : Activer la bibliothèque

google project enable library

Étape 7 : Cliquez sur "+ CRÉER UNE RÉSIDENCE". Il vous sera demandé de sélectionner le type d'identifiant que vous souhaitez créer.

Sélectionnez l'option OAuth Client ID.

google project create client ids

Étape 8 : Ensuite, sélectionnez votre type d'application et 'Web app'. Tout dépend de l'endroit où vous souhaitez mettre en œuvre la fonctionnalité Login With Google. Vous pouvez choisir l'option appropriée en fonction de vos besoins.

Vous devrez soumettre une URL de rappel pour votre domaine dans la section URL de redirection autorisée. Comme nous l'avons fait pour notre application Web :

Exemple d'URL de redirection : https://www.yourdomain.com/callback.php

google project client id data

Cette URL sera utilisée pour envoyer le code API de Google et récupérer les données du profil de l'utilisateur.

Votre ID client pour l'application web a été créé avec succès. Pour toute configuration ultérieure de votre application web, notez votre ID client et votre clé secrète client.

google project credentials

Installer la bibliothèque client Google PHP SDK

La fonctionnalité de connexion avec un compte Google sera implémentée via la configuration de la bibliothèque client Google PHP SDK. Cette opération sera effectuée sur un serveur Web.

Cette bibliothèque peut être configurée de deux façons.

Via composer :

Utilisez la commande suivante pour installer cette bibliothèque via composer

$composer require google/apiclient :"^2.0"

Télécharger les fichiers de la bibliothèque et les charger manuellement

Téléchargez la version la plus récente de la bibliothèque client en vous rendant sur la page de l'API Google.

Dans cet exemple, nous avons téléchargé manuellement la bibliothèque client PHP de Google sur le serveur d'applications Web.

Connectez-vous avec votre compte Google :

Fichiers de script

- config.php

- index.php

- callback.php

- database.php

Tout d'abord, créez un fichier "config.php" pour gérer l'initialisation du code API de Google et les clés API, nous avons mis une URL de redirection dans le projet client de Google https://www.yourDomain.com/callback.php.

Code pour fichier "config.php"
Sélectionner le code

<?php

require_once'vendor/autoload.php'

$google_app_id='your_google_app_id'

$google_app_secret='your_google_app_secret'

$google_callbackurl='https://www.yourdomain.com/callback.php'

$google_client=new Google_Client(); 

$google_client -> setClientId ( $google_app_id ); 

$google_client -> setClientSecret ( $google_app_secret ); 

$google_client -> setRedirectUri ( $google_callbackurl ); 

$google_client -> addScope ( 'email');

$google_client -> addScope ( 'profile');

$google_client -> addScope ( 'https://www.googleapis.com/auth/photoslibrary.readonly'); 
?>

 

Créez un fichier pour la connexion en utilisant le bouton du compte Gmail.
Utilisez le code ci-dessous.
Dans ce fichier index.php, nous avons indiqué la fonction d'URL d'authentification du client google
$client->createAuthUrl ().

Code du fichier "index.php"
Sélectionner le code

	
<?php 
 include ("config.php");
 ?>
 <div>  <a  href ="<?php  echo  $google_client ->  createAuthUrl(); ?>"> Login with Google </a>  </div> 

 

Lorsque l'utilisateur clique sur le bouton Connexion avec Google, il est dirigé vers la page d'autorisation de Google. Une fois l'autorisation accordée, il est redirigé vers la page de rappel avec le code d'autorisation du fichier "callback.php".

Code du fichier "callback.php"
Sélectionner le code

	
<?php   require_once 'config.php';
  require_once 'database.php';
  if(isset (  $_GET [ "code"]))   {   
  //It will Attempt to exchange a code for an valid authentication token.    
 $token=$google_client ->  fetchAccessTokenWithAuthCode (  $_GET [ "code"]); 
 //This condition will check there is any error occur during geting authentication token. If there is no any error occur then it will execute if block of code/  
 if( !isset($token [ 'error']))  {    
 $_SESSION['logged']='true';
 //Set the access token used for requests    
 $google_client -> setAccessToken ($token[ 'access_token']);
 //Store "access_token" value in $_SESSION variable for future use.
  $_SESSION [ 'access_token']   =  $token[ 'access_token'];
  //Create Object of Google Service OAuth 2 class   
  $google_service    =   new   Google_Service_ Oauth2 (  $google_client);   
  //Get user profile data from google   
  $data=$google_service -> 
  userinfo ->get();
  $query =  "INSERT INTO'googleUsers`(`google_id`,'name`,'email`,'image`) VALUES ('".@ $data ['id']  ."', '".@$data['given_name']." ".@ $data['family_name']."','".@ $data ['email']  ."','" .  @  $data [ 'picture']. "')" ;mysqli_query (  $connection,$query );
  echo "Account Created !!";
  }else {    }  }?>

 

Ce sont les seules étapes permettant de vérifier que l'utilisateur est en mesure d'authentifier son compte Google. Après avoir cliqué sur le bouton Connexion avec Google, les informations de son profil seront affichées dans le fichier callback.php.

Connection à la base de données

Les instrucions pour se connecter à la base de données se trouve dans le fichierb "database.php" que vous devez inclure dans vos fichiers si vous avez besoin de se connecter à la base de données.

Code pour fichier "database.php"
Sélectionner le code

	
<?php   
// Database connection
$host='host';
$user='user';
$pass='*******';
$database='database';
$connection=mysqli_connect ($host ,$user ,$pass,$database )ordie(  mysqli_error( $connection));

 

En fin voici le code pour créer une table de base de données où les données des utilisateurs seront stockées, copiez et collez le code de la requête MySQLi.

Code de la requête MySQLi
Sélectionner le code

	
--    
-- Table structure for table'googleUsers' 
--   
CREATE TABLE 'googleUsers'( 
'id'nt( 11 ) NOT NULL,
  'google_id'varchar ( 200) NOT NULL,
  'name'varchar ( 200) NOT NULL,
  'email 'varchar( 200 ) NOT NULL,
  'image 'text NOT NULL,
  'created 'timestamp NOT NULL DEFAULT current_timestamp ()  
  ) ENGINE=  MyISAM  DEFAULT CHARSET= latin1  ;
  -- 
  -- Indexes for table'googleUsers` 
  --   
  ALTER TABLE 'googleUsers 
  'ADD PRIMARY KEY (` id '); 
  -- 
  -- AUTO_INCREMENT for table'googleUsers` 
  --   
  ALTER TABLE 
  'googleUsers 'MODIFY'id 'int ( 11) NOT NULL AUTO_INCREMENT;
  COMMIT ;

 

Retour à l'accueil du site

Par carabde 20 AOUT 2021

SCREEBER - Logiciel de copywriting

SCREEBER - Logiciel de copywriting
Augmentez vos résultats en rejoignant les 1600 entrepreneurs qui utilisent Screeber®, le seul logiciel de Copywriting (en français) qui rédige avec vous des textes de vente qui convertissent


HTML5, CSS3, JavaScript pour débutants Tome 1 HTML5, CSS3, JavaScript pour débutants Tome 1
Premier tome d\'une série vidéo dédiée à l\'apprentissage des langages HTML, CSS et JavaScript.

Regarder aussi nos cours :

css3 fonts

Polices en CSS3. CSS3 Fonts comment utiliser des polices non standariées dans une page web

Construction du code javascript

Construction du code javascript : Dans ce cours nous allons voir comment est costruit un code js.

Détermine si une variable est de type nombre entier

 Détermine si une variable est de type nombre entier