Tutorial Laravel 11 Sharing Auth 1

Halo para seniman yang budiman! Selamat datang kembali! Pada kesempatan kali ini, kita akan membahas cara mengintegrasikan autentikasi sosial menggunakan Laravel Socialite dan berbagi sesi untuk satu atau lebih aplikasi Laravel dengan bantuan token JWT. Dalam artikel ini, kita akan menggunakan dua aplikasi Laravel bernama account.example.test dan app.example.test. Pada bagian pertama, kita akan fokus membahas aplikasi account.example.test. Mari kita mulai dengan langkah pertama, yaitu menginstal Laravel Socialite. Silakan ikuti perintah di bawah ini:

Install laravel socialite

#

Install terlebih dahulu laravel socialite dengan command dibawah ini

composer require laravel/socialite 

Setelah proses installasi selesai, kita lanjutkan untuk mengatur konfigurasinya.

Sebelum konfigurasi laravelnya silahkan dapatkan kode 'client-id', 'client-secret', 'redirect' melalui link di bawah ini:

• GitHub
• Facebook
• Google

Silahkan teman-teman buka file config/service.php dan tambahkan kode berikut ini:

'github' => [
	'client-id' => env('GITHUB_CLIENT_ID'),
	'client-secret' => env('GITHUB_CLIENT_SECRET'), 
	'redirect' => env('GITHUB_CLIENT_REDIRECT'),
],

'facebook' => [
	'client-id' => env('FACEBOOK_CLIENT_ID'),
	'client_secret' => env('FACEBOOK_CLIENT_SECRET'), 
	'redirect' => env('FACEBOOK_CLIENT_REDIRECT'),
],

'google' => [
	'client_id' => env('GOOGLE_CLIENT_ID'),
	'client_secret' => env('GOOGLE_CLIENT_SECRET'),
	'redirect' => env('GOOGLE_REDIRECT_URI'),
],

Pada penambahan kode diatas, kita akan menggunakan 3 provider , yaitu Google, Facebook dan GitHub . Setelah itu, silahkan teman-teman juga buka file .env dan tambahkan kode dibawah ini:

FACEBOOK_CLIENT_ID=
FACEBOOK_CLIENT_SECRET=
FACEBOOK_CLIENT_REDIRECT=http://localhost:8000/auth/facebook/callback

GITHUB_CLIENT_ID=
GITHUB_CLIENT_SECRET=
GITHUB_CLIENT_REDIRECT=http://localhost:8000/auth/github/callback

GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
GOOGLE_REDIRECT_URI=http://localhost:8000/auth/google/callback

Membuat Controller Social Account

#

Jalankan perintah ini:

php artisan make:controller Auth/SocialiteController

Setelah berhasil, buka filenya di App/Http/Controllers/Auth/SocialiteController.php dan silahkan ubah kodenya menjadi seperti berikut:

// Jangan lupa Import Package yang di gunakan
public function redirectToProvider($provider)
{
	return Socialite::driver($provider)->redirect();
}

public function handleProviderCallback()
{
	try {
		$user = Socialite::driver($provider)->user();
		$finduser = User::where('gauth_id', $user->id)->first();
		if ($finduser) {
			Auth::login($finduser);
		} else {
			$newUser = User::create([
				'name' => $user->name,
				'email' => $user->email,
				'gauth_id'=> $user->id,
				'gauth_type'=> $provider,
				'password' => bcrypt('admin@123')
			]);
			Auth::login($newUser);
			$finduser = $newUser; // Gunakan $newUser karena $finduser belum ada sebelumnya
		}
		// Buat token JWT
		$payload = [
			'iss' => "your-issuer",
			'sub' => $finduser->id,
			'iat' => time(),
			'exp' => time() + 60*60*24
		];
		// encrypt jwt token
		$jwt = JWT::encode($payload, 'secret-your-key', 'HS256');
		// Create or set cookies
		Cookie::queue(Cookie::make('name-token-jwt', $jwt, time() + (60*60*24)));
		return redirect('/dashboard');
	} catch (Exception $e) {
		// Bisa di tambahkan error handler dan atau send notification
		dd($e->getMessage());
	}
}

Opsional: Jika ingin menambahkan sharing token lewat cookie silahkan ubah bagian code menjadi.

Cookie::queue(Cookie::make('name-token-jwt', $jwt, time() + (60*60*24), '/', '.domain-anda.id', true, true, false, 'None'));

Penjelasan parameter:

Cookie::queue(
    Cookie::make(
        $name,         // Nama cookie
        $value,        // Nilai cookie (JWT dalam kasus ini)
        $minutes,      // Durasi cookie dalam menit
        $path,         // Path di mana cookie tersedia
        $domain,       // Domain di mana cookie tersedia
        $secure,       // Hanya kirim cookie melalui HTTPS (true/false)
        $httpOnly,     // Hanya akses cookie melalui HTTP (true/false)
        $sameSite,     // Kebijakan SameSite (None/Lax/Strict)
        $raw           // Gunakan nilai cookie mentah (true/false)
    )
);

1. $secure (true):
   • Parameter ini mengatur apakah cookie hanya dikirimkan melalui HTTPS atau tidak. Jika diatur sebagai true, cookie hanya akan dikirimkan jika koneksi menggunakan HTTPS.
2. $httpOnly (true):
   • Parameter ini mengatur apakah cookie hanya dapat diakses melalui HTTP dan tidak dapat diakses melalui JavaScript. Ini membantu melindungi cookie dari serangan XSS (Cross-Site Scripting).
3. $sameSite (false):
   • Parameter ini menetapkan kebijakan SameSite untuk cookie. Nilai yang valid adalah None, Lax, atau Strict. Pengaturan None memungkinkan cookie dikirim dalam konteks cross-site requests.
4. $raw (‘None’):
   • Parameter ini menunjukkan apakah nilai cookie harus digunakan dalam bentuk mentah atau tidak. Di sini, ‘None’ menunjukkan bahwa nilai cookie tidak dimodifikasi atau dienkripsi oleh server web.

Selanjutnya buat route di routes/web.php dengan methode get

Route::get('/auth/{provider}', 'Auth\SocialiteController@redirectToProvider')->name('auth.provider');
Route::get('/auth/{provider}/callback', 'Auth\SocialiteController@handleProvideCallback')->name('auth.callback');

// Opsional
// Route untuk cek cookie atau gunakan `inspect` or `inspect element` di browser
Route::get('/get-cookie', function () {
    return Cookie::get('nama-token-jwt');
});

Tambahkan button login di dalam kode blade dalam artikel ini saya membuatnya di Resources\Views\Auth\login.blade.php

<a href="/auth/facebook" class="btn btn-primary">
	Login Dengan Facebook
</a>
<a href="{{ route('auth.provider', ['provider' => 'github']) }}" class="btn btn-dark">
	Login Dengan GitHub
</a>
<a href="{{ url('/auth/google') }}" class="btn btn-danger">
	Login Dengan Google
</a>

Kita akhiri dulu pembahasan pada bagian pertama ini. Nantikan bagian kedua yang akan mengupas lebih lanjut tentang berbagi autentikasi di Laravel. Sampai jumpa di artikel berikutnya, dan terima kasih sudah membaca!