Halaman login laravel dengan tambahan gmail register

Setelah laravel 12 terinstall

ikuti langkah-langkah berikut untuk membuat halaman login

Masuk direktori dimana laravel 12 terinstall, lalu ketik perintah

composer require laravel/breeze

setelah itu

php artisan breeze:install lalu pilih blade

Ubah Tabel Users dan Model User

Tabel User (databases/migration/.....user)

Model User (app/Model/User.php)

Lalu ketikan perintah

php artisan migrate

jika berhasil maka akan muncul tampilan seperti berikut

Install Socialite Package

Jalankan perintah

composer require laravel/socialite

info packages yang terinstall akan muncul seperti berikut

Buat Controller SocialController

php artisan make:controller SocialController

Tambahkan kode berikut di SocialController.php

Import Kelas

use App\Models\User;

use Illuminate\Support\Facades\Auth;

use Laravel\Socialite\Facades\Socialite;

Masukkan kode berikut ke dalam file SocialController.php

public function googleRedirect()

    {

        return Socialite::driver('google')->redirect();

    }

   

    public function loginWithGoogle()

    {

        try {

            $googleUser = Socialite::driver('google')->stateless()->user();

            $existingUser = User::where('google_id',$googleUser->id)

                ->orWhere('email',$googleUser->email)

                ->firest();

            if ($existingUser){

                if($existingUser->google_id !== $googleUser->id){

                    $existingUser->google_id = $googleUser->id;

                    $existingUser->save();

                }

                Auth::login($existingUser);

            } else {

                $createUser = User::create([

                    'name' => $googleUser->name,

                    'email' => $googleUser->email,

                    'google_id' => $googleUser->id,

                    'password' =>bcrypt('password'),

                ]);

                Auth::login($createUser);

            }

            return redirect()->to('/dashboard');

        } catch (\Throwable $th){

            throw $th;

        }

    }

Menyiapkan Route

Import kelas terleih dahulu

use App\Http\Controllers\SocialController;

Berikutnya tentukan rute untuk autentikasi Google

Route::get('auth/redirect',[SocialController::class, 'googleRedirect']);

Route::get('auth/callback',[SocialController::class, 'loginWithGoogle']);

Tambahkan Tautan Login Google ke Balde Registrasi/Login

Troubleshooting

Jika muncul error saat mengakses halaman login seperti ini

Vite manifest not found at: /home/website.laravel/public_html/public/build/manifest.json

lakukan perintah berikut

apt install npm lalu

npm run build

kemudian ketika perintah berikut

npm install

npm run dev

jika masih error seperti ini

npm run build

> @ build /home/website.laravel/public_html

> vite build

/home/website.laravel/public_html/node_modules/vite/bin/vite.js:2

import { performance } from 'node:perf_hooks'

       ^

SyntaxError: Unexpected token {

    at Module._compile (internal/modules/cjs/loader.js:723:23)

    at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)

    at Module.load (internal/modules/cjs/loader.js:653:32)

    at tryModuleLoad (internal/modules/cjs/loader.js:593:12)

    at Function.Module._load (internal/modules/cjs/loader.js:585:3)

    at Function.Module.runMain (internal/modules/cjs/loader.js:831:12)

    at startup (internal/bootstrap/node.js:283:19)

    at bootstrapNodeJSCore (internal/bootstrap/node.js:623:3)

npm ERR! code ELIFECYCLE

npm ERR! errno 1

npm ERR! @ build: `vite build`

npm ERR! Exit status 1

npm ERR!

npm ERR! Failed at the @ build script.

npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:

npm ERR!     /root/.npm/_logs/2025-05-05T02_14_02_310Z-debug.log

solusinya adalah upgrade Node.js

biasanya minta v16. kebetulan di server saya adalah versi 10.

melihat versi Node dengan mengetikan perintah

node -v

untuk upgrade lakukan dengan

curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -

lalu

sudo apt-get install -y nodejs

cek kembali Node sudah terupgrade atau belum dengan perintah

node -v

jika sudah seperti dibawah ini artinya sudah terupdate

v18.20.8

Tampilan Halaman Login dan Register

Halaman depan

Halaman Login

Halaman Register

Tampilan jika berhasil login