从axios响应头中获取Set-Cookie值

Question

我正在使用VueJS和Axios发送这样的请求：

 axiosAPI.get('/login/flows', {params: {id: 'string'}})
            .then(res => {
                console.log('cookie', res.headers)
             }

服务器会回复我这个响应：

Access-Control-Allow-Credentials: true
Access-Control-Allow-Origin: *
Access-Control-Expose-Headers: Content-Type
Cache-Control: private, no-cache, no-store, must-revalidate
Content-Length: 646
Content-Type: application/json; charset=utf-8
Date: Thu,xxxx 13:56:21 GMT
Set-Cookie: csrf_token=Lxv3zynm1Fua0hU0/W1+R2w=; Path=/.ory/kratos/public/; Domain=x.y ; Max-Age=31536000; HttpOnly; SameSite=Lax
Vary: Origin
Vary: Cookie

如您所见，服务器在 Set-Cookies 中发送了 csrf-token。但是，当我尝试打印出头信息并存储 csrf-token 时，我无法得到它。此外，浏览器根本不会在存储部分中存储该令牌。

我需要在此 cookie 中使用 csrf-token，但我不知道如何做到这一点？

注意：我没有任何后端代码访问权限。

- ali forooghie

---

这很可能是因为它是一个HttpOnly cookie，这意味着出于安全考虑，它不应该被JavaScript访问。请重新放回图片，因为它有助于问题的解决。 - captainskippah

谢谢您的回答。我已经更新了我的问题，并附上了一个头部响应的示例。 - ali forooghie

请问您需要做什么事情，以至于需要自己获取csrf令牌的值呢？ - captainskippah

我想提交一个登录请求，需要将这个CSRF令牌添加到我的负载请求中。 - ali forooghie

如果您从浏览器发送请求，除非您将其发送到不同的域，否则Cookie会自动包含在其中。我认为重用CSRF令牌不是一个好主意。 - captainskippah

Answer 1

这种方法是可行的，但如果是HttpOnly cookie，应该在服务器端处理：

const res = await axios....;
const cookieName = '...';

const cookie = (res.headers['set-cookie'] as string[])
    .find(cookie => cookie.includes(cookieName))
    ?.match(new RegExp(`^${cookieName}=(.+?);`))
    ?.[1];

- Vasily

---

谢谢。对我来说，简短的回答已经足够了。res.headers['set-cookie'] - ofir_aghai

Answer 2

也许你可以使用axios-cookiejar-support。

https://www.npmjs.com/package/axios-cookiejar-support

一篇介绍如何使用它的中等文章。

https://medium.com/@adityasrivast/handling-cookies-with-axios-872790241a9b

示例（从登录页面获取 cookie）：

const axios = require('axios');
const wrapper = require('axios-cookiejar-support').wrapper;
const CookieJar = require('tough-cookie').CookieJar;

const jar = new CookieJar();
const client = wrapper(axios.create({ jar }));

const url = '<your url>';

const params = new URLSearchParams();
params.append('username', '<username>');
params.append('password', '<password>');
client.post(`${url}/Login`, params, {
  headers: {
    'Accept': '*/*'
  }
})
.then(function (response) {
  console.log(response);
})
.catch(function (error) {
  console.log(error);
});

- Rodrigo Matias

---

我使用 axios-cookiejar-support 与 Node.js 和 serverless 进行登录，然后使用 cookie 会话进行一系列请求。它运行良好！ - Claudio Moscoso

Answer 3

使用此方法将获取该标题的完整字符串：

const cookieHeaders = res.headers['Set-Cookie'];

接下来，您可以使用以下代码将字符串拆分为数组：

cookieHeaders.split('; ');

在数组中，您可以获取您所需的特定元素。

- JustLurkingAround

---

这个不起作用。虽然服务器正在发送cookie，但它并未出现在axios响应头对象中。 - geoidesic