I need help to disable back-forward cache on Safari iOS. I tried suggestions provided in this and this but it didn't help.
The functionality that I am trying to achieve is on a multi-page form when a user clicks on the back button he should not be allowed to edit the information on the previous form page. For this I have a modal popup blocking the edit when user clicks back and it works fine on desktop browser and on android but doesn't work as expected on iPhone because of back-forward cache on Safari iOS.
Related
I am using an online builder for my app(ApperyDotIo, JQM framework). My application works fine with one exception. I have an in-app link to my website. The link in the iOS app, the link takes me to the page but since the iPhone doesn't have a "back" button I can't go back to the app. Looks like you have to close the app and then reopen it to get back into the app.
I tried to set the link to not open in the same window and vice versa.
Any easy work around?
Links and back buttons in Android apps work fine.
Thank you
You can consider using the inAppBrowser: https://docs.appery.io/docs/cordova-jquerymobile-inappbrowser
It will allow you to open the website in the child window of the application (with the "close" button) or in the native browser, without opening the website as application page.
I have a PWA saved on the home screen, this opens up standardly without search bar nor the bottom buttons (share, tabs, etc..).
So every link gets opened inside the PWA, and that is expected.
I have a problem when showing pdfs as they normally open in Safari with the "share" button and all the bottom bar, but in the PWA they open up without bottom bar and without any share button.
So my idea is to open the PDF link (http://www.mywebsite.com/download/pdf/12345) in a new safari window,.
I tried putting target="_blank" on the PDF link but this did not solve the problem.
I also tried forcing the iOS behavior by opening the app in safari with safari://http://www.mywebsite.com/download/pdf/12345 but with no luck.
How do I open a New Safari window to a link?
OK, the ONLY working solution is to tell iOS you are going onto another domain.
PWA stays in your app frame ONLY if you stay in the same domain.
To open a link within your domain in an EXTERNAL window (or inside the PWA but with Safari standard controls) you have to send it to an external/different domain.
So the PWA is on https://www.mywebsite.com/ and you want to open a PDF with all Safari control buttons, you just create a SUB domain and point the link to it, like https://media.mywebsite.com/download/pdf/12345 at this point the PWA thinks you are on a different domain and does the correct rendering! 🎉
You can try to use window.open(url).
But, remember to put it in an element with onclick event attribute.
For example,
<button class='btn' onclick='window.open("https://www.google.com", "_blank");'>Open Google search</button>
Reference: window.open(url, '_blank'); not working on iMac/Safari
EDIT
You can set a scope in manifest.json to customize where to open an external link.
You can refer https://developers.google.com/web/fundamentals/web-app-manifest on the property scope.
I've used Vuejs and Framework7 in my PWA. I want to open a remote PDF file in my PWA and also it's important to me that users be able to back to my PWA after opening PDF. I did this using :
window.open(pdf_url, "_blank");
And it works fine for iOS > 12 and after opening pdf file there is an "OK" button for closing pdf.
But for example in iOS 11.3 there is no button and user has to use home button to close PWA.
I tried to solve problem using iframe but I can show only first page of the pdf.
Is there any way to fix this issue?
You can resolve this issue by doing some tricks (for any device without back button):
if you use iframe, you can set height manualy with overflow scroll, and I think this will resolve issue (dependence of style or lib dependency, so that may be not work).
you can add back button to your navbar, or Toolbar to let user click on it to back to previous page. (I prefer this solution).
you can render pdf in popup nested of normal html page, and then you can customize popup component by handling back button, or handling close by dropback overlay.
I use second and third point in real project and its work fine...
This is sample close button code used in popup:
'<p>'+ i18nextHelper.i18next.t('Exit From PDF') +'</p>'
Note: You can also customize height page for pdf page only, and add normal button bellow it, or by add absolute positioning button above PDF, but I think if you use second or third point will be best.
Good luck.
Is it possible to open Safari from code that will reopen Safari with the last tab open? I've searched around and I can only find how to open Safari with a URL (not what I want) or open it to a blank page (also not what I want). Is it possible to reopen Safari in its last state?
e.g. someone is on Google on Safari. They then hide the app and launch my app. I'd like my app to open Safari and show Google - I don't want to use the delegate bundle passed in during activation as the website may be expired or dynamic and so I don't want to reload the page.
Thanks
I work on jquery mobile with phonegap
I would like to detect a click on the physical back button to close my popup.
Currently when I click on that button on a mobile support, it returns me to the page visited previously, I think it only uses the history.
If this is not possible in pure js, then maybe just block this physical button.
Thanks