We are developing an app which uses Native File Transfer plugin. But due to a weird issue we can not create the Test Flight / Release Build for iOS.
Issue:
Even after successful installation of the 'File Transfer' plugin we see the following error while running the app with
ionic cordova run ios -lc
console.warn: Native: tried accessing the FileTransfer plugin but it's not installed.
As we tap a button that invokes the fileTransfer.download(..) method - the app halts to perform without throwing any Error.
I have created a detailed post with logs and code at:
https://github.com/ionic-team/ionic-native/issues/2110
Any help ??
After a thorough brainstorming I found the answer -
My issue was that the FileTransfer object could be accessed from inside the platform ready function but not inside a provider - this too on iOS [ Android version is working correctly ]
Here is what I did:
As I need an instance of the FileTransfer inside the provider - I created a variable - and an updater method -
private fileTransfer: any;
public setFileTransferRef( param ){
this.fileTransfer = param;
}
And as I could access the FileTransfer inside the platform.ready() - I instantiated the FileTransferObject right there and updated the provider as follows -
initializeApp() {
this.platform.ready().then(() => {
console.log('fileTransfer: ');
console.log(JSON.stringify(this.fileTransfer));
//
let fileTransfer: FileTransferObject = this.fileTransfer.create();
//
this.mediaIOSProv.setFileTransferRef(fileTransfer);
.....
....
Where mediaIOSProv is the Provider responsible to download the zip.
I also placed with the cordova.js inclusion after build/vendor.js in the index.html - ( I came across some posts where developers reported that doing so solved their missing plugin issue ) - Though there is no such official documentation.
<body>
<!-- Ionic's root component and where the app will load -->
<ion-app></ion-app>
<!-- The polyfills js is generated during the build process -->
<script src="build/polyfills.js"></script>
<!-- The vendor js is generated during the build process
It contains all of the dependencies in node_modules -->
<script src="build/vendor.js"></script>
<!-- cordova.js required for cordova apps -->
<script src="cordova.js"></script>
<!-- The main bundle js is generated during the build process -->
<script src="build/main.js"></script>
</body>
Since the app successfully ran on iOS - I did not dare to change the
placement of cordova.js
What I presume is -
1: It would be best to create a Provider to store references of each Native Plugin instantiated within the platform ready - and use the references as and when needed
2: There might be some information missing, specially regarding iOS, about the Ionic-Native Wrapper
Any suggestion / discussion will be highly appreciated.
Use this:
Run ionic cordova platform add [platform] then ionic cordova build [platform] and run in your device.
It worked for me!
Remove the platform
ionic cordova platform rm android
And then add the Platform again
ionic cordova platform add android
Related
I am new to ionic cross-platform while running the ionic cross platform app for generating build I am facing following error.
DiskCookieStorage changing policy from 2 to 0, cookie file:
file:///private/var/mobile/Containers/Data/Application/C234C014-5541-45C9-96A9-4D7B3E0AA4FA/Library/Cookies/Cookies.binarycookies
2016-10-15 14:55:26.568 HelloWorld[363:42830] Unbalanced calls to
begin/end appearance transitions for .
2016-10-15 14:55:26.591 HelloWorld[363:42906] [FATAL] [WL_INIT]
-[WLImpl initWL] in WLImpl.m:174 :: Init failure: Can't read checksum.js, The file name is invalid., (null). Reinstall the
application and try again.
I used MFP SDK(plugin)
So guys kindly give some suggestion for taking build
Its is just a helloworld program with MPF SDK.
Downloaded the sample project generated by ionic here with some bugs. bugs fixed code here.
Since the links you've provided are of no use (the links lack permission to download.....), I suggest that you will follow these blog posts:
Integrating MobileFirst Foundation 8.0 in Ionic-based apps
Best Practices for building AngularJS apps with MobileFirst Foundation 8.0
Here is the basic premise:
Install the following CLIs
npm install -g mfpdev-cli
npm install -g cordova ionic
npm install -g cordova
Create a New Ionic Project
ionic start myApp blank
Ionic automatically adds the Cordova iOS v3.8 plug-in, however MobileFirst Foundation v8.0 support Cordova iOS v4.0 and above. To overcome this, remove the iOS platform and re-add it. Change directory into your Ionic project and run:
ionic platform remove ios
ionic platform add ios#latest
If you want to add the android platform, you can add it with:
ionic platform add android#latest
Add the MobileFirst Cordova SDK
cordova plugin add cordova-plugin-mfp
You can confirm the installed plug-ins by entering ionic plugin list
Update Ionic Code
Open the js/app.js file.
The module is named starter.
angular.module('starter', ['ionic'])
The ng-app directive in the index.html file tells angular which code to run on the page.
To link the view and the model of the app together, create a controller in the app.js file.
.controller("mainCtrl", function($scope){
})
The $scope service allows you to share variables and functions from the controller to the view.
Go back to index.html.
Add ng-controller to the body tag and include the mainCtrl name. This allows you to use the controller anywhere inside the body tag.
ng-controller="mainCtrl"
Register App on MobileFirst Server
To enable the MobileFirst capabilities such as using the Mobile Browser Simulator to preview the application we need to add some JavaScript code to connect to the MobileFirst Server.
Open app.js and enter the following at the bottom:
function wlCommonInit() {
console.log(">> wlCommonInit() ..." );
var serverUrl = WL.App.getServerUrl(function(success){
console.log(success);
}, function(fail){
console.log(fail);
});
WLAuthorizationManager.obtainAccessToken().then(
function (accessToken) {
console.log(">> Success - Connected to MobileFirst Server");
},
function (error) {
console.log(">> Failed to connect to MobileFirst Server");
console.log(error);
}
);
};
Register your app with your MobileFirst Server.
mfpdev app register
I am trying to use the cordova GooglePlus plugin in a new ionic 2 project (latest ionic2 version) but I always run into errors regarding cordova.
The plugin is properly installed and shows up in the plugin folder.
One approach I tried is this:
import { GooglePlus } from "ionic-native";
and then
GooglePlus.login().then(...)
The login method executes but always throws an error saying "cordova_not_available"
I want to test the app with ionic serve on my windows system first before deploying it to my android phone.
How can I make cordova available in the localhost server? From searching I understand that cordova.js is generated and always included in the deploy package for the device.
Another approach I tried is using
window.plugins.googleplus.login(...)
But this approach does not go through the typescript compiler who does not know anything about a plugins property on the windows object.
How can I fix this?
If you want the plugin to work for the browser you should add platform browser and run it:
ionic cordova platform add browser
and run it:
ionic cordova run browser
instead of ionic serve.
This error usually occurs when you're running the app in chrome using ionic serve which is normal as in the browser cordova native components are not there but also occur on emulator and devices when an ionic native plugin that you're using was nod added, even if you have added the ionic plugin for it.
For instance if you are using native Toast
then you need to add proper ionic dependencies:
ionic plugin add cordova-plugin-x-toast --save
but you also need to add cordova dependencies:
cordova plugin add cordova-plugin-x-toast --save
If you forget to add the later cordova plugin you'll get an error like:
Runtime Error Uncaught(in promise): cordova_not_available
Which can be tricky to find the cause.
Once you have added ionic and cordova dependencies you should be able to use it.
Make sure you import it:
import { Toast } from 'ionic-native';
inject Platform in constructor:
constructor(public navCtrl: NavController, private platform: Platform) {...
then use the native item:
this.platform.ready().then(() =>
Toast.show("Successfull", '5000', 'center')
.subscribe(
toast => {
console.log(toast);
}
));
Using ionic serve disables all the cordova plugins, because it is not running on a device.
Rather use ionic cordova run android
This will start an android emulator that should allow all the cordova plugins to function
I have also come across the second approach, but the syntax then has to be windows['plugins'].googleplus.login(...)
Sometimes using ionic cordova run browser is not the best option, since it takes a long time for it to compile your changes.
In my case, what was causing the issue was the FCM plugin. It cannot run on the browser, if I use ionic serve. Since my code was inside app.component.ts, it was easy for me to get around the problem. I simply used the following line:
if (platform.is('cordova'))
{ this.fcmx.onTokenRefresh().subscribe(token => {
this.pushNoti.storeNewToken(token); }); }
Using platform.is('cordova'), you can prevent the code causing trouble to run on the browser.
Simply Run after attaching android device
ionic cordova run android
make sure you correct google map key
I'm trying to get the Phonegap Facebook plugin to work, but no errors occur and the plugin's login() function just doesn't do anything (it's being called, but doesn't do anything).
Whenever I try to install the plugin in the Cordova CLI, I get a Plugin already installed notice. I've added the plugin files manually, by adding FacebookConnectPlugin.h and FacebookConnectPlugin.m in the plugins folder. I've added the FacebookSDK.framework to the frameworks folder. However, when I open my app and tap on the login button (which correctly calls the function), nothing happens. The activity console in Xcode doesn't show any errors and no action is performed.
My JS code looks like this:
var login = function () {
if (!window.cordova) {
var appId = prompt("<MyAppId>", "");
facebookConnectPlugin.browserInit(appId);
}
facebookConnectPlugin.login( ["email"],
function (response) { alert(JSON.stringify(response)) },
function (response) { alert(JSON.stringify(response)) });
}
$('.login-btn').click(function() {
login();
});
What step am I missing to make this work? The plugin can be found here.
Also, when I start the app the activity console shows the following info:
2015-10-20 19:58:38.586 MyApp[5143:2355309] Apache Cordova native platform version 3.8.0 is starting.
2015-10-20 19:58:38.590 MyApp[5143:2355309] Multi-tasking -> Device: YES, App: YES
2015-10-20 19:58:38.595 MyApp[5143:2355309] Unlimited access to network resources
2015-10-20 19:58:39.033 MyApp[5143:2355309] Resetting plugins due to page load.
2015-10-20 19:58:39.711 MyApp[5143:2355309] Finished load of: file:///var/mobile/Containers/Bundle/Application/365E079A-56F7-4874-9914-182A57D6DFED/Qwest.app/www/index.html
Adding plugins manually in cordova usually leads to bad things, especially in the future if you ever want to update. For now I would try removing and adding the plugin:
cordova plugin rm phonegap-facebook-plugin
cordova plugin -d add -d plugin add /path/to/cloned/phonegap-facebook-plugin --variable APP_ID="123456789" --variable APP_NAME="myApplication"
(You did follow the instructions at https://github.com/Wizcorp/phonegap-facebook-plugin/blob/master/platforms/ios/README.md on how to install the plugin and cloned it to a different directory) See if that works, if not go with the more nuclear option of adding and removing the platform.
cordova platform rm ios
cordova platform add ios
This is sometimes required, but should only be performed if you have made no changes to the XCode project.
Also the plugin has been forked and https://github.com/jeduan/cordova-plugin-facebook4 which uses the Facebook4 SDK rather than Facebook3 SDK, as well it requires less fiddling to get the IOS plugin to work. It is api compatible so it should just work.
I am just trying to use the notifications plugin to start, I will need others later but having a problem getting it to work. When I try to use
navigator.notification.alert('test', myCallbackFn);
It says navigator.notification is undefined. my config file added this line when I added the plugin via CLI.
<plugin name="org.apache.cordova.dialogs" spec="~0.3.0" />
I am using this in the deviceReady function, where it looks like cordova.js is loaded without any problems.
Here is my whole snippet:
<script type="text/javascript">
document.addEventListener('deviceready', function onDeviceReady() {
angular.bootstrap(document, ['app']);
try{
//alert(navigator.notification);
navigator.notification.alert("test", function(){});
}catch(error){
alert(error);
};
}, false);
</script>
Also I did make sure to run this each time
$ cordova build ios
I don't use phonegap, I use cordova. The reason is, that phonegap uses older versions of cordova and you have less plugins in phonegap. The dialog plugin, which you are using, is v0.3 the current official version from Apache is v1.1.1.
To check, that the notification plugin is running, just use in your deviceready function:
console.log(navigator.notification);
Attention: Before you can use the console, you have to install the console plugin, found here: https://github.com/apache/cordova-plugin-dialogs
Do it with:
cordova plugin add cordova-plugin-console
But I suggest to restart the project and use cordova instead of phonegap, if you have an Apple machine.
Start from here and always use the edge version (select it in the top right corner):
http://cordova.apache.org/docs/en/edge/guide_cli_index.md.html#The%20Command-Line%20Interface
I have a cordova ios project that I created a while ago with cordova 2.8.x and now I have updated cordova to 3.3.1
The problem is that when I execute cordova build, no cordova.js file gets created. I've played around with cordova 3.3.1 and it seems that the cordova.js file is created when the platform is added.
I've already have added the platform from before, how can I create the cordova.js file for ios without readding the ios platform?
If you create your project with phonegap create myApp it creates it with phonegap.js instead of cordova.js
You can try cordova platform add <your platform> e.g. cordova platform add ios should add cordova.js to your project.
Also, make sure your index.html <script> is referencing the correct file after doing the above.
just take care of building your project because if you build your project using:
phonegap local build ios
phoengap.js file will be generated but if you build it using:
cordova build ios
cordova.js file will be generated