Not sure whether to call this a tip or a hack. Either way, this post demonstrates a way to mimic Google Chrome on iOS’s x-callback-url support in Mobile Safari through the use of some javascript and an intermediate static html page.

For those not familiar, it is possible to use x-callback-url support in Google Chrome on iOS to open a URL from another app, and have Chrome present a “Back” button to return to the app you opened the URL from. Safari does not offer this level of integration.

To mimic this feature in Safari, I have created an intermediate HTML page with a little javascript that can take a “url” and “x-success” parameter. If it gets these, it will load the “url” in an iframe that displays full screen, and present a “< Back” button in the top left of the screen, which when tapped will open the URL in the “x-success” parameter.

Here is a sample Drafts action that will use this page to open a URL from the text selection (or entire draft if no selection is made) using this technique.

The action works looks like this:

http://media.agiletortoise.com/callback.html?
      url=[[selection]]&
      x-success={{drafts://}}

Which consists of three parts:

  • http://media.agiletortoise.com/callback.html : URL to the static HTML page. Free free to copy this page, modify it, host it elsewhere.
  • url=[[selection]] : url parameter passed to the HTML page will has javascript that will look for this parameter. It should be a URL encoded URL, which will be loaded in an iframe. In this example I am using a Drafts’ tag that returns the current text selection or the full draft if there was no selection.
  • x-success={{drafts://}} : The URL encoded URL to open when the “< Back” button is tapped.

The page also automatically adds an “X” link that will close navigation directly to the url in the URL parameter…which is basically a “Cancel” button.

This example could easily be adapted for use in Launch Center Pro, Mr. Reader or other apps that support custom actions.

Hope it’s useful to someone. It is certainly a bit of a hack. One caveat, some websites pass the “X-Frame-Options” header to prevent them from being loaded in iframes, and this hack won’t work so well for them.