Server hosted Webapp using plugins when shown in Android and iOS

#1

We have a webapp developed with AppStudio hosted on a company server.
We have desktop apps, developed with a different tools depending on the OS they target, referring to the app online to allow us to maintain a single code base, all works fine.

We want to manage mobile devices (Android and iOS) thru another AppStudio/PhoneGap project that simply redirects to the app online, this also works fine.

The problem is obviously trying to use cordova platform-specific plugins, which are not available in the app hosted on the server, in our case we need to handle local notifications and badges.

Does anyone have experience with this?
Is it possible to have a mobile device target a webapp while still using plugins?

This seems to be a fairly common practice, yet I haven’t been able to find any updated documentation on the matter.

Any help greatly appreciated.
Thanks.

#2

Plugins are specific to native apps - they will not work on a web app.

You can make native apps with VoltBuilder which include all the plugins.

#3

Yes, that’s clear.
My question is:
In a mobile device, can I pull contents from a web page while running plugins in a native app?

#4

Yes - plugins are just additional libraries of functions. They will not affect the ability to communicate with a web site.

#5

Could you please elaborate more?
If I redirect a native app to a web page, support for cordova plugins gets lost.

Let me give you an example:

  • AppStudio/PhoneGap native app for Android has reference to a number of cordova/npn plugins.
  • All plugin functionalities work fine.
  • The native app redirects to a web hosted page via window.location.
  • Cordova becomes undefined and as a consequence plugins are not available.
#6

Sounds like it’s leaving your app and going to Chrome.

What you need to use is an in app browser:

#7

Tried it, still loses native plugin support.

#8

Maybe I don’t understand what you are doing. Are you loading and executing code on the website?

#9

Hello George, I recommend to use this one: cordova-plugin-safariviewcontroller.

#10

Thanks for the suggestion. Not having done this myself, I may not be the best person to give advice here!

#11

These are fine suggestions if all you need to do is display a web app that doesn’t interact with native cordova plugins.

I was able to get it to work by:

  • Unpacking and analyzing my apk and ipa files to see what was included for the plugins.
  • Creating a parallel setup for both iOS and Android, by renaming 2 files and a folder for each platform (and all references inside the 2 files). See screenshot.
  • Dynamically referencing the proper cordova.[platform].js file during app load, depending on the OS, extracted from the useragent string.
  • Including the 4 files and the 2 folders in my AppStudio project, in Project Properties/extraFiles.

Now my native Android/iOS app is redirected at startup to the web app, which will configure itself for cordova plugin support.
Notifications and badges are now properly controlled by the web app.

Feels like this should be a feature in the wishlist for a future release of AppStudio.

Thanks all for you help.

#12

Here’s a few references (I can only post 2 links per post, sorry):