Cara dan Langkah-Langkah Instalasi OAuth Google pada Laravel
Tags: laravel
Published: 2024-06-08 11:41:03


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1t2c8461puhz3x8t8dt7.png)


Halo temen-temen! Kali ini kita bakal bahas cara dan langkah-langkah instalasi OAuth Google di Laravel. Buat temen-temen yang pengen bikin aplikasi Laravel dengan login pake akun Google, artikel ini bakal ngebantu kamu dari awal sampe akhir. Siap? Yuk, kita mulai!

#### 1. Persiapan Awal
**a. Instal Laravel**
Pertama-tama, pastiin temen-temen udah punya Laravel terinstal di sistem temen-temen. Kalo belum, bisa ikutin perintah di bawah ini buat install Laravel:

```bash
composer create-project --prefer-dist laravel/laravel nama_projek
```

**b. Instal Package Socialite**
Laravel udah nyediain package buat integrasi OAuth, namanya Socialite. Temen-temen bisa install pake Composer:

```
composer require laravel/socialite
```

#### 2. Konfigurasi Google API Console
**a. Buat Proyek Baru**
Kunjungi [Google API Console](https://console.cloud.google.com/), terus login pake akun Google temen-temen. Kemudian pilih **APIs & Services**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6us593sn8kywi7ib2zew.png)

Kemudian pilih **ENABLE APIS AND SERVICES**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0rsu649lzf9tnyscr9kk.png)

Lalu silahkan cari **Google+ api**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p58lec53gzwh110cjwra.png)

Kemudian pilih yang ini 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ejsvr81traz0qgd8bx3v.png)

Silahkan pilih **Enable**, kemudian tunggu hingga prosesnya selesai

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z53d3bwuf6rhx4hqfkrl.png)

Setelah itu, silahkan pilih tab **Credentials**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jusfkxnhjtbk0vmscolg.png)

Lalu, silahkan pilih **CREATE CREDENTIALS**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/54j8tlq18ynf252pmdnq.png)

Kemudian, silahkan pilih **OAuth Client ID**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vs5epvkspns2c5r9pr0e.png)

Lalu sesuaikan inputan seperti berikut :

- Application type: Web application
- Name: Nama sesuai keinginan temen-temen
- Authorized redirect URIs: Isi dengan http://localhost:8000/auth/google/callback (atau URL callback aplikasi temen-temen) dikarenakan disini kita masih menggunakan lokal, jadi kita pakai localhost saja

Setelah itu pilih **CREATE**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cmkugljwe52fum84ng6g.png)

Setelah itu akan muncul credential seperti berikut yang akan kita gunakan pada `.env` Laravel : 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9tduarh52m0198pn3gp3.png)
Setelah itu, simpen Client ID dan Client Secret yang muncul.

#### 3. Konfigurasi Laravel
**a. Silahkan Tambah Konfigurasi di `.env`**
Buka file .env di root proyek Laravel temen-temen, terus tambahin konfigurasi berikut:

```bash
GOOGLE_CLIENT_ID=client-id-yang-dikasih-google
GOOGLE_CLIENT_SECRET=client-secret-yang-dikasih-google
GOOGLE_REDIRECT=http://localhost:8000/auth/google/callback
```

**b. Konfigurasi Socialite**
Buka file `config/services.php`, terus tambahin konfigurasi berikut:

```php
'google' => [
    'client_id' => env('GOOGLE_CLIENT_ID'),
    'client_secret' => env('GOOGLE_CLIENT_SECRET'),
    'redirect' => env('GOOGLE_REDIRECT'),
],
```

#### 4. Bikin Controller dan Routes
**a. Bikin Controller**
Bikin controller baru pake artisan command:

```bash
php artisan make:controller GoogleController
```
Buka `app/Http/Controllers/GoogleController.php` dan isi dengan kode berikut:

```php
<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Models\User;
use Illuminate\Support\Facades\Auth;
use Laravel\Socialite\Facades\Socialite;

class GoogleController extends Controller
{
    public function redirectToGoogle()
    {
        return Socialite::driver('google')->redirect();
    }

    public function handleGoogleCallback()
    {
        $user = Socialite::driver('google')->stateless()->user();

        $finduser = User::where('email', $user->email)->first();

        if ($finduser) {
            Auth::login($finduser);
        } else {
            $newUser = User::create([
                'name' => $user->name,
                'email' => $user->email,
                'google_id' => $user->id,
                'password' => encrypt('my-google')
            ]);

            Auth::login($newUser);
        }

        return redirect()->intended('dashboard');
    }
}

```

**b. Bikin Routes**
Buka file `routes/web.php` dan tambahin routes berikut:

```php
use App\Http\Controllers\GoogleController;

Route::get('auth/google', [GoogleController::class, 'redirectToGoogle']);
Route::get('auth/google/callback', [GoogleController::class, 'handleGoogleCallback']);

```

#### 5. Modifikasi Model User
**a. Tambahin Kolom `google_id`**
Jalankan perintah migrations untuk menambahkan kolom `google_id`

```bash
php artisan make:migration add_google_id_to_users_table
```

Kemudian silahkan buka file migration yang baru saja dibuat, lalu tambahkan baris kode ini:

```php
$table->string('google_id')->nullable();
```

Jalankan migrasi buat update database schema:

```bash
php artisan migrate
```

#### 6. Uji Coba Aplikasi
**a. Jalankan Server Laravel**
Jalankan server Laravel temen-temen:

**b. Akses URL Google Auth**
Buka browser dan akses URL http://localhost:8000/auth/google. Temen-temen bakal diarahkan ke halaman login Google.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2eepvthitz44j5bg1gax.png)

Nanti kalau udah berhasil bakal ada data temen-temen di tabel `users`

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jgqwik3dte6pipkfjsmn.png)

#### Kesimpulan
Itu dia langkah-langkah buat instalasi OAuth Google di Laravel. Dengan mengikuti tutorial ini, temen-temen bisa bikin fitur login dengan Google di aplikasi Laravel temen-temen. Semoga bermanfaat dan selamat mencoba, Sobat Koding! Kalau ada pertanyaan atau kendala, jangan ragu buat komentar di bawah. Happy coding! 🎉