所有 api 路由都需要 jwt

Question

我一直在搜索 nextjs 文档，我找到了这个东西。

import { getToken } from "next-auth/jwt"

const secret = process.env.NEXTAUTH_SECRET

export default async function handler(req, res) {
  // if using `NEXTAUTH_SECRET` env variable, we detect it, and you won't actually need to `secret`
  // const token = await getToken({ req })
  const token = await getToken({ req, secret })
  console.log("JSON Web Token", token)
  res.end()
}

source

这使您有可能获得身份验证，但我不知道在哪里使用它或如何在所有路由中实现它。我认为它必须在 /api/auth/[...nextauth.js] 中，但我还没有找到任何相关信息。

我的所有 api 路线都在 api 文件夹中。

需要帮助，提前致谢！

Answer 1

Nextjs 12 有一个新的 middleware 功能，非常适合您的身份验证，您所要做的就是在 /pages 目录中创建 _middleware.js 文件并导出一个中间件功能。

// pages/_middleware.js
// this function runs before every request.
export function middleware(req, ev) {
 // define your authentication logic here
  return new Response('Hello, world!')
}

唯一的缺点是原生 Node.js API 不受支持。

Answer 2

鉴于你的问题是关于 API 路由，你需要 API 带有中间件的路由

用于页面的新 中间件 可能会造成混淆，但这使用 api 的传入请求作为中介 e（例如：api/auth.js ) 收到一个 req object 然后你可以进一步检查令牌。

查看他们使用带有中间件的 API 路由的示例（不涉及 _middleware.js。

它将传入请求获取到 /api/cookie 并添加一个 cookie header

pages/index.js 呼叫 /api/cookie - 您将在您的路线周围加入这个
pages/api/cookie.js 充当您的 api 路由处理程序
pages/api/cookie.js 导入 cookie 逻辑（在你的情况下 jwt cookies

https://github.com/vercel/next.js/tree/canary/examples/api-routes-middleware

Answer 3

// next.js middleware does not take res as argument
export default async function handler(req, ev) {
  console.log('what is ev',ev)
  const token = await getToken({ req, secret });
  // sinde you use jwt, you have to somehow extract userId
  const userId = await verifyToken(token);
  // you do not need to check for authentication if user wants to login
  const { pathname } = req.nextUrl;
  // static is folder that you Load images. You might use something else. if you dont add check, your images wont load
  if (
    pathname.includes("/api/login") ||
    userId ||
    pathname.includes("/static")
  ) {
    return NextResponse.next();
  }

  if (!token && pathname !== "/login") {
    return NextResponse.redirect("/login");
  }
}

所有 api 路由都需要 jwt

Require jwt for all api routes

javascript

jwt

reactjs

next.js

next-auth