我如何连接Auth0到我的NextJS前端连接到我的后端后?

Question

所以我已经连接auth0到我的后端，其中包括Node, Express和MongoDB数据库。我能够使用我的服务器(localhost:4000/login)的端点创建帐户和登录，但这不是我想要的。我还为我的应用程序构建了一个前端，这将是用户被要求进行身份验证的地方，只有这样他们才被允许访问受保护的路由。我需要找到一种方法来连接我的auth0应用程序(已经连接到我的后端)到我的前端。

我不知道如何实现这一点，所以任何帮助这将是惊人的。如果这个问题已经有答案，或者网上有解决这个问题的资源，请告诉我。

Answer 1

救援来了

首先，检查这个例子。

其次，下面是nextjs中的任何页面如何与auth0一起工作的想法

。任何页面都可以使用auth0进行保护。默认情况下，您的页面不受保护

B。要保护页面，您需要:

export const getServerSideProps = withPageAuthRequired({
//returnTo: '/foo',
async getServerSideProps(ctx) {
return { props: { customProp: 'bar' } };
}
});

C。您还可以保护API端点(但在这种情况下，它将不能从任何地方访问，除了您的客户端，所以您不能例如从邮递员访问)

import { withApiAuthRequired, getAccessToken, getSession } from '@auth0/nextjs-auth0';
export default withApiAuthRequired(async function test(req, res) {
try {
const session = getSession(req, res);
} catch (error) {
res.status(error.status || 500).json({
code: error.code,
error: error.message
});
}
});

D。例如，你也可以在几乎任何地方调用getSession来获取有关"客户端"连接的信息。

E。你还需要检查这个文档，这是相当怪异的

F。您也可以保护component，例如，假设您创建了一个"安全"组件作为SecuredLayout。每次你嵌入你的内容与SecuredLayout页面将触发"登录"页面的用户登录。(对my personal space客户端有用)。尽量分解你的元素。

注:您需要在HTTPS协议上运行本地主机。