search

jquery-archive / jquery-mobile

jQuery Mobile Framework
https://jquerymobile.com
Other
9.7k stars 2.41k forks source link

iOS and JQM+PhoneGap breaking security change #8634

Closed kevgrig closed 5 years ago

kevgrig commented 5 years ago

Hi, I've been using JQM+PhoneGap for years and love it; thank you!

Starting with iPhone OS 11.3, my app is broken with the following error:

SecurityError: Blocked attempt to use history.replaceState() to change session history URL from file:///var/containers/Bundle/Application/E73A3E4A-D961-4943-BAA3-7845E755F6A0/myplaceonline.app/www/index.html#/?phonegap=true to https://myplaceonline.com/?phonegap=true. Protocols, domains, ports, usernames, and passwords must match.
url:
file:///var/containers/Bundle/Application/E73A3E4A-D961-4943-BAA3-7845E755F6A0/myplaceonline.app/www/js/jquery.mobile-1.4.5.min.js
line #: 3 (31672)

The way I've always done it (and this continues to work with Android):

  1. PhoneGap app loads JQM in an index.html page.
  2. A JQM mobileinit event handler is attached which registers a pageloaded event handler which ultimately calls loadHomepage.
  3. loadHomepage sets $.mobile.path.documentBase and the href attribute of the base tag to my remote server (https://myplaceonline.com/) and calls $.mobile.pageContainer.pagecontainer("change", "/", { allowSamePageTransition: true, transition: 'none', reloadPage: true, changeHash: true }); to load the remote homepage.
  4. This ultimately drives JQM to call replaceState which fails with the security error: 
    replaceState@[native code]
squash@file:///var/containers/Bundle/Application/E73A3E4A-D961-4943-BAA3-7845E755F6A0/myplaceonline.app/www/js/jquery.mobile-1.4.5.min.js:3:31672
go@file:///var/containers/Bundle/Application/E73A3E4A-D961-4943-BAA3-7845E755F6A0/myplaceonline.app/www/js/jquery.mobile-1.4.5.min.js:4:322
navigate@file:///var/containers/Bundle/Application/E73A3E4A-D961-4943-BAA3-7845E755F6A0/myplaceonline.app/www/js/jquery.mobile-1.4.5.min.js:4:1598

The purpose of all of the above is so that I don't navigate away from file:/// because if I were to do that, I would lose access to all native phone JS APIs through PhoneGap. This works on older versions of iOS and continues to work on Android.

Any ideas on an alternative way to do this to get around the tighter security on newer versions of iOS? Alternatively, I see there are issues like https://github.com/jquery/jquery-mobile/issues/5465 which suggest a method of disabling history and I'm wondering if this would be another workaround and what I would lose?

kevgrig commented 5 years ago

Adding the following code to a mobileinit handler fixes the issue:

$.mobile.hashListeningEnabled = false;
$.mobile.pushStateEnabled = false;
$.mobile.changePage.defaults.changeHash = false;