IE9 cors 兼容

最近折腾VUE，数据请求使用axios，后台开启了cors，但是IE9 IE8却不支持

谷歌了，百度了

都通篇一律说xmlhttprequest在IE9 IE8下不支持CORS

查到的信息都是xdomainrequest可以替代xmlhttprequest在IE9 ie8上执行

但是我使用的时候却无法把数据发送给后台，搞不明白哪里错了。

关于xdomainrequest：

我甚至去看了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...');

猜你喜欢