Google Sign-in in vuejs spa and laravel api Google Sign-in in vuejs spa and laravel api laravel laravel

Google Sign-in in vuejs spa and laravel api


Take a look at hellojs

Hellojs makes it easy. Allows you to open a popup for login with the social provider and returns an access token. then you use the access token in your backend to get the user.

so your js would look something like this

 hello  .login(network)  .then(    () => {      const authRes = hello(network).getAuthResponse();      axios        .get('api/link/to/sociak/callback',{            params:{              access_token : authRes.access_token,               provider: network            }         })        .then((response) => {console.log(response.data.token)})})        .catch((error) => {console.log(error.response.data)})    },    (e) => {      console.log(e)    }  )

and in your controller you handle it like ..

public function handleProviderCallback(Request $request){    $s_user = Socialite::with($request->provider)->stateless()->userFromToken($request->access_token);    //your logic here...}

Hope it makes it clearer for you. I was just struggling with this and hello js made my life simple


In adition to the previous answer, i used vue-hellojs to add the goolgle's authentication window and get a token (with 'email, profile' scope).

Then send it to the laravel backend (with google socialite provider and CORS installed) who check if there is a user with that email and respond with a laravel jwt-token to the vue SPA as login do.