React不设置cookie，但Postman设置了？

xqnpmsa8 于 2022-11-07 发布在 Postman

关注(0)|答案(2)|浏览(196)

我有一个允许用户登录的Sping Boot 后端。
当我使用postman发送一个json有效负载以登录用户时，它会返回正确的响应，其中包含一个JSESSION的cookie。
Postman details with response and cookie
当我在react（axios）中发送有效负载时，我在任何地方都看不到JSESSION的cookie，但响应仍然正常？

const API_URL = "http://localhost:8080/api/auth/";

login(uniqueId: string, password: string) {
    return axios.post(API_URL + "login", JSON.stringify({
            "uniqueId": uniqueId,
            "password": password
        }), 
        {
            headers: {
                'Content-Type': 'application/json',
                'withCredentials': 'true'
            }
        })
        .then(response => {
            console.log(response);
            return response;
        }).catch(error => {
            return error.response
    });
}

Chrome tab with response and no cookie

postman

来源：https://stackoverflow.com/questions/72029983/react-doesnt-set-cookies-but-postman-does

2条答案

按热度按时间

1aaf6o9v1#

'withCredentials': 'true'应该在headers之外（Request Config documentstion）
在您的情况下，它将是：

const API_URL = "http://localhost:8080/api/auth/";

login(uniqueId: string, password: string) {
    return axios.post(API_URL + "login", JSON.stringify({
            "uniqueId": uniqueId,
            "password": password
        }), 
        {
            withCredentials: true,
            headers: {
                'Content-Type': 'application/json'
            }
        })
        .then(response => {
            console.log(response);
            return response;
        }).catch(error => {
            return error.response
    });
}

另一种解决方案是创建具有参数withCredentials: true（creating axios instance）示例axios。

const BASE_URL = "http://localhost:8080/api/";
const api = axios.create({
baseURL: BASE_URL,
withCredentials: true,
headers: {'Content-Type': 'application/json'}
});

然后您可以执行以下操作：

return api.post("/auth/login", JSON.stringify({
            "uniqueId": uniqueId,
            "password": password
        })) .then(response => {
            console.log(response);
            return response;
        }).catch(error => {
            return error.response
    });

赞(0）回复(0）举报 2022-11-07

gojuced72#

我有同样的问题提到，我也使用withCredentials: true以外的标题。
但仍然， Postman 得到饼干和React应用程序没有。

赞(0）回复(0）举报 2022-11-07