最近在使用fetch向服务器发送请求,过程中的体会和遇到的问题在这里记录一下。
fetch返回的是一个Promise对象,我们可以对返回的结果做进一步的处理,这是与传统ajax的一个区别。
简单的请求写法如下:
fetch(url) .then(res => res.json()) .then(json => { console.log(json); })
也可以设置method、headers、body等参数,详见fetch api。
----------------------------------------------------------------------------------------------
接下来主要是关于fetch的一个坑,那就是fetch默认不会携带cookie。
我们在做判断用户是否已登录等权限问题的时候,有一种做法(这里以express-session为例)是用户登录时将信息存入session
req.session.user = user;
此时,服务端会发送给客户端相应的cookie
之后,来自客户端的每一个请求,都会带有这个cookie
而服务端通过这个cookie得到req.session.user(如果没有cookie,那么req.session.user === undefined),便可判断用户是否已登录
if (!req.session.user) { console.log("未登录"); }
使用fetch发送请求的我就这样掉坑里了。
想要解决这个问题其实很简单,那就是在参数里加一个字段credentials: true,如:
fetch(url, { method: ‘GET‘, credentials: ‘include‘ })
这样,在一般情况下应该是没问题了,没错,还有特殊情况,那就是跨域。
如果我们进行的是跨域请求而且是用CORS(对CORS不了解的可以看看这个)来处理的,那么我们就需要在服务端设置一些字段,比如:
‘Access-Control-Allow-Origin‘, ‘http://localhost:8080‘, // 不能使用*,必须指定域名,大概是出于安全考虑 ‘Access-Control-Allow-credentials‘, ‘true‘ // 表示允许发送cookie到服务端
到此为止问题就解决了。
如有不对,烦请指正
时间: 2024-11-10 00:18:01