My application ( https://app.sketchdeck.com ) makes this call:
Firebase.authWithOAuthPopup(provider, onComplete, [options])
(api doc: https://www.firebase.com/docs/web/api/firebase/authwithoauthpopup.html)
On desktop safari, it works great. On mobile safari, onComplete never gets called.
Any ideas for making it work on Safari mobile, or debugging further?
Thanks!
Related
The following code works great on desktop and laptops, any browser or OS. It even works fine in Safari on iPhone, but on Google Chrome on iPhone it doesnt. When my button is pressed a new window opens up that has a blank page that states "Please close the window". The blank page is pointing to https://accounts.google.com/o/oauth2/auth with a bunch of query strings. Why is Chrome behaving this way on the iPhone?
window.gapi.auth.authorize(
{
'client_id': clientId,
'scope': scope,
'immediate': false
},
handleAuthResult);
function handleAuthResult(authResult) {
gapi.load('picker', { 'callback': createPicker });
}
I have an HTML5 application that uses Azure mobile services authentication to login (straight from the example code...provided below). It works fine in all desktop browsers and iPhone 5 in Safari. But from app / full screen mode, it does nothing (doesn't ask for permission to show a popup window like it does in safari and no popup windows shows up) and I can wait forever and nothing happens. If I invoke it a second time, it gives an error saying "Error: Unexpected failure"...perhaps because the 1st attempt is still running? Any help/insight is appreciated.
client.login ("facebook").done(function (results) {
alert("You are now logged in as: " + results.userId);
}, function (err) {
alert("Error: " + err);
});
edited update with more info and 2 potential ideas*
I did some more research and found a site that uses an approach that overcomes this problem and also solves two other side effects with the current Azure mobile approach to authentication. I think the Azure mobile team might be looking to do something similar because there are some hints of other authentication options in the code (although difficult to read and be sure because the minimized code is obsfucated). It might be just a matter of activating these in the code...
The "solution":
Go to http://m.bcwars.com/ and click on the Facebook login. You'll see it works perfectly in iPhone Safari in "app mode" becuase instead of doing a popup, it simply stays in the current browser window.
This approach solves two other problems with the current Azure mobile approach. First, the popup gets interpreted by most browsers as a potential ad and is either blocked automatically (desktop Chrome) ... and the user doesn't know why it's not working...or gives a warning which the user has to approve (iPhone Safari in "browser mode") which is a hassle. And if the user has a popup blocker, it gets more difficult and even more potential for the user not getting it to work properly. The bcwars.com method doesn't have this problem.
Second, in iPhone Safari, when the popup window auto closes, the original page doesn't get focus if there are other browser windows open in Safari. Instead, it's in the smaller/slide mode so they can choose which one to show. If this happens, the user has to go through one more sttep...click on the browser window to activate it and give it focus..again more of a pain and more potential for them to mess up and not do it correctly and need help. The m.bcwars.com doesn't have this problem.
Azure options:
Looking at the Azure mobile code it looks like may already have the solution. I can't read it easliy becuase it's minified/obsfucated, but it seems to have 4 options (including iFrame, etc.) for invoking the authentication, and only 1 (the "less ideal one" of a popup) is being used. An easy solution would be to set a property to allow one of the alternate authentications to work. But I can't read it well enough to figure it out. Another would be to hack the code (temporarily until a fix is put up by Microsoft).
Could I get some help there perhaps?
You can implement an authentication flow with Facebook that doesn't use a popup. The basic idea is to use the 'Web Flow' for doing the login, and once the window return from the login, use the access token to login the user in to Azure Mobile Services.
The Facebook documentation for doing this is here:
https://developers.facebook.com/docs/facebook-login/login-flow-for-web-no-jssdk/#step2
Some code samples to make it easier for you.
You would start by something like this:
(Remember to replace YOUR_APP_ID and YOUR_URL with something relevant to your site.
function logIn() {
window.location.replace('https://www.facebook.com/dialog/oauth?client_id=YOUR_APP_ID&redirect_uri=http%3A%2F%2FYOUR_URL&response_type=token')
}
This redirects the window to the Facebook page for the user to log in and authorize your app. When the user is done, Facebook will redirect the user back to YOUR_URL given above.
There you can handle the redirect and do the Mobile Services Login with something like this:
function handleLoginResponse() {
var frag = $.deparam.fragment();
if (frag.hasOwnProperty("access_token")) {
client.login("facebook", { access_token: frag.access_token }).then(function () {
// you're logged in
}, function (error) {
alert(error);
});
}
}
In here you parse the access token you get as a URL fragment and pass it as argument to the login call you make to Azure Mobile Services.
This code depends on the jquery BBQ plugin to handle the URL fragment easily.
Hope this solves your problem!
I have created a facebook app which, after clicking a submit button, asks the user for permissions. If the permissions are given, the user is redirected. This works fine in every browser I tested, except for Opera. Opera just doesn't seem to enter the callback function:
$("#perms").click(function(){
FB.ui( { method: 'oauth' } ,
function(response){
alert('test');
if (response != false) {
res = eval('(' + response.session + ')')
}
}
);
});
In Opera, I am asked for permissions, but the alert never happens. Am I doing something wrong? Is there a different (newer) way to ask for permissions that works with Opera? I googled this problem but found only one page with a sort of similar problem. Adding the channel.html didn't solve the problem though.
Thanks in advance
Still see this issue on Opera 11.52.
browser.js enabled and updated to the latest version.
channelURL set as described in FB docs.
But! it works if I use gistfile.js (beautified version of all.js) located on my host
Do you have browser.js enabled? We have workarounds against some problems with Facebook's Connect script. Note that the workarounds will only trigger if you run Facebook's script from the "official" location on Facebook's server.
For background, please see my response on FB.login callback not working on Opera Mobile browser
For our iPhone native application we have a URL : example://
On the iPhone if I type this URL (example://) in safari it automatically opens up my application.
From my "regular" website I have a link which when the user clicks it opens the application. The problem is that if the application is not installed on the iPhone it throws "Unable to open" error.
So before rendering the link on my "regular" site I need to check if the app is installed, one solution is to make an Ajax call and check for status code:
$.ajax({
type: 'POST',
url: 'example://',
complete: function (transport) {
if (transport.status == 200) {
alert('Success');
} else {
alert(transport.status);
alert('Failed');
}
}
});
But this code is always returning a status code "0".
Is there a way to find out from the web if the native iPhone app is installed?
If u are referring to Mobile Safari, you're out of luck. There's no documented public API that I know of that can do this. Mobile Safari is sandboxed away from the OS.
If it's in a webview within an app, u can request the URL and let the webview delegate talk to the native app / query the handling of example://. Otherwise, no way the browser can know existence of any installed app.
I am playing with Facebook C# SDK to use with ASP>NET application, and was using FacebookWebContext.Current.IsAuthorized method after login on client side with JavaScript SDk to procceed with further actions (retrieve user info, friends list,etc). It was working on beginning but suddenly stop about week ago. FacebookWebContext.Current.IsAuthorized method is always false now. Checking further found that its working in Safari and Firefox 4, but fails in IE9 and Chrome.
It seems that IE9 doens't see facebook cookie like fbs_ApplicationID. Testing different examples in JavaSDk console on Facebook site shows that Facebook FB.Cookie.load method doesn't return any value in IE9 and Chrome.
So my question, is there other way to "auhtorize" application on a server side using SDk? Is that Facebook side issue specific to browsers? FB.login callback function does return session info, but how I can use it then on server side to activate FacebookWebClient?
I have the same problem, but the behavior is very odd. It was working yesterday and now not working in Chrome and IE9. The fbWebContext.AccessToken is null and there's no fbs_xxxxx cookie. It's fine in Firefox and Safari.
Here's my code:
var fbWebContext = FacebookWebContext.Current;
var app = new FacebookWebClient(fbWebContext);
dynamic fbUser = app.Get("me");