I'm running example code (found below) through phonegap build to produce an android apk.
https://github.com/phonegap-build/FacebookConnect/blob/master/example/Simple/index.html
When I try to log into facebook through the app on an android device (with the facebook app installed), I get this error:
Invalid android_key parameter J4INwYsuTyQ_LJc1d3WZ2HReg7M does not match any allowed android key. Configure your app key hashes at http://developers.facebook.com/apps/'app id'
I have copy-pasted this key into the key hashes section of my app's android settings but it still throws the same error when I try to log in using the app.
How can I get this app to log into facebook successfully?
OR: What is another way to enable an android app to log into facebook using phonegap?
Here are some things I have done:
In my facebook app's settings:
Set 'Package name' to the 'widget id' found in my phonegap config.xml.
Set 'Class name' to the Package name with '.ProjectActivity' appended to it.
Enabled 'Single Sign on' and disabled 'Deep linking'.
Made the app open to the public (through the 'Status & Review' section.
In my phonegap config.xml (found in the /www directory in phonegap project):
Entered APP_ID as the ID found in my facebook app dashboard
Entered APP_NAME as the 'Namespace' found in my facebook app settings
In my phonegap build app settings:
Made a keystore (using this answer: https://stackoverflow.com/a/19315975/1696114) and used it to generate a release apk.
I think you should use facebook phonegap plugin as your authentication.
Download and install into your cordova project.
https://github.com/phonegap/phonegap-facebook-plugin
Use this command to install it.
cordova plugin add https://github.com/phonegap/phonegap-facebook-plugin.git --variable APP_ID="xxxxxxxxxxxxx" --variable APP_NAME=“xxxxxxxx”
Then setup your facebook app here:
http://developers.facebook.com/apps/
Then make sure you have this script in your project.
cdv-plugin-fb-connect.js
facebook-js-sdk.js
After that, paste this code into your main script
if ((typeof cordova == 'undefined') && (typeof Cordova == 'undefined')) alert('Cordova variable does not exist. Check that you have included cordova.js correctly');
if (typeof CDV == 'undefined') alert('CDV variable does not exist. Check that you have included cdv-plugin-fb-connect.js correctly');
if (typeof FB == 'undefined') alert('FB variable does not exist. Check that you have included the Facebook JS SDK file.');
FB.Event.subscribe('auth.login', function(response) {
//alert('auth.login event');
});
FB.Event.subscribe('auth.logout', function(response) {
//alert('auth.logout event');
});
FB.Event.subscribe('auth.sessionChange', function(response) {
//alert('auth.sessionChange event');
});
FB.Event.subscribe('auth.statusChange', function(response) {
//alert('auth.statusChange event');
});
function getSession() {
alert("session: " + JSON.stringify(FB.getSession()));
}
function getLoginStatus() {
FB.getLoginStatus(function(response) {
if (response.status == 'connected') {
alert('logged in');
} else {
alert('not logged in');
}
});
}
var friendIDs = [];
var fdata;
function logout() {
FB.logout(function(response) {
alert('logged out');
window.location.replace("#login");
});
}
function login() {
FB.login(
function(response) {
if (response.authResponse) {
alert('logged in');
FB.api('/me', function(me) {
if (me.id) {
localStorage.id = me.id;
localStorage.email = me.email;
localStorage.name = me.name;
window.location.replace("#home");
}
else {
alert('No Internet Connection. Click OK to exit app');
navigator.app.exitApp();
}
});
} else {
alert('not logged in');
}
}, {
scope: "email"
});
}
document.addEventListener('deviceready', function() {
try {
//alert('Device is ready! Make sure you set your app_id below this alert.');
FB.init({
appId: "appid",
nativeInterface: CDV.FB,
useCachedDialogs: false
});
document.getElementById('data').innerHTML = "";
} catch (e) {
alert(e);
}
}, false);
use login() to login . Enjoy!!
I successfully made an app which can log into facebook by using the phonegap-facebook-plugin and by building my cordova/phonegap project locally.
I made a new cordova project and added the android platform for this project, following the instructions here: http://docs.phonegap.com/en/3.4.0/guide_overview_index.md.html#Overview
In doing this I discovered I had made my previous project using an older cordova version (3.1) un-intentionally and that I hadn't installed the cordova command line interface. There may have been other issues with the way I made my first project.
I then added the phonegap-facebook-plugin found here: https://github.com/phonegap/phonegap-facebook-plugin using this command (from my project location):
cordova plugin add https://github.com/phonegap/phonegap-facebook-plugin.git --variable APP_ID="xxxxxxxxxxxxx" --variable APP_NAME=“xxxxxxxx”
(replacing APP_ID value with my facebook app id and APP_NAME value with my app's namespace).
I then replaced my index.html with the example index file found at the phonegap-facebook-plugin github page + /blob/master/example/Simple/index.html (replacing the app_id value with my app id).
I then ran the app straight to my android device using:
cordova run android
In this app, I'm able to use the interface provided by the example to login, post to my own or friends' walls etc. Using this new project (with updated cordova version) I may be able to use phonegap build but I haven't tried yet.
Thanks to Dato' Mohammad Nurdin for the suggestion to use this plugin.
Related
I am working on Ionic 4 app and I am using deeplink to open app when clicked on a external link.
I am using plugin:
cordova plugin add ionic-plugin-deeplinks --variable URL_SCHEME=deeplinktest --variable DEEPLINK_SCHEME=https --variable DEEPLINK_HOST=example.com --variable ANDROID_PATH_PREFIX=/
npm install #ionic-native/deeplinks
and code for opening app is:
openAppFromLink() {
this.deeplinks.routeWithNavController(this.navCtrl, {
'/pageName/:id': {}
}).subscribe(match => {
if (localStorage.getItem('loggedInUser')) {
let navigationExtras: NavigationExtras = {
state: {
id: match.$args.id,
isDeeplink: true
}
};
console.log('Successfully matched route' + JSON.stringify(match));
this.router.navigateByUrl(this.router.routerState.snapshot.url + '/pageName', navigationExtras);
} else {
console.log('opening in system browser');
window.open('https://example.com', '_system');
}
}, nomatch => {
console.error('Got a deeplink that didn\'t match' + JSON.stringify(nomatch));
});
}
I want to open a website or a playstore if user don't have app install on his device.
<h1><a href='deeplinktest://example.com/page/?id=3491'>Open App <a></h1>
on click of above link I am able to open app but when I don't have app installed nothing happens on android device. Can this managed with the same link I mentioned?
in this block you have to handle the error:
nomatch => {
console.error('Got a deeplink that didn\'t match' + JSON.stringify(nomatch));
});
there is a plugin named In App Browser that opens links in in-app-browser.
install it and put your code in nomatch block:
nomatch => {
// open the link here using In App Browser
});
I created a simple app with possibility to select photo from mobile phone using #ionic-native/photo-library. Now I want to debug it, print some console logs and check if photo is loaded properly:
private selectPhoto() {
this.photoLibrary.requestAuthorization().then(() => {
this.photoLibrary.getLibrary().subscribe({
next: library => {
library.forEach((libraryItem) => {
console.log(libraryItem) // i want to print it
})
},
error: err => {},
complete: () => { console.log('could not get photos'); }
})
})
.catch(err => console.log(err));
}
Unfortunatelly, I receive an error:
Native: tried calling PhotoLibrary.requestAuthorization, but Cordova is not available. Make sure to include cordova.js or run in a device/simulator
I read that native plugins must be tested on device but how to get output from code in my console? When I install apk I do not have any debug information.
Regards
The error means that the plugin won't properly work unless cordova.js is already loaded. This happens because cordova.js is the one responsible for loading your plugins, so if you are calling any of it before cordova is ready it just won't work.
You should use either:
document.addEventListener('deviceready', DeviceReady, false);
function DeviceReady() {
//your plugin code here...
}
or
$ionicPlatform.ready(function() {
//your plugin code here...
});
To properly debug an Android/iOS build with the help of a browser console (chrome/safari) make sure that you're building a debug apk/ipa with the option --debug at the CLI:
$ionic build android/ios --debug
I hope this may help you out =)
I am new to mobile app development and ionic 2. I get the google authentication working fine for a web app using angularfire2 but that doesn't work on a mobile device (yet?).
I am using ionic 2 version 2.0.0-beta.35 and firebase 3.2.1
Searching led me to the understanding that for the time being I need to use the google+ plugin for cordova, which I have installed.
I am trying this method in my ts code:
loginWithGooglePlugin()
{
return Observable.create(observer =>
{
// note for iOS the googleplus plugin requires ENABLE_BITCODE to be turned off in the Xcode
window.plugins.googleplus.login(
{
'scopes': 'profile email', // optional, space-separated list of scopes, If not included or empty, defaults to `profile` and `email`.
'webClientId': '_google_client_app_id_.apps.googleusercontent.com',
'offline': true, // optional, but requires the webClientId - if set to true the plugin will also return a serverAuthCode, which can be used to grant offline access to a non-Google server
},
function (authData)
{
console.log('got google auth data:', JSON.stringify(authData, null, 2));
let provider = firebase.auth.GoogleAuthProvider.credential(authData.idToken, authData.accessToken);
firebase.auth().signInWithCredential(provider).then((success) =>
{
console.log('success!', JSON.stringify(success, null, 2));
observer.next(success);
}, (error) =>
{
console.log('error', JSON.stringify(error, null, 2))
});
},
function (msg)
{
this.error = msg;
}
);
});
}
But the compiler keeps complaining about two things:
1. window.plugins is unknown. How can I convince ts that it's there?
There is no credential on the GoogleAuthProvider object. Searching yielded this link: firebase docs which says there was a method getCredential, which is not recognized either.
My typings seem to be fine. GoogleAuthProvider itself is recognized.
How can I fix this?
Actually, this is a bug in the typescript definitions. The Firebase team has been notified and is working on a fix. In the meantime use the following workaround:
(<any> firebase.auth.GoogleAuthProvider).credential
In my Ionic2 RC1 + Firebase3.5 + AngularFire2.beta5 project I had the same problem... Google Auth with Popup worked in Browser but not in my Android .APK
Firstly, I add 192.168.1.172 to my Firebase Console authorized domain list and <allow-navigation href="http://192.168.1.172:8100"/> to my config.xml.
After this, I found that installing Cordova InAppBrowser plugin solves my problem definitively.
I didn't need to modify my code, only plug and play, exactly like David East says in his Social login with Ionic blog.
I'm trying to use ionic.io to send push notification. Here is what I did :
Create an app in GCM and enable GCM API.
Create credentials and get the api key.
Create an app in ionic.io dashboard
Create a security profile and add the api key
Create an api token in ionic.io dashboard
My source code in app.js which generated by ionic start pushdemo
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
var push = new Ionic.Push({
"debug": true
});
push.register(function(token) {
alert(token.token);
console.log("Device token:",token.token);
push.saveToken(token);
});
7.Add push plugin:
ionic plugin add phonegap-plugin-push --variable
SENDER_ID="myproject_number"
I tried both with or without quotation mark around myproject_number. It's the project number in step 1.
8.Set the dev_push to false
9.Hook my app to ionic.io by ionic io init
10.Run ionic run android -lc
Found the following error message:
What's wrong with it? Can anybody help? Thanks.
i had the same problem its generally because of proxy issue
you are behind the proxy it means you are using internet by making request to the server ,so first you should use your own internet (in this case if you use WIFI
then also it will work )
second aafter creating your project dirsctly make login from your cinsole to ionic io
it will ake for email and password that will make your app live
third
ionic plugin add phonegap-plugin-push --variable SENDER_ID="myproject_number"
use quotes for entering your project number.project number also called GCM number and your server key is the key you generated in same project means google console which enable you to use google services.
and dont forget to add android platform
ionic start pushCall
ionic login
ionic upload
//open google console
1-create project
2-use google api
1-mobile APIs
2-select google cloud messaging and eneble it
3- go to credential and create API key
//after that add following plugin
ionic add ionic-platform-web-client
ionic plugin add phonegap-plugin-push --variable SENDER_ID="991785317333"
(dont remove quotes while adding gcm number)
//add platfom
ionic platform add android
ionic io init
ionic config set dev_push true
//open ionic io
go to setting
1-create api key
2-go to certificate and create security profile name edit id click on android and add GCM key
and save it.
//add this code to app.js
angular.module('starter', ['ionic'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
var push = new Ionic.Push({
"debug": true
});
push.register(function(token) {
console.log("My Device token:",token.token);
push.saveToken(token); // persist the token in the Ionic Platform
});
});
})
//to test wether your configure correctly with ionic io open launch postman
//and then do the following things:
1-create collection give it a valid name
2-in body click on text and select Application/json
it will add header automatically
3-add another header
key as Authorization
value as bearer followed by your api token from ionic io
4-select "raw " as the format of our json
2-in body section of your collection write
following code
{
"tokens": ["DEV_DEVICE_TOKEN"],
"profile": "PROFILE_NAME",
"notification":
{
"message": "This is my demo push!"
}
}
//now it will prompt message on browser
ionic config set gcm_key
ionic config set dev_push false
ionic build android
install your app in mobile and send the notification from postman
(Mahesh Sampat Nighut)
navi mumbai
add this code in your app.js
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
var push = new Ionic.Push({
"debug": true
});
push.register(function(token) {
console.log("My Device token:",token.token);
push.saveToken(token); // persist the token in the Ionic Platform
});
});
})
and dont forget to run below command
ionic config set dev_push true
when you are testing it on browser make above cammand true,this means developmant mode ,and when you are making apk this time you have to make above command false
I have a Meteor(v1.0.3.1) app and installed AdMob Cordova plugin like this:
meteor add cordova:com.google.cordova.admob#https://github.com/floatinghotpot/cordova-admob-pro/tarball/94a31660d1bb35337e3430e2608b7710ea4d882a
with the following code as the doc suggests:
if(Meteor.isCordova){
admobid = {
banner: 'ca-app-pub-xxxxxxxxxxxxxxxxxxx'
};
if(AdMob){
AdMob.createBanner( {
adId: admobid.banner,
position: AdMob.AD_POSITION.BOTTOM_CENTER,
autoShow: true
});
}
}
And started the app with meteor run android-device with my Android phone plugged in.
The following error appears in the stack trace:
Uncaught ReferenceError: AdMob is not defined
I looked for AdMob object on window and other places but couldn't find it.
I can confirm that the plugin you are using is working. But you should probably not use the tarball. Use the current version (2.7.4) instead.
Try this. This worked for me using the iOS simulator.
Remove the plugin you installed with meteor remove
Install with version number
meteor add cordova:com.google.cordova.admob#2.7.4
Run the simluator (use the Android one, if you do not have Xcode )
meteor run ios
Then the AdMob variable should be available. At least it was when I tried it.
Update
The plugin also works with Android.
`meteor run android`
Also, make sure that your code is in Meteor.startup(), to ensure that the Cordova plugin is available.
Meteor.startup(function () {
if (Meteor.isCordova) {
if (AdMob) {
AdMob.createBanner( {
adId: 'ca-app-pub-3080070244198226/2109901818',
position: AdMob.AD_POSITION.BOTTOM_CENTER,
isTesting: true,
autoShow: true,
success: function() {
console.log("Received ad");
},
error: function() {
console.log("No ad received");
}
});
} else {
console.log("No Admob");
}
} else {
console.log("No Cordova ");
}
}
I would suggest you to try with this other plugin:
meteor add cordova:com.admob.google#https://github.com/appfeel/admob-google-cordova/tarball/f3851132148aae4c600563d4124cc875c8c5f73e
Then in your code:
if(Meteor.isCordova){
if(admob){
admob.createBannerView({publisherId: "ca-app-pub-xxxxxxxxxxxxxxxxxxx"});
}
}
Meteor had a security upgrade v1.0.4. You need to add the regex for the website to your mobile config file to get the google sdk. Otherwise if you dont you will see the whitelist error in x-code's logs.
I used this to get the sdk.
App.accessRule('*://googleads.g.doubleclick.net');
reference from meteor telling you about the upgrade.
https://www.meteor.com/blog/2015/03/17/meteor-104-mongo-cordova-template-subscriptions