Reactjs 在Next.js中，每次调用时都提取用户数据并将其保存到上下文中，这是一种好的做法吗

我决定使用React的ContextAPI来存储经过身份验证的用户数据。 我已经实现了一个定制的应用程序组件，并编写了一个

getInitialProps

函数从后端检索用户数据

class MyApp extends App {
  render() {
    const { Component, pageProps, authenticated, user } = this.props;
    return (
      <AuthProvider authenticated={authenticated}>
        <UserProvider userData={user}>
          <Component {...pageProps} />
        </UserProvider>
      </AuthProvider>
    );
  }
}

MyApp.getInitialProps = async (appContext) => {
  let authenticated = false;
  let user = null
  const request = appContext.ctx.req;
  if (request) {
    request.cookies = cookie.parse(request.headers.cookie || '');
    authenticated = !!request.cookies.sessionid;
    if (authenticated){
      user = await getCurrentUserData(request.headers.cookie)
    }
  }

  // Call the page's `getInitialProps` and fill `appProps.pageProps`
  const appProps = await App.getInitialProps(appContext);

  return { ...appProps, authenticated, user };
};

export default MyApp;

类MyApp扩展了应用程序{
render（）{
const{Component，pageProps，authenticated，user}=this.props；
返回(
);
}
}
MyApp.getInitialProps=async（appContext）=>{
让验证=假；
让user=null
const request=appContext.ctx.req；
如果（请求）{
request.cookies=cookie.parse（request.headers.cookie | |“”）；
已验证=！！request.cookies.sessionid；
如果（已验证）{
user=wait getCurrentUserData（request.headers.cookie）
}
}
//调用页面的'getInitialProps'并填充'appProps.pageProps'`
const-appProps=await-App.getInitialProps（appContext）；
返回{…appProps，已验证，用户}；
};
导出默认MyApp；

我最担心的是每次呈现页面时都会调用

getCurrentUserData

，因此总是有一个额外的API调用

这样做是好的做法吗？ 我应该将用户的数据存储在cookie中，并从中更新上下文吗？ 如何优化此解决方案

---

如果你不想每页都调用它，那就谢谢你了。您可以为身份验证创建HoC。。并且仅对使用用户数据的页面使用此HoC

---

通常情况下，不需要用户数据的页面是静态页面，这在大多数情况下都是情景性的。

如果您不希望每个页面都调用它。您可以为身份验证创建HoC。。并且仅对使用用户数据的页面使用此HoC

---

通常情况下，不需要用户数据的页面是静态页面，这在大多数情况下都是情境性的。

问题是，我在每个页面上都需要它，因为我总是呈现需要这些信息的导航栏。这已经是一种很好的做法。您将所有用户数据保存在DB中。问题是，我在每个页面上都需要它，因为我总是呈现一个导航栏，它需要这些信息。这已经是一个很好的实践。将所有用户数据保存在数据库中。