Given URL is not allowed by the Application Configuration

[xyboox]

Hi,

after setting up the FB app for Android ( filled in the package name generated the key hash and checked "single sign on", when running the code in the emulator, I get this error: "Given URL is not allowed by the Application Configuration". Do I need to setup also a "website" platform on FB? And if so, what should be the "site URL" since this is supposed to work in a cordova project?

Thanks.

[jBenes]

Hi,
I have same problems. It looks like that this library can log you in via JavaScript SDK by default (e.g. for testing in Chrome). It works fine for me - I have created Web App in developers.fb and specified "site URL" as my origin (I am testing it localy on linux, so I had edit /etc/hosts and add alias xxx.com for localhost, because FB does not allow "localhost" as "site URL").

But when I am trying to get this working on android build, I am getting error "Uncaught Missing localSDK setting pointing to the local javascript file with the Facebook SDK" in console and when I hit login, I get same error as you. I think that app tries to log in via JS SDK as above and not via local android SDK.
Cordova injects this script - file:///android_asset/www/plugins/com.phonegap.plugins.facebookconnect/www/phonegap/plugin/facebookConnectPlugin/facebookConnectPlugin.js
This script defines "facebookConnectPlugin" object and I can log in with it. I think that we should force angular-facebook library to use this object, but don't know how yet.

Maybe I am wrong, but "angular-facebook-phonegap.js" script in this library is 9 months old and SDK api probably had changed. I guess we have to modify this module.

[frg]

Hi,

I too have this problem.. Followed the instructions given by @jBenes and it worked on my local pc but I could get it to work over Cordova.

Any help appreciated! :)

[jBenes]

@frg Can you access window.facebookConnectPlugin object from cordova? I have it there and it works (if I use it directly). But it is not compatible with this angular-facebook library, so I think they changed API.
If I am right and didn't install it wrong, one option would be to write adapter for window.facebookConnectPlugin and inject it into angular-facebook lib.

But I spent lot of time on this issue and rather decided to implement FB integration with Open Graph. It's working for me both on cordova and chrome (it is not clean to use Open Graph on cordova, but you don't need to install native SDK, only include small JS library).

If you decide to switch to OG as me, here is good tutorial: http://ccoenraets.github.io/ionic-tutorial/ionic-facebook-integration.html
And here are mentioned files: https://github.com/ccoenraets/OpenFB, but I had to make some changes in code.

But If you manage to handle with it without using OG, tell us how please :)

[frg]

@jBenes Yes I can access "window.facebookConnectPlugin".. I fear that you're right. Was hoping I found a strong fb integration solution. I guess I'll have create a custom solution!

Thanks for the resources. I'll look into them and let you guys know what worked for me! :)

[jBenes]

@frg OK, if you go throught this tutorial, you can use my modified version of openfb.js file, so you don't need to debug it again (If I have time, I will make a PR from this).
https://gist.github.com/jBenes/bbe03c1a8d9a0c7ee3e6
And good luck :)

[frg]

Hi @jBenes ,

I'm getting a "redirect_uri URL must be absolute" error.
Any ideas?

[jBenes]

Hi,
@frg, you mean when used in cordova with openFB lib? In that case you have to provide exactly this url - https://www.facebook.com/connect/login_success.html url for login success and allow it in advanced settings in developers.facebook.com.
This url defines in openFB lib, oauthRedirectURL variable.

Login process runs in popup window, so it doesn't matter that this url is outside of our apps, popup will be closed anyway.

[jBenes]

Hi @frg ,
I wrote angular module, which unifies interfaces of different FB libraries.

It works this way.. You can define adapter for FB library you want and it must implement predefined interface. In angular config you choose (based on window.cordova variable) which adapter you want to inject. In controller you don't care which lib is used, you just call methods of library wrapper.

So far I have 2 adapters: for OpenFB library (can be used for develop in chrome) and for facebookConnectPlugin (can be used on android).

I haven't implemented all methods, just the ones I use. But it can be easily extended and it's trivial to add adapter for other FB libraries.

You can use it, if it helps you. I will write docs in next days.

Repo: https://github.com/jBenes/angular-facebook-integration

Example how to use it: https://gist.github.com/jBenes/61061ac3eea01d5e5f5e

[obcdnico]

Problem is open on stackoverflow, we need a solution.

https://stackoverflow.com/questions/27876852/ionic-with-facebook-connect-on-android-device-probleme-return-url