node.js带cookie的跨域请求

最近在做vue的项目用node.js写的后台接口,在接数据的时候出现一个跨域的问题,后来想了很久才发现在自己封装的axios请求中设置了传入后台需要带cookie凭证,在默认情况下请求浏览器不会携带凭证信息,而我在每次的请求中都带有cookie,因此每一次的请求都会被浏览器拦截。在这里,前端使用的端口号为8080,后端为8088。
报错信息如图显示:
在这里插入图片描述这里报错的意思是当请求的凭证模式为‘include’时,响应中的‘Access-Control-Allow-Origin’报头的值不能是通配符‘*’。XMLHttpRequest发起的请求的凭据模式由withCredentials属性控制。

以下是封装的axios
node.js带cookie的跨域请求_第1张图片withCredentials这里设置了true,让每次请求都带有cookie凭证

解决方法有三种:
方法一:我这里使用的是axios可以把withCredentials设置为false,这样每一次的请求就不会带上cookie凭证 (并不推荐使用, cookie是用来辨别用户的一个凭证,大家都知道http是无状态的,每次请求都是独立的,是没办法直接判断某个请求是否是同一个用户发起, 这时候cookie就起作用的,当用户第一次登陆这个网站的时候可以在响应头设置一个cookie, 下次用户在发起http请求就会自动带上这个cookie,服务器就可以通过这个cookie来找到这个用户的信息。)

方法二:
在后端使用cros中间件

//需要安装并且引入中间件cors
const cors = require('cors');

var corsOptions = {
     
  origin: 'http://localhost:8080',
  credentials: true,
  maxAge: '360000'
  //这一项是为了跨域专门设置的
}
app.use(cors(corsOptions))
//设置跨域

方法三:不适用中间件,设置请求头部
node.js带cookie的跨域请求_第2张图片Access-Control-Allow-Origin不能是*号.。设置成请求的来源,然后Access-Control-Allow-Credentials设置为ture, 这样浏览器就不会拦截服务器设置的cookie了。

你可能感兴趣的:(node.js,js,cookie,nodejs,vue)