是否可以在Next.js中设置服务器端cookie

Question

在我的Next.js应用程序中，我需要从URL中获取一些参数，并使用它们来设置服务器端cookie。

但我甚至不确定我是否可以用这种方式设置服务器端cookie。这可能吗？如果是，任何提示或建议都将不胜感激。

Answer 1

通过命令npm i cookies next下一步使用cookies

服务器端示例

import React from 'react'
import { getCookies, getCookie, setCookies, removeCookies } from 'cookies-next';
const Home = () => {
return (
<div>page content</div>
)
}
export const getServerSideProps = ({ req, res }) => {
setCookies('test', 'value', { req, res, maxAge: 60 * 6 * 24 });
getCookie('test', { req, res});
getCookies({ req, res});
removeCookies('test', { req, res});
return { props: {}};
}
export default Home

客户端示例

import { getCookies, setCookies, removeCookies } from 'cookies-next';
// we can use it anywhere
getCookies();
getCookie('key');
setCookies('key', 'value');
removeCookies('key');

有关详细信息，请参阅https://www.npmjs.com/package/cookies-next

Answer 2

接下来的应用程序不像通常的服务器应用程序那样工作。尽管如此，您可以像使用DBaaS一样创建自定义流。或者，如果你只想限制客户端访问该cookie，我认为可以用httponly标志来保留它们(你应该是决定的人(。通过这种方式，您只能在服务器上读取cookie。

以下是NextJs无服务器API端点的示例用法：

export default async function handler(
req: NextApiRequest,
res: NextApiResponse<Data>
) {
const { yourParameter } = req.query;
res.setHeader("set-cookie", `yourParameter=${yourParameter}; path=/; samesite=lax; httponly;`)
res.redirect('/');
}

您可以将相同的逻辑应用于getServerSideProps回调或服务器上运行的其他位置。