检测用户浏览器并跳转提示 - PHP 代码分析与优化
该代码用于判断用户是否为QQ或微信浏览器,并且开启了QQ跳转,如果是则输出一段HTML代码,用于提示用户在其他浏览器中打开网站。代码中使用了jQuery和ClipboardJS库。
可能存在的bug:
-
代码中没有对变量'$conf['qqjump']'进行判断,如果该变量未定义或为0,则会直接跳过if语句,不会进行任何操作。
-
在判断是否为微信浏览器时,只判断了User-Agent中是否包含'MicroMessenger',没有考虑到可能存在其他浏览器也包含该字符串的情况。
-
在判断是否为QQ浏览器时,只判断了User-Agent中是否包含'QQ/',没有考虑到可能存在其他浏览器也包含该字符串的情况。
-
在使用layer.tips()函数时,没有引入layer库,可能会导致该函数无法使用。
-
在使用document.getElementById()函数时,可能会出现id重复的情况,导致获取到的元素不正确。
优化建议:
-
在使用'$conf['qqjump']'之前,需要先判断该变量是否已定义,并且值是否为1。
-
在判断浏览器类型时,可以使用更加精确的判断方法,例如使用正则表达式匹配User-Agent中的特定字符串。
-
在使用layer.tips()函数之前,需要先引入layer库。
-
在使用document.getElementById()函数时,可以考虑使用更加可靠的获取元素方法,例如使用querySelector()函数。
代码优化示例:
<?php
// 设置QQ跳转
$conf['qqjump'] = 1;
// 判断是否定义了$conf['qqjump']并且值为1
if (isset($conf['qqjump']) && $conf['qqjump'] == 1) {
// 判断是否为QQ或微信浏览器
if (strpos($_SERVER['HTTP_USER_AGENT'], 'QQ/') !== false || strpos($_SERVER['HTTP_USER_AGENT'], 'MicroMessenger') !== false) {
// 获取当前页面URL
$siteurl = 'http://' . $_SERVER['SERVER_NAME'] . ':' . $_SERVER['SERVER_PORT'] . $_SERVER['REQUEST_URI'];
// 输出HTML代码
echo '<html>
<head>
<meta charset='UTF-8'>
<title>使用浏览器打开</title>
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' name='viewport'>
<meta content='yes' name='apple-mobile-web-app-capable'>
<meta content='black' name='apple-mobile-web-app-status-bar-style'>
<meta name='format-detection' content='telephone=no'>
<meta content='false' name='twcClient' id='twcClient'>
<meta name='aplus-touch' content='1'>
<style>
body,html{width:100%;height:100%}
*{margin:0;padding:0}
body{background-color:#fff}
#browser img{
width:50px;
}
#browser{
margin: 0px 10px;
text-align:center;
}
#contens{
font-weight: bold;
margin:-285px 0px 10px;
text-align:center;
font-size:20px;
margin-bottom: 125px;
}
.top-bar-guidance{font-size:15px;color:#fff;height:70%;line-height:1.8;padding-left:20px;padding-top:20px;background:url(//gw.alicdn.com/tfs/TB1eSZaNFXXXXb.XXXXXXXXXXXX-750-234.png) center top/contain no-repeat}
.top-bar-guidance .icon-safari{width:25px;height:25px;vertical-align:middle;margin:0 .2em}
.app-download-tip{margin:0 auto;width:290px;text-align:center;font-size:15px;color:#2466f4;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAcAQMAAACak0ePAAAABlBMVEUAAAAdYfh+GakkAAAAAXRSTlMAQObYZgAAAA5JREFUCNdjwA8acEkAAAy4AIE4hQq/AAAAAElFTkSuQmCC) left center/auto 15px repeat-x}
.app-download-tip .guidance-desc{background-color:#fff;padding:0 5px}
.app-download-btn{display:block;width:214px;height:40px;line-height:40px;margin:18px auto 0 auto;text-align:center;font-size:18px;color:#2466f4;border-radius:20px;border:.5px #2466f4 solid;text-decoration:none}
</style>
</head>
<body>
<div class='top-bar-guidance'>
<p>点击右上角<img src='//gw.alicdn.com/tfs/TB1xwiUNpXXXXaIXXXXXXXXXXXX-55-55.png' class='icon-safari'> <span id='openm'>Safari打开</span></p>
<p>可以继续浏览本站哦~</p>
</div>
<a style='display: none;' href='' id='vurl' rel='noreferrer'></a>
<div id='browser'></div>
<div class='app-download-tip'>
<span class='guidance-desc'>点击上方图标or复制本站网址自行打开</span>
</div>
<script src='https://code.jquery.com/jquery-3.3.1.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js'></script>
<a data-clipboard-text=''.$siteurl.'' class='app-download-btn'>点此复制本站网址</a>
<script type='text/javascript'>
new ClipboardJS('.app-download-btn');
$('.app-download-btn').click(function() {
layer.tips('复制成功,么么哒', '.app-download-btn', {
tips: [3, 'rgb(38,111,250)'],
time:500
});
})
</script>
<script>
function openu(u){
document.getElementById('vurl').href= u;
document.getElementById('vurl').click();
}
var url = window.location.href;
if(navigator.userAgent.indexOf('QQ/')> -1){
$('html').on('click',function(){
openu('ucbrowser://'+url);
openu('mttbrowser://url='+url);
openu('baiduboxapp://browse?url='+url);
openu('googlechrome://browse?url='+url);
openu('mibrowser:'+url);
openu('taobao://'+url.split('://')[1]);
openu('alipays://platformapi/startapp?appId=20000067&url='+url);
});
}else if(navigator.userAgent.indexOf('MicroMessenger') > -1){
if(navigator.userAgent.indexOf('Android') > -1){
var iframe = document.createElement('iframe');
iframe.style.display = 'none';
document.body.appendChild(iframe);
}
}
</script>
</body>
</html>';
exit;
}
}
?>
补充说明:
- 以上优化建议仅供参考,具体实现方式可能需要根据实际情况进行调整。
- 为了更加安全可靠,建议对用户输入进行必要的过滤和验证。
- 对于代码中的错误提示,可以使用更加友好的方式进行处理。
原文地址: https://www.cveoy.top/t/topic/jqjf 著作权归作者所有。请勿转载和采集!