Blog

Recently, we’ve noticed quite a few comments about appery.io apps not working properly on iOS 13 devices. The underlying reason is that we use Cordova APIs for apps developed for installation on native devices. And, iOS 13 isn’t officially supported by Cordova yet, so it’s possible appery.io apps on iOS 13 devices might have problems.

Rest assured, as soon as Cordova releases a version with iOS 13 support, we will take care of the necessary updating as soon as possible. (Or, if necessary, we will provide our own temporary fix.)

Thank you for your understanding!

Please check for more details in the Appery.io device and browser support policy.

This blog post supplements “OAuth Login with Google App” in the Appery.io documentation.

Since April 20, 2017, all OAuth requests through InAppBrowser are blocked (see http://blog.ionic.io/google-oauth-changes/ for details). Now it’s necessary to use the Google Sign-In Cordova/PhoneGap plug-in.

So, first of all, download the plug-in and add it to the project (more details on this).  When ready, you can proceed with specifying the settings for iOS or Android apps. We’ll describe both ways and then show you how to set up your app at the end.

Google setting for iOS projects

1. On the Google project page, go to the Credentials tab and select Create credentials > OAuth client ID: 
2. In a new window, select iOS.
3. Define the Bundle ID (you can get it from App settings > iOS binary > Bundle ID).
4. Click Create.
5. Now, copy the iOS URL scheme from the created Client ID:
   
6. Add the iOS URL scheme as the REVERSED_CLIENT_ID parameter of the Google Sign-In plug-in and save:
   

Ready!

Google setting for Android projects

1. On the Google project page, go to Credentials and select Create credentials > OAuth client ID: 
2. In a new window, select Android.
3. You will need the SHA-1 fingerprint of the certificate that you are using for signing up your app to link the client ID to the app. To get it, export your certificate (Resources > Certificates) and run the following command in the console:

   keytool -exportcert -keystore path-to-debug-or-production-keystore -list -v

   keytool is a key and certificate management utility.

   It is included in the jdk, you can install either jdk or download the keytool utility.

4. The obtained SHA1 code should be added to the Signing certificate fingerprint.
5. Insert the Package name (App settings > Android binary > Package name).
6. Click Create.

Changes to make to the Appery.io project

1. Add the button Login with Google on Device on the LoginWithGoogle page.
2. Add the following JavaScript code to the click event:

   window.plugins.googleplus.login(
       {
         'scopes': 'https://www.googleapis.com/auth/drive' // optional, space-separated list of scopes, If not included or empty, defaults to `profile` and `email`.
       },
   function (obj) {
           Apperyio.storage.token.set(obj["accessToken"]);
           Apperyio.navigateTo("WelcomeOnDevice");
       },
       function (msg) {
         alert('error: ' + msg);
       }
   );

3. Duplicate the Welcome page and rename it to WelcomeOnDevice.
4. Remove the JavaScript code from the Page show event (leave only Invoke service there).

Please note that the selected Android certificate will only work with the release option enabled.

One of the core components in Appery.io platform is a cloud build service which builds a binary file (hybrid) for iOS or Android. Appery.io leverages Apache Cordova (PhoneGap) to create a binary file. Launching the build process is very simple. Right from inside the App builder, clicking the Export button you will see the option to create a binary file for iOS or Android.

Export menu

Once Binary (.ipa) or Binary (.apk) is selected, the build process starts. The build process usually takes one minute. When the build is completed, the file is downloaded to your computer. From there you can publish the app to an app store, using the standard publishing process for each store.

Learn more about how to use Apache Cordova in Appery.io to build hybrid apps and use native APIs.

Geolocation is one of the most widely used APIs in mobile apps today. From weather to Uber and Lyft, the device location is crucial information and many APIs use it to determine what services and products are available in a given location. When building a mobile app in Appery.io, using the Geolocation API is simple. Apache Cordova library is built-in in every new Appery.io app. Invoking Geolocation will return the latitude, longitude (and other) information which can then be passed to any REST API. The following two short videos show how to use and invoke Geolocation in an Ionic and jQuery Mobile apps:

• A Quick Guide to Using Geolocation API (Ionic App) 
• A Quick Guide to Using Geolocation API (jQuery Mobile App)

Looking for more videos like that? Check out our YouTube channel for many more videos.

This short video shows how to use Apache Cordova Geolocation API to get latitude and longitude data in an Ionic app.

Watch other Ionic videos on our YouTube channel.

Geolocation is one of the most widely used APIs in mobile apps today. From weather to Uber and Lyft, the device location is crucial information and many APIs use it to determine what services and products are available in a given location. When building a mobile app in Appery.io, using the Geolocation API is simple. Apache Cordova library is built-in in every new Appery.io app. Invoking Geolocation will return the latitude, longitude (and other) information which can then be passed to any REST API. The following two short videos show how to use and invoke Geolocation in an Ionic and jQuery Mobile apps:

• A Quick Guide to Using Geolocation API (Ionic App) 
• A Quick Guide to Using Geolocation API (jQuery Mobile App)

Looking for more videos like that? Check out our YouTube channel for many more videos.

An Apache Cordova library update is coming up: what you should know.

One of the core components in Appery.io platform is a cloud build service which builds a binary file (hybrid) for iOS or Android. Appery.io leverages Apache Cordova (PhoneGap) to create a binary file. Launching the build process is very simple. Right from inside the App builder, clicking the Export button you will see the option to create a binary file for iOS or Android.

Export menu.

Once Binary (.ipa) or Binary (.apk) is selected, the build process starts. The build process usually takes one minute. When the build is completed, the file is downloaded to your computer. From there you can publish the app to an app store, using the standard publishing process for each store.

Learn more about how to use Apache Cordova in Appery.io to build hybrid apps and use native APIs.

Happy coding.

Every Appery.io app comes with the Apache Cordova library automatically installed. This means you have access to default Cordova APIs such as Camera, Contacts, Geolocation, and more. Many users also wanted to add 3rd-party Cordova plugins to the app. To make this process very simple, we’ve added a simple wizard. In this tutorial you are going to learn how to upload a Cordova plugin to your app and use it. You will build an app that will track your route and draw it on a map. The app will do this in the background. (This is a popular feature in fitness apps.)

Read the rest of this entry »

Easily import any Cordova plugin

You can now easily add any 3rd party Cordova plugin to your app. This has been one of the most requested features. No more sources digging and long step-by-step guides. This is how quickly you can add any Cordova plugin to your app:

1. Go to the Github page of the plugin and download the latest stable version by clicking “Download ZIP”. It’s important to download the stable or Release version.
2. Go to Resources > Cordova pluginsand click Import Cordova plugin, then: Choose file, locate the downloaded file and click Import plug-in The plug-in will appear under Cordova plug-ins

And you are done — it’s that’s easy.

Quickly add any Cordova plugin

To manage all Cordova plugins for a particular app go to Project > App settings > Cordova plugins and you’ll set the list. On this page you will also see the Core Cordova plugins – these plugins are automatically available in your app. From this page you can easily manage the plugins. You can quickly enable or disable any plugin.

We think it’s a very nice capability that you will like. To learn more, please read the documentation for more details.

API Express enhancements

API Express allows quickly exposing a relational database via REST APIs. In this update we have added a number of important features.

New service builder components

The API Express Service Builder – a visual tool to build your custom services has a number of new components. These components simplify building your service logic.

Easily build custom services with new logic components

You can learn more about the new components here.

Comparison query operators 

A set of comparison query operators were added to Find operation to make your requests more effective. Here is the operators list:

• $eq – Matches values that are equal to a specified value.
• $gt – Matches values that are greater than a specified value.
• $gte – Matches values that are greater than or equal to a specified value.
• $lt – Matches values that are less than a specified value.
• $lte – Matches values that are less than or equal to a specified value.
• $ne – Matches all values that are not equal to a specified value.
• $in – Matches any of the values specified in an array.
• $nin – Matches none of the values specified in an array.

Learn how to use these operators in examples.

API Express project import & export

Now it’s possible to save your API Express project locally by backing it up.The project can be restored from the exported backup as well. It’s really simple, so you have to go to API Express > Settings and click “Export Backup” to save your API Express project locally. Click “From backup” when creating new API Express project and choose previously stored backup to create a project from the backup. A little bit more about these features is here.

Quickly add a REST API to a controller with drag and drop

A faster way to add a REST API to an AngularJS app

When building an AngularJS app, there are useful snippet called “Invoke service”. The code to execute a REST API service will be added to your scope function when clicking on it. All you have to do is change “service_name” to your actual service name:

Drag and drop a service into an AngularJS controller

We now made it even simpler to add a REST API to a function. Just drag and drop the needed service from Services folder (to the left of the screen, where project tree is located) to your function and you’re done! Even the service name will be automatically substituted:

Edit scheduled pushes for faster development

You can now easily edit scheduled pushes. This means you no longer need to delete a scheduled push in order to make a change. There are few ways in Appery.io to send a Push Notification:

1. By sending the REST request using the Push Notifications API.
2. By calling the appropriate methods in Server Code.
3. By using the web console.

All three methods support scheduling pushes. From now, Server Code and Push Notifications API’s were complemented with new methods to get the list of scheduled notifications and to remove them.

By using the web console you can achieve more functionality when editing scheduled pushes. You can remove them as well, but you can also change notifications content and lot of other options including push message, its sound and devices. Read the doc for details.

Push Notifications API changes

If you built an AngularJS app or jQuery Mobile app (library version 3.0), please make sure you are aware of these API changes:

New version of Appery.io Push Notification plugin has different way to read the message. The changes only concerns AngularJS apps and jQuery Mobile app with libraries version 3.0. If you ever wrote the event.notification.aps.alert code, you should replace it with new variant. So, find your code that looks like:

event.notification.aps.alert

And replace it with the next string:

event.detail.message

That’s all if your making the jQuery Mobile app, but for AngularJS one more step should done. Find PushRegisterDeviceImpl JavaScript file (under JavaScript folder) and replace the entire file with the code provided here.

Happy app building with better Appery.io!