You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@cordova.apache.org by Brad Reynolds <br...@gmail.com> on 2016/02/17 20:28:39 UTC

Remote site plugin

We built a Cordova app that wraps a remote site.  The only HTML page
bundled in our app redirects to our remote site on load.  I was new to
Cordova at the time and was looking for the fastest way possible to get the
app out the door.  To do so I modified the generated iOS and Android
projects with the hooks I felt I needed in order to inject Cordova
components and plugins into the remote site.  It seems to be working for us
and has been accepted by both app stores.

I'd like to package up the modifications for this as a plugin as we plan to
build other apps in the same manner.  I've been familiarizing myself with
the plugin architecture and am not sure if what I need is exposed on both
platforms and thus this email to the dev list.  I'm looking for guidance on
how to implement the hooks I've listed below as a plugin.  The end goal is
to inject the Cordova components and plugins and allow the user to retry
loading the site upon error.  Below are details of the changes I made.  I'm
going to keep digging on my own but any direction would be greatly
appreciated.

Thanks,
Brad Reynolds

## iOS

iOS was pretty simple to get up and running.  The generated
MainViewController had page life cycle methods that I was able to easily
hook into and inject Cordova.

### MainViewController.m Changes:

1. Implemented `webViewDidFinishLoad:(UIWebView *)theWebView` to inject
Cordova components.

To allow the user to retry reloading the current page upon failure:

1. Implemented `webView:(UIWebView *)theWebView
didFailLoadWithError:(NSError *)error`.

## Android

Android was more difficult or at least I had to look for something other
than page events.  The end result was I used Android's
`@JavascriptInterface` mechanism to make a JS object available that would
inject Cordova into the current page.  As a result all loaded pages needed
to look for this object and invoke an initialization function on it.

1. Subclassed SystemWebViewEngine and added config.xml entry to use our
engine.
2. Subclassed SystemWebView and returned from our engine.
3. Within our SystemWebView subclass added a JavascriptInterface providing
a hook back into Android. When invoked this told the Adroid code it was
time to inject Cordova.

To allow the user to retry reloading the current page:

1. Implemented MainActivity.onReceivedError(...).

Re: Remote site plugin

Posted by Brad Reynolds <br...@gmail.com>.
Thanks for the reply Parashuram.  I hadn't looked at ManifoldJS but now
that I have I don't think that's the route I want to take, for my use case
a least.  The plugin was quite helpful.  This was what I was looking for on
the iOS side:

https://github.com/manifoldjs/ManifoldCordova/blob/master/src/ios/CDVHostedWebApp.m#L93

I was hoping I could avoid wrapping the webview delegate but it appears
there isn't another way to get at these events (according to this plugin).
It's a bit of a hack but I think it's one I could live.

Thanks for the help.

Brad


On Wed, Feb 17, 2016 at 3:59 PM Parashuram N <pa...@microsoft.com> wrote:

> Hey Brad,
>
> This sounds pretty cool. Have you also looked at projects like ManifoldJS
> - http://manifoldjs.com/? They also do almost the same thing. They also
> have a Cordova plugin that displays an error page when you go offline. Note
> that Manifold is not a plugin, but a tool built on top of Cordova.
>
> Here is a link to the plugin that does the online-offline scenario -
> https://github.com/manifoldjs/ManifoldCordova.
>
> -----Original Message-----
> From: Brad Reynolds [mailto:bradleyjames@gmail.com]
> Sent: Wednesday, February 17, 2016 11:29 AM
> To: dev@cordova.apache.org
> Subject: Remote site plugin
>
> We built a Cordova app that wraps a remote site.  The only HTML page
> bundled in our app redirects to our remote site on load.  I was new to
> Cordova at the time and was looking for the fastest way possible to get the
> app out the door.  To do so I modified the generated iOS and Android
> projects with the hooks I felt I needed in order to inject Cordova
> components and plugins into the remote site.  It seems to be working for us
> and has been accepted by both app stores.
>
> I'd like to package up the modifications for this as a plugin as we plan
> to build other apps in the same manner.  I've been familiarizing myself
> with the plugin architecture and am not sure if what I need is exposed on
> both platforms and thus this email to the dev list.  I'm looking for
> guidance on how to implement the hooks I've listed below as a plugin.  The
> end goal is to inject the Cordova components and plugins and allow the user
> to retry loading the site upon error.  Below are details of the changes I
> made.  I'm going to keep digging on my own but any direction would be
> greatly appreciated.
>
> Thanks,
> Brad Reynolds
>
> ## iOS
>
> iOS was pretty simple to get up and running.  The generated
> MainViewController had page life cycle methods that I was able to easily
> hook into and inject Cordova.
>
> ### MainViewController.m Changes:
>
> 1. Implemented `webViewDidFinishLoad:(UIWebView *)theWebView` to inject
> Cordova components.
>
> To allow the user to retry reloading the current page upon failure:
>
> 1. Implemented `webView:(UIWebView *)theWebView
> didFailLoadWithError:(NSError *)error`.
>
> ## Android
>
> Android was more difficult or at least I had to look for something other
> than page events.  The end result was I used Android's
> `@JavascriptInterface` mechanism to make a JS object available that would
> inject Cordova into the current page.  As a result all loaded pages needed
> to look for this object and invoke an initialization function on it.
>
> 1. Subclassed SystemWebViewEngine and added config.xml entry to use our
> engine.
> 2. Subclassed SystemWebView and returned from our engine.
> 3. Within our SystemWebView subclass added a JavascriptInterface providing
> a hook back into Android. When invoked this told the Adroid code it was
> time to inject Cordova.
>
> To allow the user to retry reloading the current page:
>
> 1. Implemented MainActivity.onReceivedError(...).
>

RE: Remote site plugin

Posted by Parashuram N <pa...@microsoft.com>.
Hey Brad,

This sounds pretty cool. Have you also looked at projects like ManifoldJS - http://manifoldjs.com/? They also do almost the same thing. They also have a Cordova plugin that displays an error page when you go offline. Note that Manifold is not a plugin, but a tool built on top of Cordova. 

Here is a link to the plugin that does the online-offline scenario - https://github.com/manifoldjs/ManifoldCordova. 

-----Original Message-----
From: Brad Reynolds [mailto:bradleyjames@gmail.com] 
Sent: Wednesday, February 17, 2016 11:29 AM
To: dev@cordova.apache.org
Subject: Remote site plugin

We built a Cordova app that wraps a remote site.  The only HTML page bundled in our app redirects to our remote site on load.  I was new to Cordova at the time and was looking for the fastest way possible to get the app out the door.  To do so I modified the generated iOS and Android projects with the hooks I felt I needed in order to inject Cordova components and plugins into the remote site.  It seems to be working for us and has been accepted by both app stores.

I'd like to package up the modifications for this as a plugin as we plan to build other apps in the same manner.  I've been familiarizing myself with the plugin architecture and am not sure if what I need is exposed on both platforms and thus this email to the dev list.  I'm looking for guidance on how to implement the hooks I've listed below as a plugin.  The end goal is to inject the Cordova components and plugins and allow the user to retry loading the site upon error.  Below are details of the changes I made.  I'm going to keep digging on my own but any direction would be greatly appreciated.

Thanks,
Brad Reynolds

## iOS

iOS was pretty simple to get up and running.  The generated MainViewController had page life cycle methods that I was able to easily hook into and inject Cordova.

### MainViewController.m Changes:

1. Implemented `webViewDidFinishLoad:(UIWebView *)theWebView` to inject Cordova components.

To allow the user to retry reloading the current page upon failure:

1. Implemented `webView:(UIWebView *)theWebView didFailLoadWithError:(NSError *)error`.

## Android

Android was more difficult or at least I had to look for something other than page events.  The end result was I used Android's `@JavascriptInterface` mechanism to make a JS object available that would inject Cordova into the current page.  As a result all loaded pages needed to look for this object and invoke an initialization function on it.

1. Subclassed SystemWebViewEngine and added config.xml entry to use our engine.
2. Subclassed SystemWebView and returned from our engine.
3. Within our SystemWebView subclass added a JavascriptInterface providing a hook back into Android. When invoked this told the Adroid code it was time to inject Cordova.

To allow the user to retry reloading the current page:

1. Implemented MainActivity.onReceivedError(...).

Re: Remote site plugin

Posted by Shazron <sh...@gmail.com>.
In config.xml,
<content src="http://mysite.com" />
<allow-navigation href="http://mysite.com" />

... does not work for you?

Also, ErrorUrl support:
https://git-wip-us.apache.org/repos/asf?p=cordova-docs.git;a=blobdiff;f=docs/en/edge/guide/platforms/ios/config.md;h=6b05869c4eec7418dee7fe8e16089ea6474d3a35;hp=e0e0a73fd0a85cb5dce2ba35df75c105ad243e69;hb=83a113c;hpb=281dc5f7c5911f9474241c3f79eb25cc9ae65c08


On Wed, Feb 17, 2016 at 11:28 AM, Brad Reynolds <br...@gmail.com> wrote:
> We built a Cordova app that wraps a remote site.  The only HTML page
> bundled in our app redirects to our remote site on load.  I was new to
> Cordova at the time and was looking for the fastest way possible to get the
> app out the door.  To do so I modified the generated iOS and Android
> projects with the hooks I felt I needed in order to inject Cordova
> components and plugins into the remote site.  It seems to be working for us
> and has been accepted by both app stores.
>
> I'd like to package up the modifications for this as a plugin as we plan to
> build other apps in the same manner.  I've been familiarizing myself with
> the plugin architecture and am not sure if what I need is exposed on both
> platforms and thus this email to the dev list.  I'm looking for guidance on
> how to implement the hooks I've listed below as a plugin.  The end goal is
> to inject the Cordova components and plugins and allow the user to retry
> loading the site upon error.  Below are details of the changes I made.  I'm
> going to keep digging on my own but any direction would be greatly
> appreciated.
>
> Thanks,
> Brad Reynolds
>
> ## iOS
>
> iOS was pretty simple to get up and running.  The generated
> MainViewController had page life cycle methods that I was able to easily
> hook into and inject Cordova.
>
> ### MainViewController.m Changes:
>
> 1. Implemented `webViewDidFinishLoad:(UIWebView *)theWebView` to inject
> Cordova components.
>
> To allow the user to retry reloading the current page upon failure:
>
> 1. Implemented `webView:(UIWebView *)theWebView
> didFailLoadWithError:(NSError *)error`.
>
> ## Android
>
> Android was more difficult or at least I had to look for something other
> than page events.  The end result was I used Android's
> `@JavascriptInterface` mechanism to make a JS object available that would
> inject Cordova into the current page.  As a result all loaded pages needed
> to look for this object and invoke an initialization function on it.
>
> 1. Subclassed SystemWebViewEngine and added config.xml entry to use our
> engine.
> 2. Subclassed SystemWebView and returned from our engine.
> 3. Within our SystemWebView subclass added a JavascriptInterface providing
> a hook back into Android. When invoked this told the Adroid code it was
> time to inject Cordova.
>
> To allow the user to retry reloading the current page:
>
> 1. Implemented MainActivity.onReceivedError(...).

---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org