使用 Auth0 的 nextJS 中的无效访问令牌

Question

提前感谢您的帮助。

如果需要更多细节，我可以提供任何其他信息。

我已经建立了一个 Nextjs/Django 项目，并且我已经按照这些教程和文档进行操作。现在，我正在尝试让我的访问令牌与我的 Django 应用程序通信。

1. https://auth0.com/docs/quickstart/backend/django/01-authorization

2. https://auth0.com/docs/quickstart/webapp/nextjs/01-login

3. https://github.com/auth0/nextjs-auth0/blob/main/EXAMPLES.md#access-an-external-api-from-an-api-route

我认为出错的是，当我使用 nextJS SDK 调用 getAccessToken 时，它返回一个无效的访问令牌（看起来像不透明令牌）。我认为这是因为当我将访问令牌输入到 jwt.io 的调试器中时，我得到了一个无效令牌，并且每当我尝试在我的程序中解码它时，它都会返回一个错误。通过这篇文章，我希望知道我是否遵循了正确的工作流程，如果是，我如何才能获得有效的访问令牌。

下面的代码是我一直用来让它工作的代码以及任何依赖项

"dependencies": {
    "@auth0/nextjs-auth0": "^2.4.0",
    "autoprefixer": "10.4.14",
    "axios": "^1.3.5",
    "eslint": "8.37.0",
    "eslint-config-next": "13.3.0",
    "jsonwebtoken": "^9.0.0",
    "next": "13.3.0",
    "postcss": "8.4.21",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "tailwindcss": "3.3.1"
  }

import { handleAuth } from '@auth0/nextjs-auth0';

export default handleAuth({
    login: handleLogin({
        authorizationParams: {
            audience: process .env.AUTH0_AUDIENCE,
            scope: 'openid profile email'
        }
    })
});

import { getAccessToken, withApiAuthRequired} from '@auth0/nextjs-auth0';

export default withApiAuthRequired(async function products(req, res) {
  const accessToken = await getAccessToken(req, res);
  if (!accessToken) {
    return res.status(401).json({ error: 'Unauthorized' });
  }
  console.log(accessToken);
  try {
    const response = await fetch('http://127.0.0.1:8000/private', {
      method: 'GET',
      headers: {
        Authorization: `Bearer ${accessToken}`,
      },
    });
    const data = await response.json();
    return res.status(200).json({ data });
  } catch (error) {
    console.error(error);
    return res.status(500).json({ error: 'Internal Server Error' });
  }
});

在这篇文章中有解释使用 Auth0 时访问令牌无效（我的访问令牌与他们的非常相似）并且在这个视频中有很好的解释https://community.auth0.com/t/why-is-my-访问令牌不是 jwt 不透明令牌/31028。我无法使用这些资源弄清楚，但我觉得我很接近！

我肯定这是正确的方法，但任何帮助都会很可爱！如果有任何方法可以让我的问题更清楚，请告诉我。我没有这些类型问题的结构。

还在 Mac 上使用 Ventura 13.1，使用 npm 运行所有内容，而不是 yarn，我的这个项目的 GitHub 是 https://github.com/dessygil/LMS-MSD