در این مقاله ، قصد داریم نحوه ساخت صفحه ورود به سیستم گوگل در وب سایت PHP و بدون نیاز به ماژول های دیگر را توضیح دهیم. ما از API OAuth Google استفاده می کنیم ، که راهی آسان و قدرتمند برای افزودن ورود گوگل به سایت شما است.

به عنوان یک کاربر وب ، احتمالاً با مشکل مدیریت حساب های مختلف برای سایت های مختلف روبرو شده اید - به ویژه هنگامی که چندین رمز عبور برای خدمات مختلف دارید و یک وب سایت از شما می خواهد که یک حساب دیگر در سایت خود ایجاد کنید.

برای مقابله با این مشکل ، می توانید یک ویژگی ورود به سیستم را ارائه دهید تا به بازدیدکنندگان اجازه دهید از اعتبارهای موجود خود برای بازکردن حساب در سایت شما استفاده کنند. امروزه بسیاری از وب سایت ها به کاربران اجازه می دهند با استفاده از حساب های موجود خود در Google ، Facebook یا سایر سرویس های محبوب وارد سیستم شوند.

این یک روش مناسب برای کاربران جدید است تا به جای ثبت نام در یک حساب جدید با نام کاربری و رمز عبور دیگر ، در یک سایت شخص ثالث ثبت نام کنند.

در این پست ، از API ورود به سیستم Google OAuth استفاده می کنیم که به کاربران امکان می دهد با حساب های Google خود وارد سیستم شوند.

البته ، کاربران هنوز باید بتوانند با فرم ثبت نام معمول در سایت شما ثبت نام کنند ، اما ارائه ورود به سیستم گوگل یا مواردی از این دست می تواند به حفظ نسبت حفظ کاربر سالم کمک کند.

سیستم ورود با گوگل چگونه کار می کند

بیایید به سرعت جریان داده های سطح بالای کل فرآیند را مرور کنیم. همانطور که در نمودار زیر مشاهده می کنید ، سه نهاد اصلی در روند ورود به سیستم دخیل هستند: کاربر ، وب سایت شخص ثالث و گوگل .

اکنون ، اجازه دهید جریان کلی نحوه عملکرد ورود گوگل در سایت شما را درک کنیم.

در صفحه ورود به سایت شما ، دو گزینه وجود دارد که کاربران می توانند برای ورود به سیستم انتخاب کنند. اولین گزینه این است که در صورت داشتن یک حساب کاربری در سایت شما ، نام کاربری و گذرواژه ارائه دهد. و دیگری این است که با حساب گوگل موجود خود وارد سایت شوید.

وقتی روی دکمه  ورود با گوگل کلیک می کنند ، ورود به سیستم گوگل را آغاز می کند و کاربران را برای ورود به سایت گوگل می برد. پس از ورود ، آنها با اکانت گوگل خود وارد سیستم می شوند و پس از آن به صفحه شما هدایت می شوند.

در صفحه رضایت ، از کاربران خواسته می شود اطلاعات حساب گوگل خود را با سایت شخص ثالث به اشتراک بگذارند. در این حالت ، سایت شخص ثالث سایتی است که در آن می خواهند از حساب گوگل خود برای ورود استفاده کنند. دو گزینه به آنها ارائه می شود: آنها می توانند اجازه دهند یا رد کنند.

هنگامی که آنها اجازه می دهند اطلاعات خود را با سایت شخص ثالث به اشتراک بگذارند ، به سایت شخص ثالث از جایی که جریان ورود به سیستم گوگل را آغاز کرده اند ، بازگردانده می شوند.

در این مرحله ، کاربر با گوگل وارد سیستم شده است و سایت شخص ثالث به اطلاعات نمایه کاربر دسترسی دارد که می تواند برای ایجاد حساب کاربری و ورود به سیستم کاربر استفاده شود. بنابراین این جریان اصلی ادغام ورود گوگل در سایت شما است. نمودار زیر یک مرور کلی از مراحلی دارد که ما در مورد آن صحبت کردیم.

در بقیه پست ، ما این جریان ورود را در یک مثال کار در PHP پیاده سازی می کنیم.

راه اندازی پروژه برای ورود به سیستم گوگل

در این بخش ، تنظیمات اولیه مورد نیاز برای ادغام ورود به سیستم گوگل با وب سایت PHP شما را مرور می کنیم.

یک پروژه API Google ایجاد کنید

ابتدا باید یک برنامه کاربردی با گوگل ایجاد کنید که به شما امکان می دهد سایت خود را در گوگل ثبت کنید.این به شما امکان می دهد اطلاعات اولیه در مورد وب سایت خود و چند جزئیات فنی را نیز تنظیم کنید.

پس از ورود به سیستم گوگل، کنسول Google Developers را باز کنید . همانطور که در تصویر زیر نشان داده شده است ، صفحه داشبورد گوگل باز می شود  .

از منوی بالا سمت چپ ، روی  پیوند Select a project کلیک  کنید . همانطور که در تصویر زیر نشان داده شده است ، باید یک پنجره باز شود.

روی  پیوند New project کلیک کنید  و از شما می خواهد  نام پروژه Project name و سایر جزئیات مانند Location را وارد کنید. همانطور که در مثال زیر نشان داده شده است ، اطلاعات لازم را پر کنید.

 برای ذخیره پروژه جدید خود روی  دکمه Create کلیک کنید. به  صفحه داشبورد هدایت می شوید  .  از نوار کناری سمت چپ روی اعتبارنامه کلیک کنید  و به  برگه صفحه رضایت OAuth  بروید.

در این صفحه ، باید جزئیات مربوط به برنامه خود را وارد کنید ، مانند نام برنامه ، لوگو و چند جزئیات دیگر. اطلاعات لازم را وارد کرده و ذخیره کنید. برای آزمایش ، فقط وارد کردن نام برنامه باید این کار را انجام دهد.

در مرحله بعد ، روی  نوار کناری سمت چپ روی Credentials کلیک کنید  .  همانطور که در تصویر زیر نشان داده شده است ، باید   جعبه اعتبارنامه API را در زیر  برگه Credentials به شما نشان دهد.

روی اعتبارنامه مشتری> شناسه مشتری OAuth کلیک کنید   تا مجموعه جدیدی از اعتبارنامه ها برای برنامه ما ایجاد شود. این صفحه ای را به شما نشان می دهد که از شما می خواهد گزینه مناسب را انتخاب کنید. در مورد ما ، گزینه  Web application را  انتخاب کرده و بر روی دکمه Create کلیک کنید. از شما خواسته می شود که جزئیات بیشتری در مورد برنامه خود ارائه دهید.

جزئیات نشان داده شده در تصویر فوق را وارد کرده و ذخیره کنید! البته ، باید  Redirect URI  را مطابق با تنظیمات برنامه خود تنظیم کنید. این نشانی اینترنتی است که پس از ورود کاربر به آن هدایت می شود.

در این مرحله ، ما برنامه سرویس گیرنده Google OAuth2 را ایجاد کرده ایم و اکنون باید بتوانیم از این برنامه برای ادغام ورود به سیستم Google در سایت خود استفاده کنیم.لطفاً مقدار Client ID  و  Client Secret  را که در پیکربندی برنامه در انتهای ما مورد نیاز است ، یادداشت کنید  .  هنگام ویرایش برنامه خود ، همیشه می توانید  شناسه مشتری  و  Client Secret را پیدا کنید.

Google PHP SDK Client Library را نصب کنید

در این بخش نحوه نصب کتابخانه سرویس گیرنده API Google PHP را خواهیم دید. برای نصب آن می توانید دو گزینه را انتخاب کنید:

1. از composer استفاده کنید.
2. فایلهای کتابخانه را به صورت دستی بارگیری و نصب کنید.

راه Composer

اگر ترجیح می دهید آن را با استفاده از Composer نصب کنید ، فقط باید دستور زیر را اجرا کنید.

$composer require google/apiclient:"^2.0"

و تمام!

نگارش را بارگیری کنید

اگر نمی خواهید از Composer استفاده کنید ، می توانید آخرین نسخه پایدار را از صفحه API رسمی بارگیری کنید  .

در مثال ، فقط از Composer استفاده کردیم.

اگر در حال پیگیری هستید ، باید برنامه Google خود را پیکربندی کرده و کتابخانه سرویس گیرنده Google PHP API را نصب کرده باشید.

در قسمت بعدی و پایانی ، نحوه استفاده از این کتابخانه را در سایت PHP خود خواهیم دید.

<?php
require_once 'vendor/autoload.php';

// init configuration
$clientID = '<YOUR_CLIENT_ID>';
$clientSecret = '<YOUR_CLIENT_SECRET>';
$redirectUri = '<REDIRECT_URI>';  

// create Client Request to access Google API
$client = new Google_Client();
$client->setClientId($clientID);
$client->setClientSecret($clientSecret);
$client->setRedirectUri($redirectUri);
$client->addScope("email");
$client->addScope("profile");

// authenticate code from Google OAuth Flow

if (isset($_GET['code'])) {
  $token = $client->fetchAccessTokenWithAuthCode($_GET['code']);
  $client->setAccessToken($token['access_token']);

  // get profile info
  $google_oauth = new Google_Service_Oauth2($client);
  $google_account_info = $google_oauth->userinfo->get();
  $email =  $google_account_info->email;
  $name =  $google_account_info->name;

  // now you can use this profile info to create account in your website and make user logged in.
} else {
  echo "<a href='".$client->createAuthUrl()."'>Google Login</a>";
}
?>

مرور مهمترین قسمت های کلیدی

بیایید قسمت های کلیدی کد را مرور کنیم. اولین کاری که باید انجام دهیم این است که   فایل autoload.php را وارد کنیم. این بخشی از Composer است و تضمین می کند که کلاس هایی که ما در اسکریپت خود استفاده می کنیم به صورت خودکار بارگیری شوند.

require_once 'vendor/autoload.php';

بعد ، یک بخش پیکربندی وجود دارد که با تنظیمات لازم ، پیکربندی برنامه را اولیه می کند. البته ، شما باید مقادیر متغیر را با مقادیر مربوطه جایگزین کنید.

// init configuration
$clientID = '<YOUR_CLIENT_ID>';
$clientSecret = '<YOUR_CLIENT_SECRET>';
$redirectUri = '<REDIRECT_URI>';

بخش بعدی  Google_Client را مثال می زند ، که برای انجام اقدامات مختلف مورد استفاده قرار می گیرد. در کنار آن ، ما تنظیمات برنامه خود را نیز کرده ایم.

// create Client Request to access Google API
$client = new Google_Client();
$client->setClientId($clientID);
$client->setClientSecret($clientSecret);
$client->setRedirectUri($redirectUri);

در مرحله بعد ، دامنه ایمیل و مشخصات را اضافه کرده ایم ، بنابراین پس از ورود به اطلاعات اولیه مشخصات دسترسی داریم.

$client->addScope("email");
$client->addScope("profile");

در نهایت ، ما یک قطعه کد داریم که جادوی ورود را انجام می دهد.

// authenticate code from Google OAuth Flow
if (isset($_GET['code'])) {
  $token = $client->fetchAccessTokenWithAuthCode($_GET['code']);
  $client->setAccessToken($token['access_token']);

  // get profile info
  $google_oauth = new Google_Service_Oauth2($client);
  $google_account_info = $google_oauth->userinfo->get();
  $email =  $google_account_info->email;
  $name =  $google_account_info->name;

  // now you can use this profile info to create account in your website and make user logged in.
} else {
  echo "<a href='".$client->createAuthUrl()."'>Google Login</a>";
}

اول ، بیایید else بخشی را مرور کنیم  ، که وقتی مستقیماً به اسکریپت دسترسی پیدا کنید ، فعال می شود. پیوندی را نمایش می دهد که کاربر را برای ورود به گوگل می برد. توجه به این نکته ضروری است که ما از  createAuthUrl روش the Google_Client برای ساختن آدرس OAuth استفاده کرده ایم.

پس از کلیک روی پیوند ورود به سیستم گوگل ، کاربران برای ورود به سایت گوگل منتقل می شوند. پس از ورود به سیستم ، گوگل با عبور از code متغیر رشته پرس و جو ، کاربران را به سایت ما هدایت می  کند. و این زمانی است که کد PHP موجود در  if بلاک فعال می شود. ما از کد برای تبادل رمز دسترسی استفاده می کنیم.

هنگامی که رمز دسترسی را در اختیار داریم ، می توانیم از  Google_Service_Oauth2 سرویس برای واکشی اطلاعات نمایه کاربر وارد شده استفاده کنیم.

بنابراین به این ترتیب ، پس از ورود کاربر به حساب گوگل ، به اطلاعات نمایه دسترسی خواهید داشت.

می توانید از این اطلاعات برای ایجاد حساب در سایت خود استفاده کنید ، یا می توانید آنها را در یک جلسه ذخیره کنید. اساساً ، این به شما بستگی دارد که چگونه از این اطلاعات استفاده کنید و به این واقعیت که کاربر وارد سایت شما شده است پاسخ دهید.