haizone
153
0
Laravel

laravel socialite and nuxtJS

Posted 5 months ago by haizone

hi

i build a laravel api and nuxtjs

the laravel url is: http://localhost:8000/api/ te nuxtjs url is: http://localhost:3000/

i try to use socalite with my app

and i didnt anderstend how to open a popup conntect with google and return the date to my nuxt app

this is my code:

laravel controller:

class SocialLoginController extends Controller{


    public function redirect($service, Request $request){
      return response()->json([
         'redirectUrl' => Socialite::driver($service)->stateless()->redirect()->getTargetUrl()
     ]);
  }

    public function callback($service, Request $request){

      $serviceUser = Socialite::driver($service)->stateless()->user();

      return response()->json([
           'user' => $serviceUser
     ]);
}

my nuxt app code:

  <template>

  <a @click.stop="socialLogin()">google connect</a>


    </section>
  </template>

  <script>


  export default {
      methods: {
        
  socialLogin(){
        this.isProcessing = true;
        this.error = {};
        this.$axios.$get(`http://localhost:8000/api/auth/login/google`)
            .then((response) => {
              console.log(response)
                if(response.error){
                    this.error = err.response.error;
                } else if(response.redirectUrl){
                    window.location.href = response.redirectUrl;
                }
            })
            .catch((err) => {
                if(err.response.data.error){
                    this.error = err.response.error;
                }
                this.isProcessing = false;
            });
            this.isProcessing = false;
        }


      },
        
  }
  </script>

  <style>

  </style>

my env callback url:

GOOGLE_REDIRECT_URL=http://localhost:8000/login/google/callback

Please sign in or create an account to participate in this conversation.

Reply to

Use Markdown with GitHub-flavored code blocks.