URL Blocked: This redirect failed because the redirect URI is not whitelisted....(Localhost web application)

Question

URL Blocked: This redirect failed because the redirect URI is not whitelisted in the app’s Client OAuth Settings. Make sure Client and Web OAuth Login are on and add all your app domains as Valid OAuth Redirect URIs.

I've installed the laravel/socialite and I'm trying to link my application with facebook ! after installing the package ,creating my facebook application , I try to acces to the login page with facebook on my application but it keeps telling me that ther's some kind of URL errors ... ??? any ideas.?

Wilhite

The message already tells you what settings you should look at. – Karlotta

thank you but i already solved this problem !! it's because my facebook app is not seted as " public " my Problem is solved :) thx – Wonacott

Answer 1

I faced this issue as well.
What I did: When you get this message, copy the URL from the browser window, and inspect it. The URL has the redirect URL mentioned within it.
Copy the exact redirect URL as mentioned, and put it under Valid OAuth Redirect URLs, it will solve the problem.

Wrestling

I can't thank you enough for this solution. I got this to work for woocommerce social login with this mention now that strict mode has been enforced. – Xiphoid

Answer 2

It's redirect URL problem. Facebook automatically generates a redirect URL which is http://...[your domain]..../signin-facebook. You need to add this URL to Client OAuth Settings along with your own redirect_URL like below:

Hope it helps

Flora

what I was missing was the /signin-facebook part of the url - huge thanks! – Danaedanaher

Answer 3

I've just had the issue (Nov 2017), after years of it working (but did I change something inadvertently?).

The fix was to add the callback url in the "Facebook Login" "Products" (in the left menu, in the Facebook admin console, NOT in the "Advanced settings" where I've tried everything:

https://developers.facebook.com/apps/{{your FB app id}}/fb-login/settings/

Note that you need to put the port number if you have one, e.g. in my case http://local.dishly.menu:3000/

Sargasso

This is the crazy part, happened to me as well, in 2021: "after years of it working (but did I change something inadvertently?)" – Flagelliform

Answer 4

I had an issue with this, specifically with heroku. My test site was not https. It was http. And by default, facebook likes to prepend a url with https if you don't manually type it in when typing in the url.

So, I added two urls. one with http, and one with https. works fine now \o/

Dalhousie

Answer 5

I had this issue because I was using Ajax to login and signup for my site, so I added this redirect url

https://yoursite.com/wp-admin/admin-ajax.php?action=gears_fb_connect&callback=true 

and it worked perfectly any user can sign in with his facebook account.

Marten

you add this urk to your fb developper account under <<Valid OAuth Redirect URIs>> and you are done – Marten

Answer 6

I'll post it here just in case it's useful to someone in the future because I got in this question looking for answer...

In my case I got this error while trying to integrate Facebook as an Identity provider in conjunction with Azure AD B2C custom policies.

Microsoft docs mentions a given URL in this format:

https://your-tenant-name.b2clogin.com/your-tenant-name.onmicrosoft.com/oauth2/authresp

however when clicking the Facebook login button it was redirecting with the tenant Id instead of the Tenant Name like this:

https://your-tenant-name.b2clogin.com/TENANTIDHERE/oauth2/authresp

This was causing the URL to be blocked by Facebook.

I discovered this by reading this answer right here.

If you need to decode the URL that it's redirecting to, you can use this:

https://www.urldecoder.org/

Townsman

Answer 7

There is only one valid answer to this question, go and analyse url that shows the URL not accepted facebook page. The url that you need to put into "Valid OAuth redirect URIs" is available there.

In my case it was :

https:// facebook /v3.2/dialog/oauth?client_id=4423058&redirect_uri=https://{The Web Site Name} /complete/facebook/&state=VnZlfU3hp&return_scopes=true&scope=email

The answer in my case :

https://{The Web Site Name}/complete/facebook/

Highoctane

Answer 8

I was having this same issue, but my error was that I was not properly encoding the return uri in the Facebook oauth query string. So, if your return uri is something like this

https://www.example.com/social-signin?provider=facebook

Don't forget to (URL) encode it like this:

https%3A%2F%2Fwww.example.com%2Fsocial-signin%3Fprovider%3Dfacebook

The final Facebook oauth uri should look like this:

https://www.facebook.com/v4.0/dialog/oauth?client_id=YOUR_CLIENT_ID&scope=email&auth_type=rerequest&response_type=token&display=popup&redirect_uri=https%3A%2F%2Fwww.example.com%2Fsocial-signin%3Fprovider%3Dfacebook

Handiness

Answer 9

In my case, having an issue with the HTTPS protocol. Must use your domain or localhost server with HTTPS Protocol,

Old localhost url: http://127.0.0.1:8000/

New localhost url: https://127.0.0.1:8000/

Put URLs in Valid OAuth Redirect URIs in Facebook Login Settings,

https://127.0.0.1:8000/social-auth/login/facebook/

https://127.0.0.1:8000/social-auth/complete/facebook/

Kingsbury