使用getInitialProps保护路由-Next.js

Question

我们目前正在针对用户特定的流程，需要一些防护措施来防止用户访问某些页面。我们基于来自GraphQL API的数据来执行此操作，据我们所知，我们应该在getInitialProps内部实现这些保护。

我们希望为此使用一些实用程序功能，而不是在每个页面上重写所有逻辑。参见示例：

来自我们的getInitialProps的片段

Email.getInitialProps = async ({ req, res, apolloClient }) => {
  const deviceInfo = getDeviceInfo(req)

  try {
    const {
      data: { viewer },
    } = await apolloClient.query({
      query: GET_CHECKOUT,
      fetchPolicy: 'network-only',
    })

    checkForCart(viewer, res)
    checkForProcessingPayment(viewer, res)

    return {
      namespacesRequired: ['buy-common', 'common', 'buy-email'],
      deviceInfo,
    }
  } catch (error) {
    const { href, as } = getLinkProps('CART')
    return redirect({ href, as }, res)
  }
}

实用程序功能（handleRedirect只是在后台执行res.redirect和res.end的重定向实用程序]

export const checkForCart = ({ cart, checkout }, res) => {
  const { rows = [] } = checkout || {}

  if (!cart || !rows.length) {
    return handleRedirect('CART', res)
  }
}

这看起来不错，因为我们只能使用checkForCart()，而不是在每个页面上都重复此代码。它有一个问题，那就是return util的checkForCart仅返回该函数，而不返回页面。因此，由于重定向需要一些时间，因此checkForCart() get下面的代码将被执行。因此，如果我在console.log以下执行checkForCart(viewer, res)，它将记录。

是否有一种整齐的方法来停止从util执行，或者在Next.js中有一种整齐的方法来修复这种情况？实施“警卫”之类的最佳方法是什么？

Answer 1

getInitialProps是async函数，这意味着您可以利用await语法。将checkForCart转换为一个返回诺言并对其进行await的函数，然后处理结果。例如：