WebView中XMLHttpRequest默认无超时导致白屏，须显式设timeout（8000–12000ms）并监听ontimeout；fetch在iOS WKWebView不支持timeout，需用Promise.race或AbortController封装；跨域和HTTPS混合内容也会伪超时，需分别配置WebView策略、改用本地HTTP服务及统一HTTPS请求。
WebView中XMLHttpRequest超时时间没设，直接卡死
HTML5转APP常用WebView加载页面，但XMLHttpRequest默认不设timeout，网络抖动或弱网下会等几十秒才失败，用户感知就是“白屏”或“按钮点不动”。这不是后端问题，是前端没兜底。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 所有
XMLHttpRequest实例必须显式设置timeout，建议 8000–12000ms（别设太短，Android WebView预加载可能延迟） - 监听
ontimeout事件，而非只靠onerror，因为超时不会触发onerror - 示例：
const xhr = new XMLHttpRequest();
xhr.timeout = 10000;
xhr.ontimeout = () => console.error('请求超时');
xhr.open('GET', '/api/data');
xhr.send();
fetch在iOS WKWebView里不支持timeout参数
fetch写起来干净，但iOS WKWebView（尤其旧版 iOS 12–14）原生不支持timeout选项，传了也无效。很多团队以为加了{ timeout: 10000 }就万事大吉，结果线上照样超时卡住。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 别依赖
fetch原生timeout，用Promises.race()手动包装超时逻辑 - 注意
AbortController在低版本iOS不兼容，iOS 12.2+才稳定支持，上线前务必真机测 - 简单封装示例：
function fetchWithTimeout(url, options = {}, timeout = 10000) {
const controller = new AbortController();
const id = setTimeout(() => controller.abort(), timeout);
return fetch(url, { ...options, signal: controller.signal })
.finally(() => clearTimeout(id));
}
Cross-Origin请求被WebView拦截，伪超时
很多H5转APP项目把前端资源放本地（file:// 或 http://localhost），但API走公网域名，触发CORS。Android WebView默认禁止跨域，iOS WKWebView更严格——请求根本发不出去，onload/onerror都不触发，看起来就像“超时”。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- Android：启动WebView时必须调用
setAllowUniversalAccessFromFileURLs(true)（仅调试用，上线需配合服务端CORS头） - iOS：禁用
file://加载，改用http://127.0.0.1:8080本地HTTP Server（如serve或mini-server），绕过WKWebView的file协议限制 - 验证是否CORS问题：用Chrome DevTools远程调试WebView，看Network面板里请求状态是
(blocked:cors)还是pending
HTTPS混合内容（Mixed Content）导致请求静默失败
APP内WebView加载的是HTTPS页面，但JS里写了http://api.xxx.com这种明文地址，现代WebView（尤其iOS 15+、Android 10+）会直接拦截请求，不报错也不回调，表现和超时一模一样。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 全局搜索代码里所有
http://开头的请求地址，强制替换成https://或协议相对路径//api.xxx.com - 后端Nginx/Apache配置
Strict-Transport-Security头，避免HSTS降级 - 开发期用Charles/Fiddler抓包，过滤
http://请求，看是否被标记为Mixed Content blocked
