PHP – logowanie przez konto Google

Google Plus

Wpis ten przedstawia w jaki sposób możemy stworzyć skrypt do logowania przez konto Google na naszej stronie www. Na końcu znajduje się link repozytorium na GitHub.

1. Stworzenie aplikacji Google (Google APP)

Aby podłączyć pod naszą stronę możliwość logowania przez Google musimy mieć założone konto na Google. Następnie przechodzimy do Google API Console pod adresem:
https://console.developers.google.com/
Jeśli nie mamy stworzonego projektu, klikamy na „Stwórz projekt” (Create project) u góry w menu, możemy też wykorzystać projekt, który już mamy.
Następnie przechodzimy na stronę projektu, z menu po lewej wybieramy zakładkę „Biblioteka” (Library), szukamy pozycji „Google+ API”, klikamy na nią, następnie na „Włącz” (Enable).
Następnie przechodzimy do zakładki „Dane logowania” (Credentials) z menu po lewej stronie.
Klikamy na „Utwórz dane logowania” (Create Credentials) i wybieramy pozycję „ID klienta OAuth” (OAuth client ID). Jako typ aplikacji wybieramy „Aplikacja internetowa” (Web application),
wpisujemy nazwę aplikacji a w polu „Autoryzowane identyfikatory URI przekierowania” (Authorised redirect URIs) wpisujemy adres URL naszej strony, na której będziemy używać możliwości logowania przez Google.
Klikamy na przycisk „Utwórz” (Create).
Wyświetli się nowe okno z Google ID i Google Secret.

2. Zapisanie Api Client i Api Secret

Na serwerze tworzymy plik index.php (możemy oczywiście te dane przechowywać w innym pliku php i includować go do naszego projektu) z wartościami pobranymi z konsoli Google:

<?php

define('GOOGLE_ID','xxxxxxxxxx');

define('GOOGLE_SECRET','xxxxxxxxxx');

define('GOOGLE_REDIRECT_URL','xxxxxxxxxx');

Google ID to pobrany z Google Identyfikator klienta, Google Secret to Tajny klucz klienta, a redirect url to adres URL naszej aplikacji (musi być zgodny z adresem podanym podczas tworzenia aplikacji)

3. Dodanie linku do logowania przez Google

Teraz dodajemy link do logowania przez Google w naszej aplikacji.

<?php

define('GOOGLE_ID','xxxxxxxxxx');

define('GOOGLE_SECRET','xxxxxxxxxx');

define('GOOGLE_REDIRECT_URL','xxxxxxxxxx');

$google_login_url = 'https://accounts.google.com/o/oauth2/v2/auth?scope=' . urlencode('https://www.googleapis.com/auth/userinfo.profile https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/plus.me') . '&redirect_uri=' . urlencode(GOOGLE_REDIRECT_URL) . '&response_type=code&client_id=' . GOOGLE_ID . '&access_type=online';

?>
<html>
<head>...</head>

<body>
...

<a href="<?= $google_login_url ?>">Zaloguj przez konto Google</a>

...
</body>
</html>

Poniżej wyjaśnienie atrybutów:

  • scope: Zakres danych które chcemy pobrać z Google. Aby zdobyć informację o użytkowniku łącznie z adresem email potrzebujemy 3 wartości scope:
    https://www.googleapis.com/auth/userinfo.profile
    https://www.googleapis.com/auth/userinfo.email
    https://www.googleapis.com/auth/plus.me
  • redirect_uri: Nasz adres URL do przekierowania
  • response_type: Zostawiamy domyślną wartość czyli „code”
  • client_id: ID naszej aplikacji na Google
  • access_type: Ustawiamy na „online”

4. Uzyskiwanie Access Token

Zanim będziemy mogli pobrać od użytkownika dane musimy uzyskać dostęp do jednorazowego kodu dostępu.

Po kliknięciu przez użytkownika na naszej stronie przycisku „Zaloguj przez konto Google” i potwierdzeniu chęci zalogowania w naszej aplikacji Google przekierowuje użytkownika z powrotem na naszą stronę dodając zmienną „code” – jest to jednorazowy kod pozwalający uzyskać Access Token.

Do naszego kodu za definicjami stałych, a przed deklarowaniem zmiennej $google_login_url dodajemy następujący kod, który poprzez CURL uzyska z serwerów Google Access Token.

if(!empty($_REQUEST['code'])){
  $url = 'https://accounts.google.com/o/oauth2/token';
  $curlPost = 'client_id='.GOOGLE_ID.'&redirect_uri='.urlencode(GOOGLE_REDIRECT_URL).'&client_secret='.GOOGLE_SECRET.'&code='.$_REQUEST['code'].'&grant_type=authorization_code';
  $ch = curl_init();
  curl_setopt($ch, CURLOPT_URL, $url);
  curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
  curl_setopt($ch, CURLOPT_POST, 1);
  curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, FALSE);
  curl_setopt($ch, CURLOPT_POSTFIELDS, $curlPost);
  $data = json_decode(curl_exec($ch), true);
  $http_code = curl_getinfo($ch,CURLINFO_HTTP_CODE);
  if($http_code == 200){
    print_r($data);
    die();
  }
}

Po próbie zalogowania  na ekranie wyświetli się tablica z danymi w tym między innymi access_token – o to nam chodziło:)

5. Uzyskiwanie danych użytkownika

Aby uzyskać dane użytkownika musimy ponownie poprzez zapytanie CURL odpytać serwery Google, wykorzystując uzyskany Access Token.

W tym celu zmieniamy w kodzie z punktu 4 linie:

print_r($data);
die();

Na następujące:

$url = 'https://www.googleapis.com/plus/v1/people/me';
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, FALSE);
curl_setopt($ch, CURLOPT_HTTPHEADER, array('Authorization: Bearer '.$data['access_token']));
$data2 = json_decode(curl_exec($ch), true);
$http_code = curl_getinfo($ch, CURLINFO_HTTP_CODE);
if($http_code == 200){
  print_r($data2);
  die();
}

Teraz po zalogowaniu się zobaczmy wyprintowane wszystkie dane użytkownika, które możemy uzyskać, w tym jego adres email. Dane te możemy np. zapisać w bazie danych, aby zarejstrować użytkownika.

6. Zapisywanie w sesji zalogowanego użytkownika

Uzyskane dane użytkownika możemy zapisać w sesji, aby przy każdym odświeżeniu strony użytkownik nie musiał ponownie przechodzić przez logowanie. W tym celu na początku naszego pliku PHP dodajemy:

session_start();

A następnie zamieniamy linie z punktu 5:

  print_r($data2);
  die();

Na następujące:

$_SESSION['logged_in'] = 1;
$_SESSION['email'] = $data2['emails'][0]['value'];

Link do logowania przez Google jest sens generować, tylko jeśli użytkownik nie jest zalogowany, dlatego też dodajemy warunek sprawdzający czy istnieje zmienna sesyjna:

if(empty($_SESSION['logged_in'])){
  $google_login_url = 'https://accounts.google.com/o/oauth2/v2/auth?scope=' . urlencode('https://www.googleapis.com/auth/userinfo.profile https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/plus.me') . '&redirect_uri=' . urlencode(GOOGLE_REDIRECT_URL) . '&response_type=code&client_id=' . GOOGLE_ID . '&access_type=online';
}

Dodajemy także warunek sprawdzający czy wyświetlić link do logowania, linię:

<a href="<?= $google_login_url ?>">Zaloguj przez konto Google</a>

Podmieniamy na:

<?php
  if(empty($_SESSION['logged_in'])){
?>
  <a href="<?= $google_login_url ?>">Zaloguj przez konto Google</a>
<?php
  }elseif(!empty($_SESSION['email'])){
    echo('Witaj '.$_SESSION['email']);
  }
?>

Po zalogowaniu zobaczmy wiadomość Witaj [nasz adres email]

Mam nadzieję, że ten wpis ułatwi Wam tworzenie aplikacji webowych z możliwością logowania przez konto Google.

Link do skryptu na GitHub:

https://github.com/kamilwyremski/logowanie-google

Ta strona używa ciasteczek (cookies), dzięki którym nasz serwis może działać lepiej. Więcej informacji

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.

Close