ie和chrome针对localhost跨域的差异

最新推荐文章于 2024-07-03 08:32:37 发布

nothing_more_than

最新推荐文章于 2024-07-03 08:32:37 发布

阅读量2.2k

点赞数

分类专栏：前端之路

本文链接：https://blog.csdn.net/txyzqc/article/details/96274412

版权

前端之路专栏收录该内容

38 篇文章 1 订阅

订阅专栏

我相信即使到现在我对跨域也没有完全掌握。

跨域是浏览器行为
跨域的请求其实是会被发送到服务器端的
服务器端可以通过cors来解决客户端的跨域问题
nginx配置反向代理解决跨域问题
协议、域名、端口都考虑进来，比如http://11.11.11.11:8888/index.html访问http://11.11.11.11:8899/interface就会有跨域问题

这些都是常识，我今天要说的是我发现的一个ie和chrome上的差异，是针对上面最后一条的，域名是localhost的情况下。下面就让我言归正传吧。

先说结论：

再chrome下，http://localhost:8888/index.html访问http://localhost:8899/interface会有跨域问题，而在ie下就不会。

我怎么证明呢？
写了下面简单的node程序

// server.js
// 需要安装npm i --save express cookie-parser
var express = require('express');
var cookieParser = require('cookie-parser');
var app = express();

app.use(cookieParser());
app.all('*', function(req, res, next) {
	res.header('Access-Control-Allow-Origin', '*');
	res.header('Access-Control-Allow-Headers', 'X-Requestd-With');
	res.header('Access-Control-Allow-Method', 'PUT, POST, GET, DELETE, OPTIONS');
});
app.get('/', function(req, res) {
	console.log('Cookies:', req.cookies);
	res.cookie('newdate', new Date(), {maxAge: 600000});
});
app.listen(8888);

// index.html
// 需要安装npm i --save-dev http-server，用来host index.html页面
<!doctype html>
<html
	<head></head>
	<body>
		<button id="btn">click</button>
		<script>
			var btn = document.getElementById('btn');
			btn.onclick = function() {
				var xhr = new XMLHttpRequest();
				xhr.open('http://localhost:8888');
				xhr.send();
			}
		</script>
	</body>
</html>

http://localhost:8888在每次接到请求时，都会把cookie打印出来，便于观察。
其实这个发现也没有太多的用处，只是想记录一下:)