“Open With” in iOS PhoneGap Apps

Let’s say that you have a PhoneGap app that has access to documents, but you want to open those documents in a different application outside of your PhoneGap application.   For example, let’s say you have a DRM-protected PDF document that gets authenticated by an Adobe LiveCycle server.   On iOS devices, the DRM can only be authenticated if you are using Adobe Reader.  So, you need to delegate handling of that file to Adobe Reader.

You have two ways of handling this type of scenario: Either the target app opens the document via a custom URL scheme, or your app delegates to another application that is registered to handle a specific file format.   If the target app has a custom URL scheme, you just make a request following that scheme’s conventions… Simple, right?   If the target app does not have a custom URL scheme, then what do you do?

iOS supports the ability to use an “open with” menu through the UIDocumentInteractionController class, but by default this is not available to PhoneGap applications.  Luckily for us, PhoneGap is extensible, and we can create native plugins for whatever we want.

Since Adobe Reader does not yet support a custom URL scheme, you could use the UIDocumentInteractionController to suggest that the user opens the document with Adobe Reader, and this is exactly what I did…

I created a PhoneGap native plugin that allows you to specify a file URL and UTI, and it will use the UIDocumentInteractionController class to ask the user to select another program to use for handling the file.  Check out the video below to see it in action:

Using this within your PhoneGap app is dirt simple:

[js]ExternalFileUtil.openWith(
"http://www.tricedesigns.com/temp/drm.pdf",
"com.adobe.pdf" );[/js]

The plugin workflow is as follows:

  1. PhoneGap app requests ExternalFileUtil.openWith action, specifying a file URL and UTI.
  2. Plugin downloads the file and saves as a local temp file
  3. Plugin uses UIDocumentInteractionController to launch an “open with” dialog
  4. User selects appropriate app to “preview” the content
  5. The appropriate reader app is opened and UI/input is handed over to the target app
  6. Plugin deletes the temp file

Even though I’ve demonstrated this with a PDF and Adobe Reader, this is not limited to just PDF handling.  This plugin should work with any file type that has registered handlers (although I’ve only tested with PDFs & Adobe Reader).  You just need to specify the UTI that is supported by the target application(s).  You can view a list of predefined UTI values from Apple, or create your own applications that support custom UTIs.

If you’re interested, YES, you can use this today.  I’ve already committed it to GitHub and sent a pull request to the master phonegap-plugins repo.  Go download it now!

Enjoy!

98 replies on ““Open With” in iOS PhoneGap Apps”