oAuth

oAuth ဆိုတာကေတာ့ Open Authorization ကို အတိုေခၚတာပါ။ token-based authentication system တစ္ခု ျဖစ္ပါတယ္။ oAuth လို႕ေျပာလိုက္ရင္ေတာ့ ပံုမွန္ ကၽြန္ေတာ္တုိ႕ အသံုးျပဳေနၾက Login with Facebook, Login with google Account တို႕ လိုမ်ဳိးပါပဲ။ User က သူရဲ႕ username , password ကို third party client ကို ေပးဖို႕မလိုပဲ third party client က API ကို သံုးျပီး access လုပ္ခြင့္ေပးလိုက္တာပါ။

Why oAuth

ကၽြန္ေတာ္တုိ႕ဟာ client app , website ေတြကို user ရဲ႕ login username, password ေတြကို မေပးခ်င္ပါဘူး။ အသံုးျပဳသူအတြက္လည္း မလံုျခံဳပါဘူး။ ဒါေၾကာင့္ user ကို မူရင္း website မွာ လာေရာက္ login ဝင္ခိုင္းပါတယ္။ ျပီးရင္ ဒီ app ကို သံုးမွာ ေသခ်ာလား ဆုိျပီး authorize လုပ္ပါတယ္။ အဲဒီ အခါ app ကေန user information ေတြ ရဖို႕ အတြက္ token ေလး တစ္ခု ထုတ္ေပးလိုက္တယ္။ အဲဒီ username,password အစား အဲဒီ token ေလးနဲ႕ user information ေတြ ကို access လုပ္ရပါတယ္။ တကယ္လုိ႕ user က ဒီ webdsite ကို မယံုဘူး မသံုးခ်င္ေတာ့ဘူး ဆိုရင္ access token ကို revoke လုပ္ိလိုက္ရံုပါပဲ။

Login Flow

oAuth မွာ ဘယ္လို login ဝင္လဲ ၾကည့္ရေအာင္။


User က app သို႕မဟုတ္ website မွာ Login ကို ႏိွပ္လိုက္ျပီ။ အဲဒီ အခါမွာ unsplash.com ကို ေရာက္သြားမယ္။ Login ဝင္မယ္။ Authorize လုပ္မယ္။ Authorize လုပ္လိုက္တာနဲ႕ unsplash.com ကေန ကၽြန္ေတာ္တုိ႕ရဲ႕ web/app ကို ျပန္ေရာက္လာပါလိမ့္မယ္။ အဲဒီ အခါမွာ access token ပါလာပါတယ္။ access token ရလာျပီဆိုမွ user informaiton ကို ဆြဲထုတ္ျပီးေတ့ web/app ကေန ျပန္ျပေပးပါမယ္။ တနည္းအားျဖင့္ web/app ဘက္မွာ user ရဲ႕ login information တစ္ခုမွ မရိွပဲ access token ေလး တစ္ခုတာ ရိွပါတယ္။ user ကလည္း အဲဒီ token ကို အခ်ိန္မေရြးျပန္ျပီး revoke လုပ္လိုက္ႏိုင္ပါတယ္။ တနည္းေျပာရင္ username,password ေပးလိုက္ရတာထက္ ပိုျပီး စိတ္ခ်ႏိုင္ပါတယ္။

Register App

အခု ကၽြန္ေတာ္တုိ႕ oAuth ကို အသံုးျပဳခ်င္သည့္ သူေတြ အတြက္ ဘာေတြ လုပ္ရမလဲ ဘယ္လို အဆင့္ေတြ ရိွသလဲ ၾကည့္ရေအာင္။

oAuth ကို အသံုးျပဳဖုိ႕ အတြက္ App ကို register လုပ္ဖို႕ လိုပါတယ္။ အခု ဥပမာ အေနနဲ႕ unsplash မွာ app ကို register လုပ္ရေအာင္။ Unsplash App ကို သြားျပီးေတာ့ App ကို register လုပ္ပါ။ User authorization callback URL ကိုေတာ့ http://localhost/oauth/unsplash.php ထားေပးပါ။ authorization လုပ္ျပီးရင္ ဘယ္ URL ကို code ပို႕ေပးမလဲဆိုသည့္ URL address ပါ။ user က authorise ျဖစ္ျပီးျပီရင္ http://localhost/oauth/unsplash.php သြားပါဆိုျပီး ဆိုထားတာပါ။ Permission ကိုေတာ့ အကုန္ on ထားလိုက္ပါ။ ကိုယ္လိုသည့္ permission ပဲ သံုးလို႕ရပါတယ္။ အခုကေတာ့ demo ျဖစ္သည့္ အတြက္ေၾကာင့္ အကုန္ on ထားလိုက္ပါ။


Register လုပ္ျပီးရင္ေတာ့ Info မွာ Application ID ႏွင့္ Secret ရလာပါမယ္။


Request Code

အခု oAuth အတြက္ စျပီး ေရးၾကည့္ရေအာင္။ oAuth အတြက္ ဒီမွာ ေရးထားတာကို အရင္ ဖတ္ၾကည့္ပါ။

https://unsplash.com/oauth/authorize

အဲဒီကို

Param Description
client_id Application ID
redirect_uri register လုပ္တုန္းက ထည့္ထားသည့္ authorise url
response_type code ဆိုျပီး ထည့္ရန္
scope request scope ကို ထည့္ရန္။ အခု ကၽြန္ေတာ္တုိ႕ scope ကို မသံုးပဲခ်န္ထားခဲ့ပါမယ္။

GET နဲ႕ ေခၚရမွာ ျဖစ္တာေၾကာင့္

https://unsplash.com/oauth/authorize?client_id=d8ac397dce375e6217eb6b0b4ad7c661455620e7fbd1f0cb22f8d0c65cf7a3ea&redirect_uri=http://localhost/oauth/unsplash.php&response_type=code

သူေပးထားသည့္ document က အတိုင္း ကၽြန္ေတာ္တုိ႕ ေတြ ေခၚလိုက္ပါျပီ။

authorize လုပ္ျပီးရင္ redirect_uri ကို callback နဲ႕ ျပန္လာတာကို ေတြ႕ႏိုင္ပါတယ္။


http://localhost/oauth/unsplash.php?code=1d60a889a02009f89e079f02ad988934beadf7d8c1d86d28021765eb304a5d0e

Request Token

အခု access token ကို ရဖို႕ရလာသည့္ code ကို ျပန္ပို႕ေပးရပါမယ္။

POST https://unsplash.com/oauth/token
Param Description
client_id Application ID
client_secret Application secret
redirect_uri register လုပ္တုန္းက ထည့္ထားသည့္ authorise url
code unsplash ကေန ျပန္လာသည့္ code
grant_type authorization_code ဆိုျပီး ထည့္ေပးရပါမည္

POST နဲ႕ ေခၚရမွာ ျဖစ္သည့္ အတြက္ေၾကာင့္ website ကို ဖြင့္ဖို႕ မလိုအပ္ပဲ curl နဲ႕ ေခၚဖို႕လိုအပ္ပါတယ္။

if (isset($_GET['code'])) {
    //try to get access token
    //POST https://unsplash.com/oauth/token
    //required
    //client_id
    //client_secret
    //redirect_uri
    //code
    //grant_type = authorization_code
    $data = [
        'client_id' => $appId, 
        'client_secret' => $appsec,
        'code' => $_GET['code'],
        'redirect_uri' => 'http://localhost/unsplash/index.php',
        'grant_type' => 'authorization_code'
        ];

    $url = "https://unsplash.com/oauth/token";

    $handle = curl_init($url);
    curl_setopt($handle, CURLOPT_POST, true);
    curl_setopt($handle, CURLOPT_POSTFIELDS, http_build_query($data));
    
    //disable SSL because of testing in localhost
    curl_setopt($handle, CURLOPT_SSL_VERIFYPEER, false);

    curl_setopt($handle, CURLOPT_RETURNTRANSFER, true);
    $response = curl_exec($handle);
    

    if (false === $response) {
        echo curl_error($handle);
        echo "<br/>";
        echo curl_errno($handle);
        exit;
    }

    curl_close($handle);

    var_dump($response);
    $json = json_decode($response,true);
    echo $json["access_token"];


}

အခု ဆိုရင္ေတာ့ access_token ရလာျပီ။ Access token ရလာရင္ Header မွာ Authorization ဆိုျပီး ထည့္ျပီးေတာ့ request ေတြ ေခၚလို႕ရပါျပီ။

Authorization: Bearer ACCESS_TOKEN

ကၽြန္ေတာ္တုိ႕ post man သို႕မဟုတ္ insomnia ကို အသံုးျပဳႏိုင္ပါတယ္။


အခုဆိုရင္ေတာ့ user က သူ႕ရဲ႕ username ႏွင့္ password ကို third party client ကို မေပးပဲ third party client က user ကို access လုပ္လို႕ရပါျပီ။

User က မၾကိဳက္ဘူးဆိုရင္ ျပန္ျပီး revoke လုပ္ရံုပါပဲ။ Unsplash အတြက္ ဆိုရင္ေတာ့ https://unsplash.com/oauth/authorized_applications မွာ သြားျပီးေတာ့ revoke ျပန္လုပ္ႏုိင္ပါတယ္။


 
18 Kudos
Don't
move!

Leave a Reply