首页 > 解决方案 > 如何在获取请求中发送自定义 cookie

问题描述

我可以使用未在我的浏览器上设置的“自定义”cookie 发出获取请求吗?

例如:

fetch('/foo', {
  credentials: 'omit', // I don't want to send my real cookies
  headers: {
    cookie: 'foo=bar'
  }
})

使用cookie执行此获取请求时,似乎没有设置标头credentials: 'omit'


我知道我可以保存我当前的 cookie、设置新的 cookie、发出获取请求并恢复 cookie……但是有更好的方法吗?

例如。

const oldCookies = document.cookie
document.cookie = 'foo=bar'
fetch('/foo')
document.cookie = oldCookies

标签: javascriptcookiesfetch

解决方案


同源,浏览器端fetch会一直使用document.cookie.

Cookie头是禁止标头之一,不能在浏览器端以编程方式修改。此规则不适用于服务器端。以下代码可以在https://httpbin.org/页面的 Chrome DevTools Console 上进行测试。至于不同的来源, fetch 不会发送任何 cookie。

创建一个测试 cookie foo=bar

fetch('https://httpbin.org/cookies/set/foo/bar')
.then(response => response.json())
.then(data => console.log(JSON.stringify(data, null, 2)));

测试

fetch('https://httpbin.org/cookies', {
  headers: {
    Cookie: 'xxx=yyy'
  }
}).then(response => response.json())
.then(data => console.log(JSON.stringify(data, null, 2)));

推荐阅读