在NextJs中配置Auth0提供程序时出错

编程问答 2022-08-12

问题描述

我正在尝试在我的Nextjs应用中使用Auth0。为此，我需要将组件包装在Auth0Provider中，然后开始使用它。由于某种原因，我收到此错误：

Error: Objects are not valid as a React child (found: [object Promise]). If you meant to render a collection of children,use an array instead.

我的_app.tsx 

import GlobalStyles from "../styles/Global";
import { Auth0Provider } from "use-auth0-hooks";

function MyApp({ Component,pageProps }) {
  return (
    <>
      <Auth0Provider
        domain="My domain here"
        redirectUri={window.location.origin}
        clientId="My secret here"
      >
        <Component {...pageProps} />
      </Auth0Provider>

      <GlobalStyles />
    </>
  );
}

export default MyApp;

有人知道发生了什么事吗？

编辑：删除了异步，它也无法正常工作。

Error: Objects are not valid as a React child (found: [object Promise]). If you meant to render a collection of children,use an array instead.
    in Home (at _app.tsx:12)
    in Context.Provider
    in UserProvider
    in Context.Provider
    in Auth0Provider (at _app.tsx:7)
    in Fragment
    in MyApp (at _document.tsx:13)
    in Context.Provider
    in Context.Provider
    in StyleSheetManager
    in UnkNown
    in Context.Provider
    in Context.Provider
    in Context.Provider
    in Context.Provider
    in AppContainer

This error happened while generating the page. Any console logs will be displayed in the terminal window.
Source
pages/_document.tsx (11:8) @ Object.ctx.renderPage

   9 | try {
  10 |   ctx.renderPage = () =>
> 11 |     originalRenderPage({
     |    ^
  12 |       enhanceApp: (App) => (props) =>
  13 |         sheet.collectStyles(<App {...props} />),14 |     });
Call Stack
Function.getinitialProps
../../pages/_document.tsx (66:33)

完整错误日志

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

auth0reactjsreactjstypescripttypescript