Question

我正在学习如何在我们的Next.js应用程序中使用Auth0。使用nexjs-auth0 SDK。我已成功通过Auth0进行身份验证，并收到了ID令牌和访问令牌（用于Auth0管理api）。这似乎是事物的默认配置。我们有一个已设置的API，该API也将使用Auth0身份验证。经过数小时的文档阅读后，我无法弄清楚如何获取用于API的access_token。

我一直在阅读您不为API使用ID令牌（配置文件信息），而是使用访问令牌。另外，当您authenticate the user(login)时，它读取以获取访问令牌。我还没弄清楚。

我已经在Auth0中定义了应用程序和API端点。有一个用户设置并分配了一个角色。我在这个角色上有几个作用域。

我是否可以在同一个登录调用中同时获取我们的api的ID令牌和访问令牌，还是在用户登录后请求API访问令牌？我假设API访问令牌将是承载jwt类型令牌。

Answer 1

现在是 2021 年，Auth0 已将 nextjs-auth0 库从测试版中移除。示例设置此时并未提及 initAuth0()，但如果您在 Next API 路由中调用 getAccessToken()，您仍然会得到一个类似于以下内容的简短令牌：vVuzVl6e0O-ydWeJXtvweASvhnWoav7w。这是因为 Auth0 uses the audience parameter 来确定是提供不透明令牌还是 JWT。

要让 JWT 不记名令牌放入 Authorization 标头，您只需 add the audience and scope as parameters 到 handleAuth() 内的 pages/api/auth/[...auth0].js 调用：

// pages/api/auth/[...auth0].js
import { handleAuth, handleLogin } from '@auth0/nextjs-auth0';

export default handleAuth({
  async login(req, res) {
    try {
      await handleLogin(req, res, {
        authorizationParams: {
          audience: 'https://api.example.com/products', // or AUTH0_AUDIENCE
          // Add the `offline_access` scope to also get a Refresh Token
          scope: 'openid profile email read:products' // or AUTH0_SCOPE
        }
      });
    } catch (error) {
      res.status(error.status || 400).end(error.message);
    }
  }
});

然后从您的 API 路由中调用 getAccessToken() 将返回一个 JWT，您可以使用它来调用您的 API：

// pages/api/widget/[id].js
import { getAccessToken, withApiAuthRequired } from '@auth0/nextjs-auth0';

export default withApiAuthRequired(async function widget(req, res) {
  try {
    const { accessToken } = await getAccessToken(req, res);
    const { id } = req.query

    const response = await fetch(`https://MY_API_DOMAIN/widget/${id}`, {
        headers: {
            Authorization: `Bearer ${accessToken}`
        }
    })
    const widget = await response.json()

    res.status(200).json(widget)
  } catch(error) {
    console.error(error)
    res.status(error.status || 500).end(error.message)
  }
});

Answer 2

经过一番痛苦和提问之后，事实证明您需要在请求中包括该API的受众。对于Next.js-Auth0 SDK，这是我们这个问题的范围，可以在Auth0初始化时完成。

在文件lib/auth0.js中：

import { initAuth0 } from '@auth0/nextjs-auth0'

export default initAuth0({
  clientId: process.env.AUTH0_CLIENT_ID,
  clientSecret: process.env.AUTH0_CLIENT_SECRET,
  scope: process.env.AUTH0_SCOPE,
  audience: 'http://api.example.com/v1',
  domain: process.env.AUTH0_DOMAIN,
  redirectUri: process.env.REDIRECT_URI,
  postLogoutRedirectUri: process.env.POST_LOGOUT_REDIRECT_URI,
  session: {
    cookieSecret: process.env.SESSION_COOKIE_SECRET,
    cookieLifetime: process.env.SESSION_COOKIE_LIFETIME,
  },
})

我将Audience参数添加到了该文件（audience: 'http://api.example.com/v1',），并从Auth0仪表板将其设置为API Identifier。

这是另一个困惑点，因为当您在Auth0中设置自定义API时，它同时具有Id和Identifier。您可以在标题的顶部找到标识符。从我所看到的，标识符一直是端点的uri。

在添加audience参数之后，当用户登录时，现在收到的accessToken是一个JWT承载令牌，可以与我的API一起使用。它仅包含需要的安全位，而不包含配置文件位。

要向accessToken添加权限，请在该API的 Auth0仪表板中进行以下更改：

启用RBAC-启用/启用
在访问令牌中添加权限-true / on

请求/获取用于访问API（Auth0）的访问令牌

2 个答案: