Skip to content

C
CFFP-HB
Commit d7e9929b by Sweet Zhang
Options

解决ios加载webview缓慢

parent a01e6a90
Showing with 33 additions and 54 deletions
index.html
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<!-- ===== vConsole 提前加载 ===== -->
<script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js"></script>
<script>
// 立即初始化，不依赖任何框架
var vConsole = new window.VConsole();
console.log('[vConsole] 已初始化');
</script>
<!-- ===== vConsole 加载结束 ===== -->
<!-- ===== 1. 状态栏占位 ===== -->
<script> <script>
// ============ 新增：解析 URL 参数并设置状态栏占位 ============
//解决项目以h5的方式内嵌到app的webview中，手机状态栏和页面顶部内容重叠的问题
(function() { (function() {
function getQueryParam(name) { function getQueryParam(name) {
// 从 hash 中提取查询参数 var searchParams = new URLSearchParams(window.location.search);
const hash = window.location.hash; if (searchParams.has(name)) return searchParams.get(name);
const queryIndex = hash.indexOf('?'); var hash = window.location.hash;
console.log('queryIndex', queryIndex); var queryIndex = hash.indexOf('?');
if (queryIndex === -1) return null; if (queryIndex !== -1) {
const queryString = hash.substring(queryIndex + 1); var params = new URLSearchParams(hash.substring(queryIndex + 1));
const reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)'); if (params.has(name)) return params.get(name);
const r = queryString.match(reg); }
console.log('匹配结果', r);
if (r != null) return decodeURIComponent(r[2]);
return null; return null;
} }
const statusBarHeight = getQueryParam('statusBarHeight');
console.log('状态栏高度', statusBarHeight); var statusBarHeight = getQueryParam('statusBarHeight');
if (statusBarHeight) { if (statusBarHeight) {
const height = parseInt(statusBarHeight, 10); var height = parseInt(statusBarHeight, 10);
if (!isNaN(height) && height > 0) { if (!isNaN(height) && height > 0) {
document.write('<style>' + var style = document.createElement('style');
style.textContent =
'html, body { margin:0; padding:0; height:100%; overflow:hidden; }' + 'html, body { margin:0; padding:0; height:100%; overflow:hidden; }' +
'body { padding-top: ' + height + 'px; box-sizing: border-box; }' + 'body { padding-top: ' + height + 'px; box-sizing: border-box; }' +
'#app { height: 100%; overflow-y: auto; }' + '#app { height: 100%; overflow-y: auto; }';
'</style>'); document.head.appendChild(style);
} }
} }
})(); })();
// ============ 新增结束 ============ </script>
var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
CSS.supports('top: constant(a)'))
document.write(
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
(coverSupport ? ', viewport-fit=cover' : '') + '" />')
// 判断是否在小程序Webview环境中 <!-- ===== 2. Viewport ===== -->
function isInMiniProgram() { <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover" />
// 更安全的小程序环境判断
try {
return typeof wx !== 'undefined' && wx.miniProgram && wx.miniProgram.getEnv;
} catch (e) {
return false;
}
}
// 页面加载完成后执行
document.addEventListener('DOMContentLoaded', function() {
// 非小程序环境才加载微信JS-SDK
if (!isInMiniProgram()) {
var script = document.createElement('script');
script.src = 'https://res2.wx.qq.com/open/js/jweixin-1.6.0.js';
document.head.appendChild(script);
console.log('加载微信JS-SDK');
} else {
console.log('小程序Webview环境，不加载微信JS-SDK');
}
});
</script>
<title>银盾家办</title> <title>银盾家办</title>
<link rel="stylesheet" href="./static/font/iconfont.css"> <link rel="stylesheet" href="./static/font/iconfont.css">
<link rel="shortcut icon" href="./static/suplogo.ico"> <link rel="shortcut icon" href="./static/suplogo.ico">
</head> </head>
<body> <body>
<div id="app"> <div id="app"></div>
<!--app-html-->
</div>
<script type="module" src="/main.js"></script> <script type="module" src="/main.js"></script>
</body>
</body>
</html> </html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment