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

پیشنهاد شما برای حل چنین مسئله ای می تواند یک ورود یکپارچه (SSO) به سایت باشد. در این حالت می توانید با یک نام کاربری و پسورد واحد به تمام بخش های سایت دسترسی داشته باشید. امروزه بسیاری از وب سایت ها به کاربران اجازه ورود با استفاده از اکانت های موجود خود در گوگل، فیسبوک یا بعضی از سرویس های عمومی را می دهند. این روش برای کاربران جدید راهی راحت است که به جای ایجاد حساب کاربری جدید با نام کاربری و رمز عبور قبلی خود از سایت استفاده نمایند.

در این پست ما از رابط برنامه نویسی نرم افزار OAuth برای Login گوگل استفاده خواهیم نمود که به کاربران اجازه ورود به اکانت های گوگل موجود را می دهد. البته کاربران هنوز می توانند با فرم ثبت نام معمول سایت شما، اکانت خود را ثبت نمایند.

صفحه Login گوگل چگونه کار می کند؟

اجازه دهید اول ماجرای کلی کار کردن صفحه Login گوگل روی سایت شما را بدانیم.

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

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

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

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

در این حالت، کاربر با گوگل به سایت Login می کند و سایت هدف به اطلاعات پروفایل کاربر دسترسی دارد به طوری که می توند برای ایجاد یک اکانت و Login کاربر مورد استفاده قرار گیرد.

بخش مقدماتی نحوه Login نمودن با گوگل در سایت شما پایان یافت. در ادامه مقاله با نمونه های کاری جریان Login در PHP را شرح خواهیم داد.

تنظیمات پروژه برای Login گوگل:

 در این بخش تنظیمات اولیه مورد نیاز برای چندین Login به گوگل در وب سایت PHP را شرح می دهیم.

  • ایجاد یک پروژه API گوگل:

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

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

در قسمت بالای منوی سمت چپ روی لینک Select a project  کلیک نمایید. این لینک، صفحه popup را به صورت زیر باز می کند.

روی لینک New Project کلیک نمایید که از شما می خواهد تا نام پروژه و سایر جزئیات را وارد نمایید. فیلد جزئیات ضروری را همانند نمونه زیر پر کنید.

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

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

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

روی Client credentials > OAuth ID کلیک نمایید تا مجموعه ای از Credentialsها  را برای اپلیکیشن ایجاد نماید. در این حالت صفحه ای برای انتخاب گزینه مناسب نوع اپلیکیشن ظاهر می شود. در اینجا گزینه Web application  را انتخاب نموده و روی دکمه Create کلیک نمایید.از شما اطلاعات دیگری در مورد جزئیات اپلیکیشن نیز پرسیده خواهد شد.

اطلاعات بالا را وارد نموده و آن ها را ذخیره نمایید. برای تنظیمات اپلیکیشن خود باید Redirect URL را تنظیم نمایید. این همان URL است که کاربر بعد از Login به آن انتقال داده می شود.

در اینجل اپلیکیشن کلاینت Oauth گوگل را ایجاد نمودیم و حالا باید بتوانیم این اپلیکیشن را برای چندین Login گوگل در سایتمان نیاز داریم. لطفا مقادیر  Client IDو Client Secret را یادداشت نمایید چرا که برای پیکربندی نهایی مورد نیاز هستند.  Client IDو Client Secret برای ویرایش اپلیکیشن مورد نیاز هستند.

 

  • نصب کتابخانه کلاینت PHP SDK گوگل:

در این بخش چگونگی نصب کتابخانه کلاینت PHP SDK گوگل را می فهمیم.

برای نصب دو گزینه برای انتخاب کردن وجود دارد:

  1. استفاده از سازنده
  2. دانلود و نصب فایل ها به شکل دستی

1-استفاده از سازنده

اگر ترجیح شما نصب کتابخانه با استفاده از سازنده است، فقط لازم است از شبه کد زیر استفاده کنید.

 

و بدین صورت کتابخانه نصب کتابخانه کلاینت PHP SDK گوگل شما ساخته شد.

1

$composer require google/apiclient:"^2.0"

 

2-دانلود آخرین نسخه کتابخانه

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

در نمونه ما ، از سازنده استفاده شده است.

اگر تا کنون با ما همراه بوده اید، اکنون باید اپلیکیشن گوگل خود را پیکریندی نموده و کتابخانه کلاینت PHP SDK گوگل را نصب نمایید. در بخش بعدی و بخش نهایی، چگونگی استفاده از این کتابخانه در سایت PHP شما را بررسی خواهیم کرد.

  •  یکپارچه نمودن کتابخانه کلاینت

هنگام پیکربندی اپلیکیشن گوگل، آن را فراخواتی نمایید. بدین منظور ما redirect URI را پیکربندی اپلیکیشن می آوریم و آن را در آدرس  http://localhost/redirect.php قرار می دهیم. اکنون زمان ایجاد فایل redirect.php است.

با استفاده از محتوای زیر فایل redirect.php را ایجاد می نماییم.

01

02

03

04

05

06

07

08

09

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

require_once 'vendor/autoload.php';

 

// init configuration

$clientID = '';

$clientSecret = '';

$redirectUri = '';

  

// 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 "createAuthUrl()."">Google Login";

}

?>

 

اجازه دهید از طریق بخش های کلیدی کد پیش برویم.

اولین چیزی که نیاز داریم فایل redirect.php است. این فایل بخشی از سازنده است و به ما این اطمینان را می دهد که کلاس های مورد استفاده در اسکریپت توسط ما  به صورت اتوماتیک لود شده اند.

1

require_once 'vendor/autoload.php';

 

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

1

2

3

4

// init configuration

$clientID = '';

$clientSecret = '';

$redirectUri = '';

 

بخش بعدی اشیاء Google_Client را مشخص می کند که برای اجرای اعمال متفاوت اجرا می گردد.

1

2

3

4

5

// create Client Request to access Google API

$client = new Google_Client();

$client->setClientId($clientID);

$client->setClientSecret($clientSecret);

$client->setRedirectUri($redirectUri);

 

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

1

2

$client->addScope("email");

$client->addScope("profile");

 

در پایان، تکه کدی داریم که عمل جادویی Login را انجام می دهد.

01

02

03

04

05

06

07

08

09

10

11

12

13

14

15

// 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 "createAuthUrl()."">Google Login";

}