Alert, confirm, and prompt not working after using History API on Safari, iOS
After calling history.pushState in Safari on iOS, it's no longer possible to use alert(), confirm() or prompt(), when using the browser back button to change back.
Is this an iOS bug? Are there any known workarounds?
Simple example to reproduce this behavior:
<html>
<body>
<ul>
<li>Step 1: <button onclick="alert(Math.random())">Confirm Alert is working</button></li>
<li>Step 2: <button onclick="history.pushState(null, null, '/debug/'+Math.random());">Change History</button></li>
<li>Step 3: use your browser back button, to go back</li>
<li>Step 4: <button onclick="alert(Math.random())">Alert is not working anymore</button></li>
</ul>
</body>
</html>
You can try it online here: goo.gl/faFW6o.
Solution 1:
This is because of the back-forward cache in Safari.
You can use the following code to force a reload when the back-button is pressed.
window.onpageshow = function(e) { // e -> event
if (e.persisted) {
window.location.reload();
}
};
Additionally, if you are using jQuery ...
$(window).bind("pageshow", function(e) { // e -> event
if (e.originalEvent.persisted) {
window.location.reload();
}
});