最近折腾VUE,数据请求使用axios,后台开启了cors,但是IE9 IE8却不支持
谷歌了,百度了
都通篇一律说xmlhttprequest在IE9 IE8下不支持CORS
查到的信息都是xdomainrequest可以替代xmlhttprequest在IE9 ie8上执行
但是我使用的时候却无法把数据发送给后台,搞不明白哪里错了。
我甚至去看了ActiveXObject
可惜他只能在IE6 IE5上运行
用vue-cli在IE上调试实在麻烦,我开了一个新的html来测试,结果突然发现可以在IE9上运行了。只是公司项目的接口报
“Unhandled promise rejection Error: 拒绝访问。”让人纠结
掘金有篇文章说这个报错是IE兼容问题点击访问,让人纠结
后面继续跟进.............敬请期待....
下面是可以访问到接口的代码(包含前后端页面,当前页面是http协议,请求的接口也是http协议)
- 如果当前页面的协议是https,请求接口协议是http的时候,会导致报错“
拒绝访问” - 如果当前页面的协议是https,请求接口协议是https的时候,会导致报错“
拒绝访问”
html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<a href="http://localhost:8011/">跳转官网</a>
<script>
// var xdr = new XDomainRequest()
// xdr.open('POST', 'https://pft6.com/ingame/loginBBINV2.do', true)
// xdr.onload = function () {
// alert(xdr.responseText);
// }
// xdr.send('gpkey=""&page_site="live"')
//IE8 IE9 cors支持
var appliance;
// if(window.XDomainRequest){
// appliance = new window.XDomainRequest()
// }
//else{
appliance = new window.XMLHttpRequest();
//}
appliance.onprogress = function () { }; // no aborting
appliance.ontimeout = function () {
alert("timeout")
}; // "
appliance.onload = function (e) {
// do something with appliance.responseText
alert("onload:" + appliance.responseText)
};
appliance.onerror = function (e, b) {
// error handling
alert("error" + JSON.stringify(e) + JSON.stringify(b))
};
//appliance.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
// appliance.withCredentials = true; // to support sending cookies with CORS
//a21662cd-e0ee-49d6-89c7-3963e03e5501
appliance.open("POST", 'http://localhost:3000/cors');
if (typeof XMLHttpRequest != 'undefined') {
appliance.setRequestHeader("Content-Type", "application/json; charset=utf-8");
//appliance.setRequestHeader("Content-Type",'application/x-www-form-urlencoded');
//text/plain
// appliance.setRequestHeader("Content-Type",'text/plain; charset=utf-8');
}
//'username=duke888&password=12345678'
//appliance.send("accesstoken=a21662cd-e0ee-49d6-89c7-3963e03e5501&topic_id=5b07806f57137f22415c463b");
//JSON.stringify({username:"duke888",password:"12345678"})
setTimeout(function () {
// appliance.send(JSON.stringify({username:"duke888",password:"12345678"}));
appliance.send(JSON.stringify({username:"duke888",password:"12345678"}));
}, 0)
</script>
</body>
</html>
nodejs:
var express = require('express');
var app = express();
var bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({
extended: true
}));
// parse application/json
app.use(bodyParser.json())
//设置跨域访问
app.all('*', function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, Connection, User-Agent, Cookie");
res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
res.header("X-Powered-By",' 3.2.1')
res.header("Content-Type", "application/json;charset=utf-8");
next();
});
app.post('/cors', function (req, res) {
console.log(req.body);
res.send('POST request to the homepage');
});
app.get('/', function(req, res) {
res.send('hello world');
});
app.listen(3000);
console.log('Listening on port 3000...');