The Capacitor Browser is having issues with web redirects - with different behaviors in iOS and Android. I think this is a very buggy plugin, but maybe I'm missing something...
My Ionic app uses the Capacitor Browser plugin to present a Federation Login page. There is an "authentication URL" returned upon successful SSO login - or if the user is already logged in then there is an immediate "authentication URL" redirect.
Here's what I am seeing...
iOS: for a first time login, the web redirect works and deep links back into my app -- no problem here. However, if SSO is active, then there is an immediate redirect which the Browser ignores. I can see the URL change, and it works if I open it in a separate mobile web browser.
Android: for a first time login, the web redirect is ignored and the user is left stuck in the browser. Again, if I copy the URL to a separate web browser then it deep links back into the app.
Has anyone done this successfully or have any workarounds? I've tried the "Cordova" and "Awesome" InAppBrowser versions of this plugin, and they don't redirect at all (although they have a bit more control over closing the browser, etc.).
I encountered a problem like this on Android lately,
The in app redirection was down on Android 12, users where locked on a white screen where we normally get the token in the url and redirect in app.
In my case it was related to this :
https://developer.android.com/training/app-links/verify-site-associations?authuser=2
The chrome browser was trying to check this file to verify the hash of the app to perform the redirection but it was unavailable due to internal network configuration, so it was locked.
This check seems to append on Android 12 only, and needed a re-install of the app on users devices (cache on in app browser ?).
Hope this can help.
(Ionic 6 Capacitor)
Related
I am struggling to utlise the angular-auth-oidc-client to add OIDC workflows into my Ionic app (android), although I feel the issues are more Capacitor so not sure that the library is the issue. There are numerous (old) posts on Google of people who have had similar problems, so I'm trying to ascertain the current state of play. I can:
By utilising a custom android scheme in my AndroidManifest, and an 'appUrlOpen' listener in app.component my OIDC login page loads in the Chrome browser on the device, and then returns to the Ionic app and opens the correct app page. Unfortunately because I've opened the login in Chrome it hangs around in the background with the username and password populated. I've no handle to it to close it, and the Capacitor plugins don't help me here.
Alternatively, I can add my ID Provider domain into 'AllowNavigation' in capacitor.config.json. This opens my login page in the app's webview, begins the redirect on successful login but fails (hangs) because Capacitor is not loaded when it attempts Window.Capacitor.triggerevent calls.
This is probably classed as a poor question, and I appreciate that it is light on code, but I'm interested in whether anyone has actually managed to do this successfully, as there are so many dead ends on google and github of people who've given up!
Yes it is possible to complete an Open ID Flow on ionic with capacitor.
You need a capacitor plugin to do so, ionic provides an own payed plugin (https://ionic.io/docs/auth-connect), other alternatives exist.
angular-auth-oidc-client out of the box works only on browser, not on iOS or Android. It seems that some adoption can be made, see https://github.com/damienbod/angular-auth-oidc-client/issues/807.
I'm building a mobile app using Intel-xdk along with hello.js (a client side javascript sdk) for facebook login because it's the only thing that makes fb login work for me on Intel.
The hello.js instructions were hard for me to figure out even though they seem simple.
This is the init code as provided by the hello.js documentation. https://adodson.com/hello.js/
hello.init({
facebook: ************,
windows: WINDOWS_CLIENT_ID,
google: GOOGLE_CLIENT_ID
}, {redirect_uri: 'index.html'});
I need to note that I'm testing this on the intel-xdk emulator, on my iphone, and on the chrome browser. I am getting two different errors depending on where I test. I get either "app ID invalid", or "redirect uri not supported". Is there a different way I should be writing the redirect uri.
***UPDATE****
I got rid of the "windows" and "google" properties because I'm not using either of them for login. I also swapped "google" into the redirect uri. It didn't work when I used www.google.com, but DID work when I used https://www.google.com. So I think using "https" matters. This is what this init code block looks like now:
hello.init({
facebook: '178363645852696'
}, {redirect_uri: "https://www.google.com"});
Here are the different errors I'm getting now. On the intel-xdk emulator it goes right to google no problem. On the device it tells me I'm not logged in ( which isn't true). On chrome the message in the pop up window says this :
Given URL is not whitelisted in Client OAuth Settings: 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 will continue to work on this and update my solutions, but additional solutions are wanted.
The sdk you are using is for websites not for cordova apps.
If you have code locally and building app using intel-xdk, then using a facebook cordova plugin is best solution, here is tutorial on how to get facebook API working in intel-xdk:
https://software.intel.com/en-us/xdk/article/facebook-connect-plugin-android-ios
I am using Facebook's OAuth dialog to log in people in two of my websites.
Yesterday morning I discovered that the oauth dialog is failing for one of those two website, only when I try to connect with a mobile device (iphone and android).
The way I call the oauth dialog is identical in both websites, except from the App ID of course and the redirect url. Basically I redirect the user to:
https://www.facebook.com/dialog/oauth?client_id=xxxxxxxxxx&redirect_uri=http%3A%2F%2Fwww.xxxxx.xxx%2Ffbresult&response_type=code&scope=email
Normally the user is prompted for logging in with facebook and give permission to the app, and the be redirected back to my website.
This works perfectly fine on both sites if I use it from the Desktop.
When I call this url from my touch devices (iphone or android, they both fail) I am forcely redirected to the mobile version of the dialog (https://m.facebook.com/dialog/oauth?etc,etc).
However this dialog from m.facebook.com dies with 500 internal server error for one of the website. (so: one works perfectly with mobile oauth dialog, the other does not).
I tried to open the m.facebook.com/etc/etc from my desktop pc and I could indeed see the 500 internal server error response.
Should I try to login from the desktop (which does not redirect to mobile version) then the authentication procedure works perfectly.
At first I thought this might be a facebook bug and that it would have been fixed within few hours at most, but it's been now for at least 2 days and still does not work.
I think I could really appreciate some advice at this point. Thank you all in advance.
we have created a Facebook app, but when opening this on a mobile (via Web or iPhone) the page results in a 4oh4 error. I have setup a Mobile Web URL but still (after 1 hour wait) gives a 404.
Do I need to make specific changes on my app?
Please help.
This is expected as #Igy stated. You will need to have a handler to support redirecting mobile users to your apps.facebook.com/ or you can redirect them out of Facebook to your own URL if you are going to try and link to your page directly with an app embedded as a tab.
i.e. point link to http://yoursite.com/redirector
is mobile goes to http://yoursite.com/myapp or http://apps.facebook.com/
non mobile goes to http://facebook.com//app_
Some things to note:
You won't get any page specific data back from facebook on your page (i.e. Liked or Not Liked).
Based on #1 you won't be able to restrict the non-liking app users from a page.
After trying everything under the sun to get Facebook to redirect to a mobile web URL, here is what I needed to do in order to get the redirection working:
Make sure the Facebook application is a canvas application. This gives you the ability to give the application a namespace.
Give your application a namespace so that you can access it through https://apps.facebook.com/NAMESPACE. From here, Facebook will do the detection for you, and if needed, redirect your users to your specified mobile URL.
Make sure your app is NOT in sandbox mode.
If your app is in Sandbox Mode, Facebook won't redirect you to the mobile version you have specified in your app settings.
Facebook does the redirecting for you, you don't have to. Although their version of what "mobile" is and what you deem "mobile" might be different.
We have a post on a FB wall. It points to http://tinyurl.com/{something}.
When the link is clicked in a non-mobile web browser, it works fine: TinyURL redirects the user to our web site using the appropriate URI including a special querystring.
When the link is clicked in a mobile web browser on my Android, it fails with the error in the title of this question.
When the link is clicked in the FB native app for iPad and in Safari on the iPad, it works fine.
I have tried adding our URL to the Mobile Web setting in the Basic Settings tab of the FB App configuration. That results in all links pointing directly to the root of our web site with a funky set of parameters in a querystring -- in other words, it doesn't follow the TinyURL in that particular case. The funky parameters include "refid", "ref", and "ft".
So primarily my question is: Why, when I specify the URL in the Mobile Web setting as described in the previous paragraph, does it redirect to our main URL instead of the TinyURL link originally called for?
I think this is something Facebook broke very recently (perhaps even today?). When a user clicks on any links to our app from inside the Facebook native iOS app, they get this error "Either this application has not configured its Mobile Web URL or the URL could not be verified as owned by the application. Unable to redirect." We had never set a Mobile Web URL previously, and everything had been fine since we launched the app over a year ago. We sent all mobile clicks to the same URL's as desktop browsers and handled the mobile rendering server-side. We have not changed our application domain inside the App Settings or anything like that.
In the App Settings, can set a Mobile Web URL to our homepage and the link works (and the error message goes away) but that's not the desired behavior at all - it would mean that all links end up at the same Mobile Web URL regardless of what the link was!
Was this change made on purpose by Facebook and if so why? There's been no mention of this whatsoever on the Developer Blog.
Update 3/21 8:10am PST:
I've since found this to be a widespread problem, not just for a few apps. Just by clicking around I've seen this error on posts to weather.com, youtube, msn.com and a dozen others. It happens on both clicks from the Timeline as well as the News Feed (although strangely sometimes the same post works on one, but not the other!), and from the m.facebook.com mobile web app as well as the native iOS app.
I commented on http://developers.facebook.com/bugs/302635863137683 but no word from Facebook yet. I can't believe more people aren't talking about this right now, this is a major bug.
In your app, go to Settings -> Add platform -> Website
Add both, Website URL and Moblie Website (Yes, you need these both), then your app will be able to be opened from facebook native app.
You will also need the FB Canvas.
Same here, I recently noted that all links of items shared with our Adroid or iPhone app are broken. This only happens with the mobile version of Facebook the Desktop web version is still working. What is actually wrong on the mobile version is that the original shared url is replaced with a m.facebook url that ends with "?ref=unknown&refid=0&ft=fbid.332036910178718%3Ainterface.m_touch%3Ac.m" When user click on it Facebook is redirecting the user to the App's "Mobile Web URL" + "?ref=unknown&refid=0&ft=fbid.332036910178718%3Ainterface.m_touch%3Ac.m" instead of the original shared url.
My opinion is that this is an issue of Facebook that is redirecting the url to the wrong location, "Mobile Web URL" instead of the original post url.
Ok not working. What is going on, 1st directed to something about itunes url. I am on an Android not an Iphone. Sad state when an disabled person is unable to gain access the same as others. This is bad for all users.