uniapp暂不支持自定义webview所以我们用自带的error
首先在根目录新建生成此文件hybrid/html/error.html
在manifest.json(源码试图)中配置error,必须在app-plus下(这里要注意路径问题否则页面会找不到)
error页面是一个单独页面不支持upx,rem在移动端也不生效(尚不知原因),我直接用的px
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="HandheldFriendly" content="true" />
<meta name="MobileOptimized" content="320" />
<title>Error</title>
<script type="text/javascript">
var ab_ = {
plusReady(callback) {
if (window.plus) {
callback()
} else {
document.addEventListener('plusready', callback)
}
}
}
ab_.plusReady(function() {
var native
var center
try {
native = plus.os.name.toLowerCase()
if (native === 'android') {
center = plus.android.importClass("com.absir.uniplugin.AbCenter").ME()
} else if (plus.ios) {
center = plus.ios.importClass("AbCenter").ME()
}
} catch (e) {
console.error(e)
}
ab_.native = native
ab_.center = center
ab_.postEvent = function(event, paras) {
if (center) {
if (native === 'android') {
center.postEvent(event, paras)
} else {
plus.ios.invoke(center, 'postEvent:paras:', event, paras)
}
return true
}
}
plus.key.addEventListener('backbutton', function() {
backClick()
}, false)
})
function backClick() {
(history.length == 1) && closeClick();
var c = setTimeout(function() {
closeClick();
}, 1000);
window.onbeforeunload = function() {
clearTimeout(c);
}
history.go(-2);
}
function closeClick() {
ab_.postEvent('message', 'backProj')
}
function restartClick() {
plus.runtime.restart()
}
</script>
<style>
* {
-webkit-user-select: none;
}
html,
body {
margin: 0px;
padding: 0px;
width: 100%;
height: 100%;
text-align: center;
word-break: break-all;
-webkit-touch-callout: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.button {
width: 60%;
font-size: 18px;
font-weight: normal;
text-decoration: none;
text-align: center;
padding: .5em 0em;
margin: .5em auto;
color: #333333;
border-radius:22px;
/* background-color: #EEEEEE;
border: 1px solid #CCCCCC;
-webkit-border-radius: 5px;
border-radius:22px; */
}
.button:active {
background-color: #CCCCCC;
}
.back{
color: #6767EA;
border: 1px solid #6767EA;
}
.reload{
color: #fff;
border: none;
background: linear-gradient(to right, #6767EA, #75ACFF);
margin-left: 60upx;
}
</style>
</head>
<body>
<div style="width:100%;height:20%;"></div>
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="84px" height="94px" viewBox="0 0 84 94" enable-background="new 0 0 84 94" xml:space="preserve"> <image id="image0" width="84" height="94" x="0" y="0"
href="你的svg" />
</svg>
<p style="font-size:18px;font-weight:bolder;">抱歉,没有找到您请求的页面</p>
<p id="info" style="font-size:12px;"></p>
<!--<div class="button" onclick="history.back()">Retry</div>-->
<div class="button back" onclick="backClick()">返回</div>
<div class="button back" onclick="closeClick()">关闭</div>
<div class="button reload" onclick="restartClick()">刷新</div>
</body>
</html>
版权声明:本文为weixin_43073383原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。