README

A ready-to-use Social Login package for Laravel + Vue 3 applications, built by Nyusoft Solution. This package currently supports Google Login and is structured for seamless integration with Facebook, LinkedIn, and Apple in future releases.

This package directly installs and configures vue3-google-login through Laravel Artisan commands and provides a backend API to handle token validation.

🚀 Features

✅ Easy installation via Composer & Artisan
🌐 Google OAuth2 login with Vue 3
📦 Auto-installs vue3-google-login during setup
🔐 Secure Laravel API callback
🧱 Future-ready for Facebook, LinkedIn, and Apple

⚠️ Important Notes:
✅ Make sure Vue 3 is properly set up in your Laravel + Vue project before installing this package.
api.php must be present in your Laravel project.
If you install api.php after setting up this package, manually add this line to your routes/api.php:
require __DIR__.'/api/google.php';
You must handle the user detail mapping on login.
By default, the system sets name, email, provider_id, and provider.
If your users table has more fields, customize this logic in:
Http/Controllers/Api/[ProviderName]AuthController.php

If you're using any authentication system like Passport, JWT, Sanctum, etc.,
ensure that token generation and response are handled appropriately within the same controller.

in Linkedin Login the package is working with openid.

📦 Installation

Install the package via Composer:

composer require nyusoftsolutions/laravel-vue-social-login

Then run the install command:

Avalable package is Google, Linkedin 
['you can install multiple at single time by pass comma']

php artisan nyusocial:install Google

This will:

Register routes and controller
Publish frontend component and assets
Install vue3-google-login via NPM
Install vue3-linkedin-login via NPM

⚙️ Configuration

Set this in your config/services.php file under the service providers: add service provider according to your install package.

for linkedin use linkedin-openid.

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

🛠 Vue 3 Integration

📄 Or use it directly in a specific component

Here just import the Google Login from componets.

<script>
import [Provider_Name]Login from './Components/[ProviderName]Login.vue' ;
 // change accorging to yor project structure.
 export default {
    components: {
        [Provider_Name]Login
    },
}
</script>

💡 change accorging to yor project structure.

🔘 Login Button Example

Here's how you can add the login button inside your component:

Google

<GoogleLogin :client_id="'YOUR_CLIENT_ID'" />

    <LinkdinLogin
    client_id="YOUR_CLIENT_ID"
    client_secret="CLIENT_SECRET"
    redirect_uri="CLIENT_REDIRECT_URL"
    />

💡 You can replace the image or customize the button style as per your design.

🔧 Backend API Endpoint

Your frontend will POST the Google token to:

Google

POST /callback/google

Ex = PROJECT_BASE_PATH/callback/google

This will:

Validate the Google access token
Create or log in the user
Return a user info

pass the page link where you want to show or redirct the user.

🧩 Coming Soon

Provider	Status
Google	✅ Available
Facebook	🔜 Planned
LinkedIn	✅ Available
Apple	🔜 Planned

📝 License

This package is open-source and licensed under the MIT License.

💡 Developed with ❤️ by Nyusoft Solution

nyusoftsolutions / laravel-vue-social-login

Maintainers

Details