4

I have the code below to login with Facebook. But it's not working it shows:

“Can't Load URL: The domain of this URL isn't
  included in the App's domains. To be able to 
    load this URL, add all domains and subdomains of your app to the
   App Domains field in your app settings."

But the URL was defined.

Routes:

Route::get('auth/{provider}', [
    'uses' => 'OauthController@redirectToProvider',
    'as' => 'social.auth'
]);

Route::get('auth/{provider}/callback', [
    'uses' => 'OauthController@handleProviderCallback',
]);

services.php:

'facebook' => [
        'client_id' => '...',
        'client_secret' => '...',
        'redirect' => 'https://....ngrok.io/auth/facebook/callback'
    ]

OauthController:

class OauthController extends Controller
{

    public function redirectToProvider($provider)
    {
        return Socialite::driver($provider)->redirect();

    }


    public function handleProviderCallback($provider)
    {
        $userFace = Socialite::driver($provider)->user();
        // $user->token;

        $findUser = User::where('email', $userFace->email)->first();

        if($findUser){
            Auth::login($findUser);
        }else{
            $user = new User;
            $user->name = $userFace->name;
            $user->surname = "";
            $user->email = $userFace->email;
            $user->password = bcrypt($user->name);
            $user->save();
            Auth::login($user);
        }
    }
}

I change some configurations and now it appears a different error. The user clicks in "Login with Facebook" button and is redirected to the facebook page and is necessary to introduce the password. After introducing the password the user is redirected to "https://....ngrok.io/auth/facebook/callback?code=...&state=...#=" and it appears a page with:

Laravel \ Socialite \ Two \ InvalidStateException
No message

This error is in the file /socialite/src/Two/AbstractProvider.php in "public function user() { if ($this->hasInvalidState()) { throw new InvalidStateException;}... "

Configurations:

Laravel configurations:

In services.php
    'redirect' => 'https://....ngrok.io/facebook/auth/callback'

In .env file:
    APP_URL=https://....ngrok.io

Facebook settings:

Client OAuth Login - yes
Web OAuth login - yes
Force Web OAuth Reauthentication - yes
Use Strict Mode for Redirect URIs - yes
Enforce HTTPS - No
Embedded Browser OAuth Login - No

Valid OAuth Redirect URIs: https://....ngrok.io/facebook/auth/callback

Basic settings: 
    App domains: ....ngrok.io
    Site URL: https://....ngrok.io/facebook/callback

If I use localhost it works.

With "'redirect' => 'proj.test/auth/facebook/callback'";.

And in facebook settings:

Site url: proj.test/auth/facebook/callback

App domains: proj.test

Valid OAuth Redirect URIs proj.test/auth/facebook/callback'"

However its not working properly, the user is redirected to "proj.test/auth/facebook/callback?code=......=";, its inserted in the DB but it appears a blank page instead of the user being redirected to the "proj.test".

  • read the facebook error, you need register your app in facebook and add your domain – J. Doe Jul 13 '18 at 15:05
  • Thanks, but as it is in the question I already added the domain. –  Jul 13 '18 at 15:11
  • Looks good. Try clearing config cache, run "php artisan config:clear". Also try to set 'redirect' => '/auth/facebook/callback'. It seems that 'redirect' option in your services is ignored. The "redirect_uri" in the constructed facebook url comes from the 'redirect' option of "facebook" in services.php. – Jannes Botis Jul 27 '18 at 22:44
  • Thanks, are you saying to test with only "/auth/facebook/callback" instead of "https://....ngrok.io/auth/facebook/callback"? –  Jul 27 '18 at 22:51
  • Like that when the user clicks in the login with facebook button the user is redirected to "https://www.facebook.com/v3.0/dialog/oauth?client_id=...&redirect_uri=https....ngrok.io%2Fauth%2Ffacebook%2Fcallback&scope=email&response_type=code&state=..." and it shows an error "blocked url" the redirect url is not in the whitelist..... –  Jul 27 '18 at 23:03
  • But then if the user clicks in "ok" its redirected to "https://....ngrok.io/auth/facebook/callback?error_code=...&error_message=....&state=...#_=_" and it shows: Client error: `POST https://graph.facebook.com/v3.0/oauth/access_token` resulted in a `400 Bad Request` response: {"error":{"message": (truncated...). The message is not in english but the translation is like "Is not possible to load url. The domain of this url is not included (truncated...)". –  Jul 27 '18 at 23:03
  • I think the problem is that 'redirect' => 'https://....ngrok.io/auth/facebook/callback' is ignored and the value "proj.test" is used for some reason. Try "php artisan config:clear". – Jannes Botis Jul 27 '18 at 23:18
  • Thanks I used that command config:clear but same error. –  Jul 27 '18 at 23:22
  • Try running "php artisan config:cache" on the PRODUCTION server to regenerate the config cache. – Jannes Botis Jul 28 '18 at 14:46
  • Thanks, I dont have a production server, using nkrok is not considered production server right? (Im a beginner) –  Jul 29 '18 at 02:06
  • Try clearing all caches & configs: `php artisan clear-compiled && php artisan view:clear && php artisan cache:clear && php artisan route:clear && php artisan config:clear`. Also, unless you need to access your dev site from outside your box, you don't need ngrok to test Facebook: https://stackoverflow.com/questions/2459728/how-to-test-facebook-connect-locally – Maksida Jul 29 '18 at 02:53
  • Thanks but same "Client error: `POST https://graph.facebook.com/v3.0/oauth/access_token` resulted in a `400 Bad Request`" error using that commands to clear the caches and configs. –  Jul 29 '18 at 10:45
  • can you confirm your FB provider id ? – Sagar Ahuja Aug 02 '18 at 06:07
  • The client_id configured in services.php is equal to the APP ID configured in basic settings. –  Aug 02 '18 at 10:58

2 Answers2

0

I recommend you to set up on your project XDEBUG. Then you will be able to put breakpoints in your project and you would know what is going on.

You can easily find instruction for XDEBUG installation for your environment. Here is a good example: Installing Xdebug on Homestead 7.0, PHP 7.2

YanDatsiuk
  • 1,885
  • 2
  • 18
  • 30
-1

Facebook not accept localhost routes for redirection, if you try put your redirect url in the facebook console api this return a error , you must test this in development or production enviroment with a real url

Felipe Mora
  • 42
  • 1
  • 11
  • Thanks, but using ngrok url is considered localhost? –  Jul 31 '18 at 16:34
  • I think that same if you pass by túneling, you must provide a URL distinct of localshost, because Facebook not accept this how redirect url, then you can test this only in dev or production enviroment – Felipe Mora Aug 04 '18 at 20:53