::: tip withCredentials
XMLHttpRequest.withCredentials 属性是一个布尔值,它指示了是否该使用类似 cookie、Authorization 标头或者 TLS 客户端证书等凭据进行跨站点访问控制(Access-Control)请求。设置 withCredentials 对同源请求是无效的。
:::
此外,这个标志还用于指示何时在响应中忽略 cookie。默认值是 false。除非在发送 XMLHttpRequest 请求之前,将 withCredentials 设置为 true,否则来自不同域的 XMLHttpRequest 响应无法为自己的域设置 cookie 值。而通过设置 withCredentials 为 true 获得第三方 cookie,仍将遵循同源策略,因此请求的脚本无法通过 document.cookie 或者响应标头访问。
::: tip 备注
永远不会影响到同源请求。
不同域下的 XmlHttpRequest 响应,不论其 Access-Control- 标头设置什么值,都无法为它自身站点设置 Cookie 值,除非它在请求之前将 withCredentials 设为 true。
:::
withCredentials
属性之后开启访问跨域访问失效在axios发送请求之前设置的withCredentials属性为true
之后,如果服务器端开启了跨域但不是指定域名跨域而是设置了Access-Control-Allow-Origin', '*'
,此时在浏览器访问该接口会报错
::
const service = axios.create({
baseURL: process.env.VUE_APP_BASE_API, // 环境变量base接口地址 url = base url + request url
withCredentials: true, // 跨域请求时发送Cookie
timeout: 60000, // 请求超时
headers: {
"Content-Type": "application/json; charset=UTF-8;"
}
});
Access-Control-Allow-Credentials 头 工作中与XMLHttpRequest.withCredentials 或Fetch API中的Request() 构造器中的credentials 选项结合使用。Credentials必须在前后端都被配置(即the Access-Control-Allow-Credentials header 和 XHR 或Fetch request中都要配置)才能使带credentials的CORS请求成功。
https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest/withCredentials
:grinninggrinning:
文章标题:axios 中配置withCredentials引发的问题
文章作者:未知用户
文章链接:[复制]
最后修改时间:2024年 01月 16日 18时26分
商业转载请联系站长获得授权,非商业转载请注明本文出处及文章链接,您可以自由地在任何媒体以任何形式复制和分发作品,也可以修改和创作,但是分发衍生作品时必须采用相同的许可协议。 本文采用CC BY-NC-SA 4.0进行许可。
Copyright © 2023--2025
豫ICP备2022014268号-1
我们历经沧桑,这样错过了一生最好的时光,错过了便是永远