1、因为vue-router
对于ie9
默认是退回到hash
模式的,所以在new router
的时候,需要设置fallback:false
(默认值为true
)
首先
mode:'history'
在IE9
下是不能使用的,如果是IE9
,会变成hash
的模式(在2项满足fallback:true
条件后)如果使用
fallback
(跟mode
同一级别的属性,该属性默认为true
)属性:
true
:当在IE9
下默认变成hash
false
:强制使用history
方式,此方式对于可以手动输入url
,后台不做严格要求的网站是可行的,如果有严格要求,请看3有些网页不能使用输入
Url
的方式访问,后端也会对url做验证,这个时候不妨就让他变成hash
模式,无非就是加个#的问题,不过需要注意的是,有些a
标签的herf
属性设置成#就会刷新整个页面的,我对这个问题的解决办法是:
1)删除herf
属性 2)给a
标签添加CSS:cursor: pointer;
const router = new Router({
fallback: false,
base: "/test/",
mode: "history",
routes: []
})
2、跨域
尽管后端已经配置了CORS
,但是在ie9
情况下,CORS
无效,所以需要nginx
设置反向代理.
参考:vue
项目部署方式:tomcat
部署和nginx
部署
3、设置了nginx
反向代理仍然无法获取response.data
设置了反向代理,正常发出和获取响应,但是
response.data
却为空值,响应值被存到response.request.responseText
中.这时候要利用axios.interceptors.response
适当添加兼容代码:
Axios.interceptors.response.use(
function(response) {
//判断是否有是ie9
if (isIE9()) {
//特殊处理response
if (response.status == 200 && response.request) {
if (
response.request.responseType === "json" &&
response.request.responseText
) {
response.data = JSON.parse(response.request.responseText);
console.log("repsonse", response);
}
}
}
return response;
},
function(error) {
if (error.response) {
// 对响应错误做点什么
console.log("error", error);
return Promise.reject(error);
}
);
function isIE9() {
if (
navigator.appName == "Microsoft Internet Explorer" &&
parseInt(
navigator.appVersion
.split(";")[1]
.replace(/[ ]/g, "")
.replace("MSIE", "")
) <= 9
) {
return true;
}
return false;
}
参考:https://juejin.im/post/5b2868b46fb9a00e6f65f87e
参考:https://blog.csdn.net/weixin_34081595/article/details/86950953