如何从 Nextjs 中的中间件获取数据？答案

【问题标题】：how to get data from a middleware in Nextjs?如何从 Nextjs 中的中间件获取数据？
【发布时间】：2021-12-17 04:23:41
【问题描述】：

我正在尝试在 nextjs 中使用 jwt 创建一个身份验证系统。因此，我构建了一个可以验证 jwt 令牌并使用它来设置身份验证系统的中间件，如下所示：

export default function middleware(request, event) {
    const token = request.cookies.token
    let authenticated = false
    if (pathname === '/dashboard') {
        if (token) {
            try {
                jwt.verify(token, 'HvpkPMarcwoZFAo')
                authenticated = true
            } catch {
                return NextResponse.redirect('/signin')
            }
        } else {
            return NextResponse.redirect('/signin')
        }
    }
}

根据上面的代码，如果用户没有登录，他会被重定向到登录页面。

但问题是我希望根据身份验证更改某些组件（例如，不显示登录用户的注册按钮）。我可以从这个中间件获取数据（例如布尔值）以用于不同的组件吗？我在 Expressjs 中使用了response.locals。 Nextjs中是否有类似的解决方案？

【问题讨论】：

你能不检查客户端的登录状态并在这些组件中相应地渲染吗？
这似乎是一个非常基本的中间件用例，除了设置 cookie 之外，我无法弄清楚如何做到这一点。如果你可以在中间件中修改请求头就好了，但是 getServerSideProps 并没有得到修改后的请求头。

标签： javascript reactjs next.js

【解决方案1】：

你应该看看https://nextjs.org/docs/basic-features/data-fetching#getserversideprops-server-side-rendering

getServerSideProps 在参数中接收上下文 ;)

【讨论】：

我不明白你的解决方案。我根本不想获取任何数据，我只想从中间件获取数据
是的 :) 这就是 nextjs 项目的方式。在这些函数中，您将从上下文（来自中间件的响应）中提取您想要的内容并将其放入您的组件道具中。编辑：getServerSideProps：nextjs.org/docs/basic-features/…