Set-Cookie header 未通过 Azure 函数传递

Question

我正在尝试编写一个 Azure Function 它将在用户的浏览器中设置一个 HttpOnly cookie，但它不起作用。 在Postman中可以看到响应中的Set-Cookie header，但是在浏览器中测试function时省略了这个header。

以下是返回给浏览器的标头： headers: {content-length: "13", content-type: "text/html; charset=utf-8"}

这是我的代码：

Azure Function 代码

module.exports = function (context, req) {
  context.log('JavaScript HTTP trigger function processed a request.');

  context.res = {
    status: 200,
    headers: {
      "Content-Type": "text/html",
      "Set-Cookie": "a=b; httpOnly",
    },
    
    body:
      'Body Response'
  };
  context.done();
}

节点代码

const createCookieAzure = () => {
  return new Promise((resolve, reject) => {

    console.log("Inside create cookie promise");

    axios({
      url: 'http://localhost:7071/api/SetHttpOnlyCookie',
      method: 'GET',
    })
      .then((res) => {
        console.log(res);
      })
      .catch((err) => {
        console.log(err);
      });
  })
}

const createHttpOnlyCookie = async (e) => {
  e.preventDefault();
  console.log("Button clicked");
  await createCookieAzure();
  console.log("After createcookie");
}

在上面的代码中，createHttpOnlyCookie() 是由按钮组件的 onClick 触发的。

Answer 1

对于这个问题，我认为你需要先检查浏览器中是否创建了cookie。 您可以go到您的浏览器“设置”-->搜索“cookie”-->“Cookies和站点数据”-->“查看所有cookies和站点数据”-->然后搜索你的cookie。

我想当你通过 axios 请求 function 时，它不会将 cookie 添加到你的浏览器，因为在 api 中设置 cookie 并在 axios 中请求它与浏览器请求不同（如果浏览器中已添加 cookie，则一切正常，请忽略其余部分）。 如果您在浏览器中找不到 cookie，我认为您需要在axios请求中添加另一个 header，如下代码所示：

axios({
  method: 'get',
  url: '....',
  headers: {'header1': value}
})