Cookies 为nextJS中的Cookie创建HOC（高阶组件）

所以我在我的nextJS应用程序中创建身份验证逻辑。我创建了/api/auth/login页面，在这里我处理reqest，如果用户的数据是好的，我创建了一个带有JWT令牌的httpOnly cookie，并将一些数据返回到前端，这部分工作正常，但我需要一些方法来保护一些页面，以便只有登录的用户才能访问它们，我在为此创建一个HOC时遇到了问题。 我看到的最好的方法是使用getInitialProps，但在NextJS网站上，它说我不应该再使用它了，所以我想放弃使用getServerSideProps，但这也不起作用，或者我可能做错了什么

这是我的HOC代码： （cookie存储在“userToken”名称下）

---

如果您对如何使用Cookie处理nextJS中的auth有任何其他想法，我将非常感谢您的帮助，因为我是服务器端渲染/auth的新手，您应该将您的HOC逻辑与

getServerSideProps

分开。例如，您可以拥有一个HOC函数，该函数将接受另一个函数（您的

getServerSideProps

），并在未设置

userToken

时重定向到您的登录页面

导出功能需要重新验证（gssp）{
返回异步（上下文）=>{
const{req，res}=上下文；
const token=getUserToken（req.headers.cookie）//添加逻辑以从'req.headers.cookie'提取令牌`
如果（！令牌）{
//重定向到登录页面
res.statusCode=302；
res.setHeader（'Location'，'/admin/login'）；
返回；
}
return wait gssp（context）；//继续调用`getServerSideProps`逻辑
}
}

然后，您可以通过包装

getServerSideProps

函数在页面中使用它

//页面/index.js（或其他页面）
export const getServerSideProps=requireAuthentication（上下文=>{
//这里是您的正常“getServerSideProps”代码
})

谢谢您的帮助！尽管我还有另一个问题，我无法在“getServerSideProps”中获取cookie，但我尝试了req.cokies.userToken，以及nookies或cookie之类的npm包，但没有任何效果。我得到了上下文对象，但是当我访问req.cookies时，如果我在浏览器上看到cookie，就会出现一个get and empty object事件。我以前没有得到这个问题，因为我的解决方案还没有解决，所以我认为这与此有关。您需要使用

req.headers.cookie

来访问cookies字符串。然后需要解析字符串，从中检索

userToken

。更新了我的答案以反映这一点。好吧，我的req.headers中甚至没有cookie对象。我只是启动了一个新线程，因为我不确定这是否与您的答案相关，但非常感谢您的帮助！HOC将只传递发送给它的内容，因此它本身不应该是一个问题。我已经在本地对它进行了测试，我可以看到cookie被传递到HOC内部的

req.headers.cookie

。

import React from 'react';
const jwt = require('jsonwebtoken');

const RequireAuthentication = (WrappedComponent) => {

  return WrappedComponent;
};


export async function getServerSideProps({req,res}) {
  const token = req.cookies.userToken || null;

// no token so i take user  to login page
  if (!token) {
      res.statusCode = 302;
      res.setHeader('Location', '/admin/login')
      return {props: {}}
  } else {
    // we have token so i return nothing without changing location
       return;
     }
}
export default RequireAuthentication;