How should I set Facebook app domains when I'm using cloud9 IDE?

I'm using Laravel 5.6 + Socialite to implement a login flow using Facebook. I'm also using cloud9 to help me to develop it.

I followed many tutorials, but this red message is still appearing when I try to login through my development environment:

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.

Something is missing. It seems to be a Facebook settings problem and I think my Cloud9 URLs may be causing it. Maybe C9 URLs are blacklisted, but I didn't find any official confirmation about it here or in other places.

Here my current "Facebook For Developers" settings:

Settings > Basic > App Domains: myapp-myusername.c9users.io/
Settings > Basic > Website: http://myapp-myusername.c9users.io/
Settings > Advanced > Domain Manager list: http://myapp-myusername.c9users.io/ and http://myapp-myusername.c9users.io:8080/
Settings > Advanced > Share Redirect Whitelist: Allow Cross Domain Share Redirects marked as "Yes"

My Controller (app/Http/Controllers/SocialAuthFacebookController.php):

<?php

namespace Zyga\Http\Controllers;
use Socialite;

class SocialAuthFacebookController extends Controller
{
    public function handleProviderCallback()
    {
        return Socialite::driver('facebook')->user();
    }

    public function redirectToProvider()
    {
        return Socialite::driver('facebook')->redirect();
    }
}

config/services.php:

'facebook' => [
    'client_id' => 'blablabla1',
    'client_secret' => 'blablabla2',
    'redirect' => 'https://myapp-myusername.c9users.io/login/facebook/callback',
],

routes (web.php):

Route::get('login/facebook', 'SocialAuthFacebookController@redirectToProvider');
Route::get('login/facebook/callback', 'SocialAuthFacebookController@handleProviderCallback');

Added alias and provider config/app.php:

'providers' => [
    // ...
    Laravel\Socialite\SocialiteServiceProvider::class,
],
'aliases' => [
    // ...
     'Socialite' => Laravel\Socialite\Facades\Socialite::class,
],

And my login button:

<a href="{{url('/login/facebook')}}">Login with Facebook</a>

EDIT

After I save http://myapp-myusername.c9users.io/ it appears without "http".

Any suggestion? Should I check anything else? I know we can find other similar questions here, but they seem outdated, because Facebook dev dashboard now offers different settings.

Solution

It was a Facebook settings problem.

You need to "Add Product", follow the wizard, then in Settings include all your redirect and callback URLs in "Valid OAuth redirect URIs". This form only appears after your "Add Product".

It works perfectly in Cloud9 and you don't need to set ports or so.