ورود با حساب گیت هاب (Github) در PHP و جاوا اسکریپت

ورود با حساب گیت هاب (Github) در PHP و جاوا اسکریپت

ورود با حساب گیت هاب – خیلی از توسعه دهندگان یا افرادی که در زمینه توسعه نرم افزار فعال هستند با github گیت هاب آشنا هستند .

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

این پروژه شامل 3 فایل است :
1- index.php : در صورتی که ورود با گیت هاب موفق آمیز بود نام کاربری آن را نمایش می دهد
2- login.php : دکمه ای به نام ورود با گیت هاب را دارا است که دایرکت می شود به صفحه ورود github
3- github-access.php : پس از لاگین گیت هاب به این صفحه دایرکت می شود با query string به نام code که یکبار مصرف است و راهی برای دریافت access token که بتوانیم به اطلاعات کاربر در گیت هاب دسترسی پیدا کنیم و session بسازیم .

گیت هاب

ثبت OAuth App در گیت هاب

ابتدا وارد حساب کاربری گیت هاب خود شده و مراحل زیر را دنبال کنید :

ورود با حساب گیت هاب در PHP

روی علامت + کلیک و در منوی باز شده settings را انتخاب نمایید .


ورود با حساب گیت هاب در PHP

در صفحه باز شده گزینه Developer Settings را انتخاب نمایید .


ورود با حساب گیت هاب در PHP

گزینه OAuth Apps و سپس Register a new application .

ورود با حساب گیت هاب در PHP

بخش آخر یعنی Authorization callback URL را به درستی پر کرده چرا که بعد از ورود موفق کاربر با query string به نام code به آن صفحه منتقل می شود .

در پایان برای ثبت برنامه روی Register application کلیک کنید .

ورود با حساب گیت هاب در PHP

اکنون به داده های برای احراز هویت مثل Client ID و Client Secret دسترسی دارید ، همچنین می توانید برای برنامه تان لوگو آپلود کنید و کلی تنظیمات دیگر تعریف کنید .

قبل از اجرای برنامه کتابخانه GuzzleHttp را نصب کنید .

composer require guzzlehttp/guzzle

فایل index.php

در صورتی که session ساخت شده بود نام کاربری نمایش داده می شود غیر اینصورت دایرکت می شود به صفحه login.php

<!DOCTYPE html>
<html lang="fa">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>RapidCode.IR</title>
    <style>
    body {
        text-align: center;
        overflow-x: hidden;
    }

    #introduce {
        color: white;
        text-decoration: none;
        font-weight: bold;
        display: block;
        width: 100%;
        padding: 5px 10px;
        background-color: #4CAF50;
        text-align: center;
        font-size: 25px;
        margin-bottom: 45px;
    }
    </style>
</head>

<body>
    <a id="introduce" target="_blank" href="https://rapidcode.ir">رپید کد - کتابخانه مجازی برنامه نویسان</a>

<h1><?php
if (!empty($_COOKIE['auth'])) {
	$username = (json_decode(urldecode($_COOKIE['auth']), true))['user'];
	echo "خوش آمدی {$username}";
}else{
    header("Location: http://{$_SERVER['SERVER_NAME']}/login.php");
}
?></h1>


</body>

</html>


فایل login.php

<!DOCTYPE html>
<html lang="fa">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>لاگین با  گیت هاب</title>
    <style>
    body {
        text-align: center;
        overflow-x: hidden;
    }

    #introduce {
        color: white;
        text-decoration: none;
        font-weight: bold;
        display: block;
        width: 100%;
        padding: 5px 10px;
        background-color: #4CAF50;
        text-align: center;
        font-size: 25px;
        margin-bottom: 45px;
    }

    #login-with-github{
    	background: linear-gradient(to right top , gray , lightblue);
    	color: white;
    	border-radius: 4px;
    	border-bottom: 4px solid #0fadbd;
    	text-decoration: none;
    	padding: 10px 35px;
    	font-weight: bold;
    	display: inline-block;
    	transition: all 0.3s;
    }

    #login-with-github:hover{
    	border-bottom-color: transparent;
    	transform: translateY(4px);
    }


    </style>
</head>
<body>
    <a id="introduce" target="_blank" href="https://rapidcode.ir">رپید کد - کتابخانه مجازی برنامه نویسان</a>

    <a onclick="githubSignin()" id="login-with-github" href="#">ورود با گیت هاب</a>


    <script>
    	function githubSignin(){
    		const signinUrl = "https://github.com/login/oauth/authorize?client_id=e52ed161a5e5126a75db&allow_signup=false&scope=user:email";

    		location.assign(signinUrl);


    	}
    </script>

</body>
</html>


فایل github-access.php برای اعتبار سنجی token کاربر

خط 18 و 19 : حتما client secret , client id را وارد کنید .

<?php

############################
############################
############################
############################
####### RapidCode.iR #######
############################
############################
############################
############################

require_once "vendor/autoload.php";
use GuzzleHttp\Client;

header("Content-Type: application/json");

define("GITHUB_CLIENT_ID", "کلاینت آیدی");
define("GITHUB_CLIENT_SECRET", "کلاینت سکرت");
define("GITHUB_URL_ACCESS_TOKEN", "https://github.com/login/oauth/access_token");
define("GITHUB_URL_API", "https://api.github.com/user");

$response_msg = ["msg" => "invalid token", "status" => 0];

function httpRequest($url, $data, $method = "GET", $header) {

	$client = new Client([
		'timeout' => 5.0,
		'verify' => false,
	]);

	$response = $client->request($method, $url, [
		'headers' => $header,
		'form_params' => $data,
	]);

	$content = (string) $response->getBody();

	return json_decode($content, true);
}

$github_code = $_GET['code'] ?? false;

if ($github_code) {

	$data = [
		"client_id" => GITHUB_CLIENT_ID,
		"client_secret" => GITHUB_CLIENT_SECRET,
		"code" => $github_code,
	];

	$content = httpRequest(GITHUB_URL_ACCESS_TOKEN, $data, "POST", array(
		"Content-Type" => "application/x-www-form-urlencoded",
		"Accept" => "application/json",
	));

	if (!empty($content['access_token'])) {
		$access_token = $content['access_token'];

		$content = httpRequest(GITHUB_URL_API, array(), "GET", array(
			"Authorization" => "token {$access_token}",
		));

		if (!empty($content['login']) && !empty($content['node_id'])) {
			$response_msg = ["user" => $content['login'], "msg" => "successfully logged in (:", "status" => 1];
			setcookie("auth" , json_encode($response_msg));
			header("Location: http://{$_SERVER['SERVER_NAME']}");
		}

	}

}

echo json_encode($response_msg);

?>


دموی پروژه ورود با گیت هاب

ورود با حساب گیت هاب در PHP


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

ارسال نظر