iOS “Add to Home Screen” - file download kicks user out

Question

I'm requiring a valid session in order to download files from my web app.

When I open my web app on my iOS device, sign-in and try to download a file (PDF) from my site, I get kicked out and the link is opened in Safari instead. The user have to login again from Safari in order to download the page.

How can I force the file to open in the web app and trigger the download form there instead?

I'm using Carrierwave and in the controller I have this to trigger a download:

class DocumentsController < ApplicationController

  # .. code omitted
  def download
    if @document.name.file.exists?
      send_file @document.name.path, x_sendfile: true
    else
      redirect_to documents_url, notice: t(:file_not_found)
    end
  end
end

UPDATE: I found half-working solution that opens the file directly in the browser:

$(document).ready ->
  if 'standalone' of window.navigator and window.navigator.standalone
    # For iOS Apps
    $('a').on 'click', (e) ->
      e.preventDefault()
      new_location = $(this).attr('href')
      if new_location != undefined and new_location.substr(0, 1) != '#' and $(this).attr('data-method') == undefined
        window.location = new_location
      return
  return

By using this snippet of code, we force iOS users running in fullscreen-mode (web app) to open all a links inside the app. The problem though is that if a user opens a file, there will be no "back"-button. And since iPhone users are missing a physical back button, they will have to force restart the entire app in order to get out of the showed file.

Vituperate

Please check this: github.com/MrRio/jsPDF/issues/165 and this stackoverflow.com/questions/20978473 – Treiber

Answer 1

Use the code that you posted but instead of writing the entire page content to the body, you could enter it inside a separate div and make sure that there is a "back" button available only for iOS devices:

$(document).ready ->
  if 'standalone' of window.navigator and window.navigator.standalone
    # For iOS Apps
    $('a').on 'click', (e) ->
      e.preventDefault()
      new_location = $(this).attr('href')
      if new_location != undefined and new_location.substr(0, 1) != '#' and $(this).attr('data-method') == undefined
        window.location = new_location
      return
  return

Unschooled

Answer 2

I found half-working solution that opens the file directly in the browser:

$(document).ready ->
  if 'standalone' of window.navigator and window.navigator.standalone
    # For iOS Apps
    $('a').on 'click', (e) ->
      e.preventDefault()
      new_location = $(this).attr('href')
      if new_location != undefined and new_location.substr(0, 1) != '#' and $(this).attr('data-method') == undefined
        window.location = new_location
      return
  return

By using this snippet of code, we force iOS users running in fullscreen-mode (web app) to open all a links inside the app. The problem though is that if a user opens a file, there will be no "back"-button. And since iPhone users are missing a physical back button, they will have to force restart the entire app in order to get out of the showed file.

Vituperate