Strategi#1 Lily – Chaerunisa Savitri

Hallo sahabat TimUR

Pada kesempatan kali ini ica ikin membahas mengenai project ica integram. Disini ica ingin membahas bagaimana cara membuat tampilan login dengan SSO. Nah seperti apa sih progress yang sudah ica buat ini mengenai tampilan login dengan SSO.

Berikut adalah penjelasan yang akan ica jelaskan :

  1. Install extension untuk yii2-authclient

Pastikan anda sudah menginstall yii2-authclient extension pada aplikasi anda, jika belum bisa cek disini.

  1. Ubah file web.phppada folder config
Tambahkan script dibawah ini pada file web.php dibagian components

  1. Buat ClientID dan Secret ID pada Console developer google

Buka console.geveloper.googleapis.com, create new project menggunakan project anda, pilih API Manager, kemudian klik credentials, dibagian OAuth klik new ClientID.

Pada bagian Authorized Javascript origins masukkan nama Domain Anda. Dan pada bagian Authorized Redirect URI’s masukkan link namaDomainAnda/mau_di_redirect_kemana

Dalam aplikasi ica akan di redirect ke :

https://chaerunisa.raharja.info/basic2/web/index.php?r=site%2Flogin

Setelah itu Save dan pastikan ingat ClientID dan SecretID. Note ClientID dan SecretID bersifat privacy, jangan beritahu siapapun.

  1. Buat action AuthActionpada controller
Tambahkan script ini pada SiteController
*/
 public function actions()
 {
 return [

'auth' => [
 'class' =>'yii\authclient\AuthAction',
 'successCallback' => [$this, 'successCallback'],
 ],
 'error' => [
 'class' => 'yii\web\ErrorAction',
 ],
 'captcha' => [
 'class' => 'yii\captcha\CaptchaAction',
 'fixedVerifyCode' => YII_ENV_TEST ? 'testme' : null,
 ],
 ];
 }
 public function successCallback($client)
 {
 $attributes = $this->safeAttributes($client);
 // user login or signup comes here
 if (attributes['social_media'] == 'google'){
 $fixPhotos = explode("?",$attributes['photos']);
 $photos = $fixPhotos['0'];
 } else {
 $photos = yii::$app->params['baseUrl']."/images/user/unknown.jpg";
 return $this->render('index',['photos'=>$photos]);
 }
 }

 

5.  penambahan layout login

Masukkan code berikut untuk membuat layout login

Dan SSO pun sudah dapat dilakukan, berikut hasilnya

 

Nah, seperti itu lah progress yang sudah ica buat.

Terimakasih 🙂

8 Responses

  1. Wahhh.. Ica Sudah mulai bermain² dengan coding nih, dan sudah bisa melakujan SSO yah pada Integram . Semangat selalu ca untuk progres² selanjutnya

  2. Dengan adanya SSO yang Ica buat adalah menjadi kunci utama dalam melanjutkan project. Semangat Ica dalam projectnya tetapi nanti kasih rincian ya mau bagaimana hihi kepo niii 😀

Leave a Reply

You must be logged in to post a comment.