近期,偶这样一个需求,因为在OA系统中添加了一个本系统的入口,而用户只能在IE浏览器下登录OA,虽然做了系统的IE兼容处理,但终归体验不好,需要从IE下自动打开谷歌浏览器,进行系统访问,其中由于OA的登录用户已在本系统中,所以需要已登录OA的用户在点击本系统入口跳转谷歌浏览器时,不用再次登录。
在public的index.html里加入下面这段代码:
<script type="text/javascript">
window.onload = function () {
//如果用户使用IE浏览器,则跳转到Chrome浏览器以获取最佳体验
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否是IE11以下版本的浏览器
var isIE11 = userAgent.indexOf("Trident") > -1 && userAgent.indexOf("rv:11.0") > -1;//判断是否是IE11浏览器
var isEdge = userAgent.indexOf("Edg") > -1 && !isIE; //判断是否IE的Edge浏览器
if(isIE||isIE11) {
var objShell = new ActiveXObject("WScript.Shell");
var x = getChromePath(objShell);
if (!x) {
alert('当前没有Chrome浏览器,请先安装Chrome浏览器');
} else {
//用chrome的路径打开url的命令
//如果打开的链接有&之类的dos特殊符号,需要特殊处理^是对特殊符号<,>,&的前导字符,在命令中他将以上 3 个符号的特殊功能去掉
var cmd = 'cmd /c "' + x + '\\chrome.exe" ' + window.location.href;
objShell.Run(cmd, 0, true);
window.opener=null;
window.open('','_self');
window.close();
}
}
}
//获取谷歌浏览位置
function getChromePath(objShell) {
var regPath = [
'HKEY_LOCAL_MACHINE\\SOFTWARE\\WOW6432Node\\Microsoft\\Windows\\CurrentVersion\\Uninstall\\Google Chrome\\InstallLocation',
'HKEY_LOCAL_MACHINE\\SOFTWARE\\Microsoft\\Windows\\CurrentVersion\\Uninstall\\Google Chrome\\InstallLocation',
'HKEY_CURRENT_USER\\Software\\Microsoft\\Windows\\CurrentVersion\\Uninstall\\Google Chrome\\InstallLocation',
'HKEY_CURRENT_USER\\Software\\WOW6432Node\\Microsoft\\Windows\\CurrentVersion\\Uninstall\\Google Chrome\\InstallLocation',
'HKEY_LOCAL_MACHINE\\SOFTWARE\\Microsoft\\Windows\\CurrentVersion\\App Paths\chrome.exe\\Path',
'HKEY_CURRENT_USER\\Software\\Microsoft\\Windows\\CurrentVersion\\App Paths\\chrome.exe\\Path',
];
// 判断是否安装谷歌浏览器
for (var i = 0; i < regPath.length; i++) {
try {
var x = objShell.regRead(regPath[i]);
if (x) {
return x;
}
} catch (e) {}
}
return undefined;
}
</script>
此段代码运行时,可能会报错,还需更改IE浏览器配置,步骤如下:
上述代码也可放在需要跳转显示的页面下,由于有自动登录功能,所以在OA到本系统登录验证token的那一步,拿到token,进行缓存,跳转页面连接加token
let tempToken = res.data.access_token
Cookies.set("id_token", id_token);
setToken(res.data.access_token);
setExpiresIn(res.data.expires_in);
/** 如果用户使用IE浏览器,则跳转到Chrome浏览器以获取最佳体验*/
let userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
let isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否是IE11以下版本的浏览器
let isIE11 = userAgent.indexOf("Trident") > -1 && userAgent.indexOf("rv:11.0") > -1;//判断是否是IE11浏览器
let isEdge = userAgent.indexOf("Edg") > -1 && !isIE; //判断是否IE的Edge浏览器
if(isIE||isIE11) {
let objShell = new ActiveXObject("WScript.Shell");
let x = this.getChromePath(objShell);
if (!x) {
alert('当前没有Chrome浏览器,请先安装Chrome浏览器');
} else {
//用chrome的路径打开url的命令
//如果打开的链接有&之类的dos特殊符号,需要特殊处理^是对特殊符号<,>,&的前导字符,在命令中他将以上 3 个符号的特殊功能去掉
let url = window.location.origin+'/iems/index/index?id_token='+tempToken
let cmd = 'cmd /c "' + x + '\\chrome.exe" ' + url;
objShell.Run(cmd, 0, true);
window.opener=null;
window.open('','_self');
window.close();
}
}
vue项目在路由守卫那块进行判断是否有token或者to.query.id_token
let sysToken = null
if(getToken()){
sysToken = getToken()
}else if(to.query.id_token){
sysToken = to.query.id_token
setToken(sysToken);
setExpiresIn(720);
}else{
sysToken = null
}
至此,解决完毕