Skip to content

C
CFFP-HB
Commit d7e9929b by Sweet Zhang
Options

解决ios加载webview缓慢

parent a01e6a90
Showing with 50 additions and 71 deletions
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<script>
// ============ 新增：解析 URL 参数并设置状态栏占位 ============
//解决项目以h5的方式内嵌到app的webview中，手机状态栏和页面顶部内容重叠的问题
(function() {
function getQueryParam(name) {
// 从 hash 中提取查询参数
const hash = window.location.hash;
const queryIndex = hash.indexOf('?');
console.log('queryIndex', queryIndex);
if (queryIndex === -1) return null;
const queryString = hash.substring(queryIndex + 1);
const reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
const r = queryString.match(reg);
console.log('匹配结果', r);
if (r != null) return decodeURIComponent(r[2]);
return null;
}
const statusBarHeight = getQueryParam('statusBarHeight');
console.log('状态栏高度', statusBarHeight);
if (statusBarHeight) {
const height = parseInt(statusBarHeight, 10);
if (!isNaN(height) && height > 0) {
document.write('<style>' +
'html, body { margin:0; padding:0; height:100%; overflow:hidden; }' +
'body { padding-top: ' + height + 'px; box-sizing: border-box; }' +
'#app { height: 100%; overflow-y: auto; }' +
'</style>');
}
}
})();
// ============ 新增结束 ============
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' : '') + '" />')
<head>
<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>
(function() {
function getQueryParam(name) {
var searchParams = new URLSearchParams(window.location.search);
if (searchParams.has(name)) return searchParams.get(name);
var hash = window.location.hash;
var queryIndex = hash.indexOf('?');
if (queryIndex !== -1) {
var params = new URLSearchParams(hash.substring(queryIndex + 1));
if (params.has(name)) return params.get(name);
}
return null;
}
// 判断是否在小程序Webview环境中
function isInMiniProgram() {
// 更安全的小程序环境判断
try {
return typeof wx !== 'undefined' && wx.miniProgram && wx.miniProgram.getEnv;
} catch (e) {
return false;
}
}
var statusBarHeight = getQueryParam('statusBarHeight');
if (statusBarHeight) {
var height = parseInt(statusBarHeight, 10);
if (!isNaN(height) && height > 0) {
var style = document.createElement('style');
style.textContent =
'html, body { margin:0; padding:0; height:100%; overflow:hidden; }' +
'body { padding-top: ' + height + 'px; box-sizing: border-box; }' +
'#app { height: 100%; overflow-y: auto; }';
document.head.appendChild(style);
}
}
})();
</script>
// 页面加载完成后执行
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>
<link rel="stylesheet" href="./static/font/iconfont.css">
<link rel="shortcut icon" href="./static/suplogo.ico">
</head>
<body>
<div id="app">
<!--app-html-->
</div>
<script type="module" src="/main.js"></script>
</body>
<!-- ===== 2. Viewport ===== -->
<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" />
<title>银盾家办</title>
<link rel="stylesheet" href="./static/font/iconfont.css">
<link rel="shortcut icon" href="./static/suplogo.ico">
</head>
<body>
<div id="app"></div>
<script type="module" src="/main.js"></script>
</body>
</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