Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

cizario's avatar

Socialite, Ajax and CORS problem

hi, i'm building "one single page" app (laravel v5.4.30) and i'm combining Socialite and Ajax to retrieve user's data from Linedin and Medium and i'm using laravel-cors to handle CORS but it seems not working, i tried many ways but still stuck.

i'm showing you scrennshot to get things more clear : https://imgur.com/a/cee38

and this is my code config/cors.php

    'supportsCredentials' => false,
    'allowedOrigins' => ['http://ymapp.local'],
    'allowedOriginsPatterns' => [],
    'allowedHeaders' => ['*'],
    'allowedMethods' => ['*'],
    'exposedHeaders' => [],
    'maxAge' => 0,

kernel.php

protected $routeMiddleware = [
    'auth' => \Illuminate\Auth\Middleware\Authenticate::class,
    'auth.basic' => \Illuminate\Auth\Middleware\AuthenticateWithBasicAuth::class,
    'bindings' => \Illuminate\Routing\Middleware\SubstituteBindings::class,
    'can' => \Illuminate\Auth\Middleware\Authorize::class,
    'guest' => \App\Http\Middleware\RedirectIfAuthenticated::class,
    'throttle' => \Illuminate\Routing\Middleware\ThrottleRequests::class,

    'cors' => \Barryvdh\Cors\HandleCors::class,  // Larvel CORS
];

web.php

Route::group(['middleware' => ['web']], function () {
[...]
    Route::get('/auth/{provider}',             ['as' => 'auth.provider',          'uses' => '\App\Http\Controllers\Front\AuthProviderController@redirectToProvider'])
        ->where(['provider' => 'linkedin|medium'])
        ->middleware('cors')
        ;

    Route::get('/auth/{provider}/callback',    ['as' => 'auth.provider.callback', 'uses' => '\App\Http\Controllers\Front\AuthProviderController@handleProviderCallback'])
        ->where(['provider' => 'linkedin|medium'])
        ->middleware('cors')
        ;
});

AuthProviderController.php

class AuthProviderController extends Controller 
{
    /**
     * Redirect the user to the GitHub authentication page.
     *
     * @return \Illuminate\Http\Response
     */
    public function redirectToProvider($provider)
    {
        return \Socialite::with($provider)->redirect();
    }

    /**
     * Obtain the user information from GitHub.
     *
     * @return \Illuminate\Http\Response
     */
    public function handleProviderCallback($provider)
    {
        $user = \Socialite::driver($provider)->user();
        // dd($user);
        return response()->json(['user' => $user]);
    }   
}

main.js

$('.auth-provider').click(function(e) {
    e.preventDefault();
   
   var $provider = $(this);
   
   $.ajaxSetup({
       cache: false,
       crossDomain: true,
       crossOrigin: true,
   });
  
  $.ajax({
      url: $provider.data('url'),
      dataType: 'json',
      success: function(json) {
         console.log(json);
      },
      error: function(json) {
        console.log(json);
     }
    
  });

});

i really appreciate any help

0 likes
2 replies
cizario's avatar

i'm really straggling with this issue, anybody walk me through ? i appreciate any help.

Please or to participate in this conversation.