fetch 跨域 SpringBoot credentials mode is include setAllowCredentials

最新推荐文章于 2025-07-22 17:14:01 发布

原创最新推荐文章于 2025-07-22 17:14:01 发布 · 3.8k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#跨域 #springboot #fetch

springBoot 专栏收录该内容

4 篇文章

订阅专栏

本文探讨了使用Fetch API时遇到的跨域携带Cookie问题，详细解释了credentials模式为'include'时，后端必须配置CORS允许凭证。提供了两种解决方案：一是移除请求中的credentials配置，二是后端设置CORS允许凭证。

credentials mode is 'include'是请求带cookie

function fetchFn(){
  let myHeaders = new Headers({
        'Access-Control-Allow-Origin': '*',
        'Content-Type': 'text/plain',
        'Cache-Control': 'max-age=10',
    });
    fetch('http://localhost/getData',{
        credentials: 'include',
        // headers: myHeaders,
        mode:"cors",
        // mode:"no-cors",
    }).then(function(response){
        return response.text()
        // response.json().then(res=>console.log(res))
        // response.body.then(res=>{console.log(res.text())})
    }).then(res=>console.log(res))
}

当请求带cookie但是，后端没有配置corsConfiguration.setAllowCredentials(true);就会报这个错。
Access to fetch at 'http://10.10.113.186:30333/meta/system/getFriendsLink?systemName=dsd' from origin 'http://127.0.0.1:53746' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. fetch.html:1 Uncaught (in promise) TypeError: Failed to fetch
解决办法，两种方法，

去掉请求配置credentials: 'include'
添加响应配置corsConfiguration.setAllowCredentials(true);