我的项目是在app.vue文件的created下进行判断(根据个人需求来写)
1.定义browser,通过以下方法可以判断很多浏览器。包括判断IE浏览器,Opera浏览器,苹果浏览器,谷歌浏览器,火狐浏览器等。
2.以下代码,注释中表明了通过JS如何判断是否在微信浏览器打开,或是否在QQ空间浏览器、是否在新浪微博打开等。在微信端打开,就重定向处理。
3.附上代码
created() {
// 微信授权;
let code = this.getQueryString('code');
if (code) {
// 微信授权
this.getWXShowQuan(code);
} else {
var browser = {
versions: (function () {
var u = navigator.userAgent;
return {
//移动终端浏览器版本信息
trident: u.indexOf('Trident') > -1, //IE内核
presto: u.indexOf('Presto') > -1, //opera内核
webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或uc浏览器
iPhone: u.indexOf('iPhone') > -1, //是否为iPhone或者QQHD浏览器
iPad: u.indexOf('iPad') > -1, //是否iPad
webApp: u.indexOf('Safari') == -1, //是否web应该程序,没有头部与底部
};
})(),
language: (
navigator.browserLanguage || navigator.language
).toLowerCase(),
};
//当前链接地址
let search = window.location.search,
origin = window.location.origin;
let redirect_uri = encodeURIComponent(`${origin}${search}`);
//判断打开的终端
if (browser.versions.mobile) {
var ua = navigator.userAgent.toLowerCase(); //获取判断用的对象
if (ua.match(/MicroMessenger/i) == 'micromessenger') {
//在微信中打开
window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxxxxxxxxxafd&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_userinfo&state=123#wechat_redirect`;
}
if (ua.match(/WeiBo/i) == 'weibo') {
//在新浪微博客户端打开
}
if (ua.match(/QQ/i) == 'qq') {
//在QQ空间打开
}
if (browser.versions.ios) {
//是否在IOS浏览器打开
// alert('ios');
}
if (browser.versions.android) {
//是否在安卓浏览器打开
// alert('Android');
}
} else {
alert('pc');
//否则就是PC浏览器打开
}
return;
}
},
getQueryString写在method里的方法,获取链接地址的某个值。
getQueryString(n) {
let r,
reg = new RegExp('(^|&)' + n + '=([^&]*)(&|$)');
r = window.location.search.substring(1).match(reg);
return r ? decodeURI(r[2]) : null;
},