iOS safari 崩溃(问题反复出现) [英] iOS safari crashing (a problem repeatedly occured)
问题描述
我正在开发一个网站，最近在我的 iPhone X 上进行测试时遇到了一个问题 - 该网站无法加载.
I'm developing a website and have recently run into a problem when testing on my iPhone X - the site wont load.
Safari 尝试加载它，然后报告错误此网页因出现问题而重新加载"，经过几次尝试后它放弃并报告反复出现问题".我 iPhone 上的 Chrome 也无法加载该网站.
Safari tries to load it, then reports the error 'this web page was reloaded because a problem occured', and after a couple of tries it gives up and reports 'a problem repeatedly occured'. Chrome on my iPhone also doesn't load the site.
此时我无法公开分享网站，但在 chrome 桌面控制台中没有报错.事实上，该网站在我的台式机、笔记本电脑、旧 iPhone 6 和 5s、我的朋友三星 android 以及我测试过的其他 15 台随机电脑和手机上运行得非常好.它在 xCode 模拟器中也可以很好地加载.但它不适用于我的 iPhone X.
At this time I can't share the website publicly, but there are no errors reported in the chrome desktop console. In fact, the website runs perfectly fine on my desktop, my laptop, my old iPhone 6 and 5s, my friends Samsung android, and 15 other random computers and phones I've tested it on. It also loads fine in xCode simulator. But it doesn't work on my iPhone X.
我对 SO 和整个互联网的研究使我相信这个错误通常是由于内存使用过多造成的，但桌面版 Chrome 报告的内存使用峰值仅为 20mb.此外，该网站在我的劣质 iPhone 5s 上也能正常加载.
My research across SO and the internet in general has led me to believe this error is usually due to excessive memory usage, but desktop Chrome reports the memory usage peaks at 20mb only. Also the site loads just fine on my inferior iPhone 5s.
我已清除 iPhone X 上的 safari 和 chrome 缓存，打开/关闭阻止 cookie，重置网络设置，并重新启动手机.
I have cleared the safari and chrome caches on my iPhone X, toggled block cookies on/off, reset network settings, and restarted the phone.
我担心的是，如果我的 iPhone X 无法加载该网站，那么其他用户无疑会遇到问题，即使我也测试过的 20 台其他设备都可以正常工作.
My worry is that if my iPhone X doesn't load the site, no doubt other users will have problems, even if the 20 miscellaneous devices I have also tested work just fine.
有人知道这里发生了什么吗?
Does anyone have any idea what is going on here?
推荐答案
我今天遇到了这个问题，想看看会导致这种情况发生的 MRE.当在至少两个 <input> 控件上设置 autofocus 属性时，iOS 14 上的 Safari 和 Chrome 似乎都崩溃了， 和 然后使用 JavaScript 请求将焦点放在任一控件上.我能够确认在 iOS <= 13 上不会发生崩溃.macOS 上的 Chrome 87 和 Safari 13.1 也不受影响.
I ran into this issue today and wanted to see the MRE that would cause this to happen. It does seem to be the case that both Safari and Chrome on iOS 14 crash when the autofocus attribute is set on at least two <input> controls, and focus is then requested on either control using JavaScript. I was able to confirm that the crash doesn't occur on iOS <= 13. Chrome 87 and Safari 13.1 on macOS are also unaffected.
是否发生崩溃取决于何时请求焦点.在窗口加载"事件中，事情继续运行.当在文档就绪"处理程序中或在文档末尾请求时，事情就会变糟.
Whether the crash occurs depends on when focus is requested. In the 'window load' event, things keep running. When requested in the 'document ready' handler, or at the end of the document, things go bad.
在多个元素上设置 autofocus 没有多大意义，但浏览器不应该崩溃.JavaScript 后备可用于为 浏览器提供一致的用户体验，这些浏览器缺乏对 autofocus> 属性.明显的解决方法是删除所有冲突的 autofocus 属性.
Setting the autofocus on more than one element doesn't make much sense, but the browser shouldn't crash. The JavaScript fallback may be used to provide a consistent UX for browsers that lack support for the autofocus attribute. The obvious fix for this is to remove all conflicting autofocus attributes.
/*
// Load event on window object: NO CRASH
window.addEventListener('load', (e) => document.querySelector('input[name="field_1"]').focus());
// DOMContentLoaded event on document object: CRASH
document.addEventListener('DOMContentLoaded', (e) => document.querySelector('input[name="field_1"]').focus());
*/
// End of document script: CRASH
document.querySelector('input[name="field_1"]').focus();<!DOCTYPE html>
<html>
<body>
<form>
<p><label>First field<br><input type="text" name="field_1" autofocus></label></p>
<p><label>Second field<br><input type="text" name="field_2" autofocus></label></p>
</form>
</body>
</html>这篇关于iOS safari 崩溃(问题反复出现)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
