I'm working on an Ionic 2 app which requires logging in using external link. For security reason I would prefer to open the link in system browser. After I open the link and login with username & password, a token will be returned in the body of the html. Is there a way to pass that token to my app? Or are there any other solutions to tackle this problem? Thank you.
This is extremely conceptual, but you could use the cordova plugin inappbrowser to open a browser inside the app, listen to the exit event to wait for the user to close the in-app browser, and there inject a script to retrieve the token from the html, something like:
inAppBrowserRef = undefined;
showLogin(url) {
var target = "_blank";
var options = "location=yes,hidden=yes";
this.inAppBrowserRef = cordova.InAppBrowser.open(url, target, options);
with (this.inAppBrowserRef) {
addEventListener('exit', this.exitCallBack);
}
}
exitCallBack(params) {
captureToken = "return token = [[jquery to retrieve the token]]";
this.inAppBrowserRef.executeScript({ code: captureToken}, this.executeScriptCallBack);
this.inAppBrowserRef.close();
this.inAppBrowserRef = undefined;
}
executeScriptCallBack(token) {
this.token=token;
}
Related
I'd like for users to be able to share a link (e.g. app.com/SKFLA - this is primarily because deep links on their own aren't clickable) via Facebook etc. When clicked, this redirects to a deep link app://SKFLA. If the app is installed, this opens the app - this is all working fine so far. But if the app isn't installed, I'd like to open the app store on the relevant page. Is this achievable? Thanks!
You need UNIVERSAL LINKS
Please check
IOS https://developer.apple.com/library/archive/documentation/General/Conceptual/AppSearch/UniversalLinks.html
Android
https://developer.android.com/training/app-links/
It might also require some extra server-side setup.
Not sure about native behavior.
We used third-party service like https://branch.io/deepviews/.
There is a bunch of similar services.
If someone is still stuck in this issue and needs easiest solution, you will love node-deeplink
1.) If app is installed: Calling an app through deep linking will always call componentDidMount of root component. So you can attach a listener there. Like:
Linking.getInitialURL()
.then(url => {
if (url) {
this.handleOpenURL({ url });
}
})
.catch(console.error);
Linking.addEventListener('url', this.handleOpenURL);
handleOpenURL(event) {
if (event) {
console.log('event = ', event);
const url = event.url;
const route = url.replace(/.*?:\/\//g, '');
console.log('route = ', route);
if(route.match(/\/([^\/]+)\/?$/)) {
const id = route.match(/\/([^\/]+)\/?$/)[1];
const routeName = route.split('/')[0];
if (routeName === 'privatealbum') {
Actions.privateAlbum({ albumId: id });
}
}
}
}
2.) If app is not installed: Just set up a route in your server and node-deeplink package will handle the bridging between web browser to app store when a app is not installed in your mobile.
By this, both the cases will be handled without any struggle
I'm trying to authenticate an end-user in an android app written in C# (Xamarin.Android).
I decided to try and use NuGet package Google.Apis.Oauth.v2 which seems to expose an easy to use Oauth client.
LocalServerCodeReceiver.ReceiveCodeAsync throws the following:
I get System.NotSupportedException:"Failed to launch browser with https://XXX.auth.XXX.amazoncognito.com/login?response_type=token&client_id=XXX&redirect_uri=https%3A%2F%2Fwww.google.com&scope=profile%20openid%20email for authorization. See inner exception for details."
and it has an inner exception of System.ComponentModel.Win32Exception:"Cannot find the specified file"
Code:
var clientSecret = new Google.Apis.Auth.OAuth2.ClientSecrets();
clientSecret.ClientId = ...
clientSecret.ClientSecret = ...
var initializer = new Google.Apis.Auth.OAuth2.Flows.AuthorizationCodeFlow.Initializer(
"https://XXX.auth.XXX.amazoncognito.com/login",
"https://XXX.auth.XXX.amazoncognito.com/login");
initializer.Scopes = new List<string> {"profile", "openid", "email"};
initializer.ClientSecrets = clientSecret;
var flow = new Google.Apis.Auth.OAuth2.Flows.AuthorizationCodeFlow(initializer);
var authCodeRequestURL = flow.CreateAuthorizationCodeRequest("https://www.google.com");
authCodeRequestURL.ResponseType = "token";
var uri = authCodeRequestURL.Build();
var cancellationTokenSource = new System.Threading.CancellationTokenSource();
var codeReceiver = new Google.Apis.Auth.OAuth2.LocalServerCodeReceiver();
var task = codeReceiver.ReceiveCodeAsync(authCodeRequestURL, cancellationTokenSource.Token);
Do I need to ask for a specific permission in the application manifest?
Instead of redirecting to www.google.com, I've heard you can redirect to an app, I'm not really sure how to do that, is it http://my_app_package_name or http://my_app_title, something else?
Is it possible not to rely on that library for launching the browser and instead get the RequestUri and start an Activity, if so how will the app become aware the end-user completed the SignIn process and how will the app retrieve the token?
Sorry, but Google.Apis.Oauth.v2 does not support Xamarin, and there's no simple way to get it working.
Unfortunately no Google.Apis.* packages currently support Xamarin.
You might find the Xamarin.Auth package does what you want?
I've figured out how to redirect to an app after authentication in the browser completes.
It's called a "Deep Link" and it's documented at enter link description here, essentially you need to declare an IntentFilter on your Activity, which registers with the Android OS that if someone clicks or an page redirects to a specific URI, your app gets called. The token that's appended to the URI can then be read inside your app.
I am trying to implement Facebook app invite with this plugin in my ionic application. The implemented codes are following as below:
$scope.appInviteToFriend = function(user){
var url = "";
if (ionic.Platform.isAndroid())
{
url = "https://play.google.com/store/apps/details?id=com.example.application";
}
else if (ionic.Platform.isIOS())
{
url = "https://itunes.apple.com/nl/app/example-by-ionicapplication/id1983838444?l=en&mt=8";
}
var option = {
url: url,
picture : ""
};
facebookConnectPlugin.appInvite(
option,
function(obj){
if(obj) {
if(obj.completionGesture == "cancel") {
// user canceled, bad guy
} else {
// user really invited someone :)
}
} else {
// user just pressed done, bad guy
}
},
function(obj){
// error
console.log(obj);
}
);
}
When I executed these codes, the Facebook Invite Dialog opens and displayed app information correctly. But after click next button, select friend and also click send button, The error occurs. It says "Missing App Link URL. The app link used with this invite does not contain an Android or iOS URL.Developers are required to enter URl for at least one platform.". I've attached the error details with part of screenshot. Are these wrong the URLs which are store URL? How can I set the URLs?
You need to provide an App Link instead of a web URL. This link can be statically generated using Facebook's own tools, or you can generate them dynamically server-side. You can read more about these in the documentation.
Here's a tutorial that walks through setting up an Android app.
I have three buttons on my website, that link to Facebook, Twitter & vk.com pages. I want to open native app, if it is installed on user device. Otherwise, I want URL fallback to be opened.
First of all, I tried to use native app schemes directly with deep-link.js plugin. But, when I tried to open native app URL scheme, when native app was not installed, Safari has shown an error, but opened URL fallback page finally. Default Android browser said that he does not know how to handle such URL scheme:
<a class="btn btn-primary" href="https://www.facebook.com/warpcompany" data-app-ios="fb://profile/838619192839881" data-app-android="fb://page/838619192839881">Facebook</a>
Then I tried to use App Links "standard", that that has so much promotion from Facebook. I even tried to use their hosted app links, to make sure I've generated everything right way. It does not work, it always redirect to website fallback. You can easily test it by yourself from https://fb.me/746134728830806
Is it possible to provide deep link on website, that will open native app without errors at least in default os browsers, or fallback silently to URL?
It is still possible, but on newer versions of the Android default browser you have to use intents instead of just trying to open the deep link. For example replace your fb://page/838619192839881 with
intent://page/838619192839881#Intent;scheme=fb;package=com.facebook.katana;end
This will fallback to Google play by default, but you can override the fallback adding a S.browser_fallback_url:
intent://page/838619192839881#Intent;scheme=fb;package=com.facebook.katana;S.browser_fallback_url=http%3A%2F%2Fwww.facebook.com%2F;end
The fallback should be url encoded.
Of course you'll have issues if the user is not on an Android phone or with an old version of the default browser (or strange browser). You can setup a bunch of conditions and replace your HTML with the correct code for each case.
The accepted answer will only work on Chrome v28 and default browsers for Android 5.0. If you want this to work on other browser like Facebook/Twitter webviews, Firefox, UC and older default browsers than 5.0, you'll need to use some code that's a little more complicated.
Add this function to your JS snippet:
var openSesame = function() {
var method = 'iframe';
var fallbackFunction = function() {
if (method == 'iframe') {
window.location = "market://details?id=com.facebook.katana";
}
};
var addIFrame = function() {
var iframe = document.createElement("iframe");
iframe.style.border = "none";
iframe.style.width = "1px";
iframe.style.height = "1px";
iframe.src = "fb://page/838619192839881";
document.body.appendChild(iframe);
};
var loadChromeIntent = function() {
method = 'intent';
document.location = "intent://page/838619192839881#Intent;scheme=fb;package=com.facebook.katana;end";
};
if (navigator.userAgent.match(/Chrome/) && !navigator.userAgent.match("Version/")) {
loadChromeIntent();
}
else if (navigator.userAgent.match(/Firefox/)) {
window.location = "fb://page/838619192839881";
}
else {
addIFrame();
}
setTimeout(fallbackFunction, 750);
};
Then your button will look like this:
Open the App
Or you can use a service like branch.io which does exactly what you're looking for automatically.
Yes it is! Have a look to this training:
https://developer.android.com/training/app-indexing/deep-linking.html
Is this the information you needed? lmk
We are trying to implement a simple solution to our website developed via Flex and mobile apps developed using Adobe Air.
1) Our users would like to import their facebook friends onto website via www.ourwebsite.com and also via the Ourwebsite android, ios & blackberry apps.
2) We want to use the Facebook Requests dialog which allows users to select their friends and send multiple invitations at a time
3) When the recepient clicks on the notification he receives
in case of web, it should direct the notification recipient to www.ourwebsite.com
in case of mobile app, it should re-direct to respective appstore to download our app.
We tried several configurations but it's not working for us.
As previously said we have developed our website using Adobe Flex and our Mobiles apps run using Adobe Air. Do we need to install the Facebook native SDK's into our code?
Strangely the exact same requirement is working for www.naaptol.com and 9lessons.info.
But we're unable to achieve the same technique.
Can anyone guide us or advise if we're missing any important aspect of Facebook App & its policies.
Thank you.
Sai Krishna
So if I think I am understanding this right, you want to be able to open a link differently based upon the platform they are on. Here is some js that will do it for ios and android. If they have your app installed it will launch the app, otherwise it will send them to the app store
// if iPod / iPhone, display install app prompt
if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i) || navigator.userAgent.match(/android/i)) {
var store_loc = "itms://itunes.com/apps/youriOSApp";
var href = "yourPrefix://";
var is_android = false;
if (navigator.userAgent.match(/android/i)) {
store_loc = "https://play.google.com/store/apps/details?id=air.com.your.app";
is_android = true;
}
var app_loc = href;
if (is_android) {
var w = null;
try {
w = window.open(app_loc, '_blank');
} catch (e) {
// no exception
}
if (w) {
window.close();
} else {
window.location = store_loc;
}
} else {
var timeout = null;
window.location.replace(app_loc);
timeout = setTimeout(function () {
"use strict";
window.location = store_loc;
}, 300);
onblur = function () {
"use strict";
clearTimeout(timeout);
};
}
}