我正在尝试在使用 GraphQL 和 Apollo 时在 React 中设置一个 httpOnly cookie。这或多或少是我的 React 组件的样子:
const verifyEmail = () => {
const [showMessage, setShowMessage] = useState(true);
const [text, setText] = useState("Loading... Do not close.");
const { data, error } = useQuery(VERIFY_EMAIL);
useEffect(() => {
if (error) {return setText(genericErrorMessage)}
if (data) {
const cookies = new Cookies();
cookies.set("token", data.verifyEmail.token, {
expires: data.verifyEmail.expiry,
secure: (process.env.SECURE_COOKIE === "true"),
httpOnly: true,
path: "/"
})
return setText(data.verifyEmail.message);
}
}, [error, data])
return (
<div>
{showMessage && (<ShowMessage setShowMessage={setShowMessage} text={text] />)}
</div>
)
}
这里的想法是使用来自 GraphQL api 的响应数据来设置 cookie。但是,每当我尝试这样做时,都会收到以下错误:“Cookie 'token' 已被拒绝,因为已经有一个 HTTP-Only cookie 但脚本试图存储一个新的”。也许我收到此错误是因为无法通过 JavaScript 访问 httpOnly cookie,而 React 是在用户浏览器中运行的 JavaScript 框架。无论如何,我想知道是否有办法实现这一点。我见过网上有人使用 express 和 axios 来做这件事,但没有使用 GraphQL 查询和 Apollo 客户端。我目前的解决方案是将 httpOnly 选项设置为 false。