為什么我的嵌套 promise 然后返回未定義？

Question

這是我的代碼：

resolve: async (
        _root,
        { data: { password, interests, email, ...userData } },
        { prisma }
      ) => {
        console.log('called reg');
        const handleError = (error) => {
          console.log('error: ', error);
          return { token: null, error, userId: null };
        };
        return admin
          .auth()
          .createUser({
            email,
            password,
            displayName: `${userData.firstName} ${userData.lastName}`,
          })
          .then((userRecord) => {
            // See the UserRecord reference doc for the contents of userRecord.
            console.log('Successfully created new user:', userRecord);
            return admin
              .database()
              .ref('users/' + userRecord.uid)
              .set(
                {
                  ...userData,
                  interests,
                },
                (error) => {
                  if (error) return handleError(error);
                  else {
                    return admin
                      .auth()
                      .createCustomToken(userRecord.uid)
                      .then((token) => {
                        console.log('token: ', token)
                        return {
                          token,
                          error: null,
                          userId: userRecord.uid,
                        };
                      }, handleError);
                  }
                }
              );
          }, handleError)
          .then((result) => {
            console.log('result: ', result);
            return result;
          });
      },

我在我的 graphql 解析器中使用嵌套然后，我的問題是，為什么最后的結果然后返回未定義？ 我無法弄清楚，因為當我在 createCustomToken 的回調中登錄時，令牌就在那里，所以我確保最后記錄結果，但不幸的是，它是未定義的，基本上，我想使用。然后像這樣捕獲，不是asyc/await，有幫助嗎？

Answer 1

您不應該在set方法中使用回調，而是將 a then鏈接到它。 當您使用回調時， set方法將返回undefined ，然后result其分配給最后一個then塊。 Firebase 文檔

此外，您不必在每個then方法中都提供相同的handleError參數。 您可以通過在最后鏈接一個catch方法來替換它們。

...
return admin
  .database()
  .ref("users/" + userRecord.uid)
  .set({
    ...userData,
    interests,
  })
  .then(() => admin.auth().createCustomToken(userRecord.uid))
  .then((token) => {
    console.log("token: ", token);
    return {
      token,
      error: null,
      userId: userRecord.uid,
    };
  })
  .then((result) => {
    console.log("result: ", result);
    return result;
  }).catch(handleError);

在我看來，您的代碼很難閱讀。 編寫更具可讀性的代碼將使調試過程更容易，通常，async/await 可以提高可讀性。

您的代碼的async/await版本：

async (
  _root,
  { data: { password, interests, email, ...userData } },
  { prisma }
) => {
  try {
    const userRecord = await admin.auth().createUser({
      email,
      password,
      displayName: `${userData.firstName} ${userData.lastName}`,
    });
    console.log("Successfully created new user:", userRecord);
    await admin
      .database()
      .ref("users/" + userRecord.uid)
      .set({
        ...userData,
        interests,
      });
    const token = await admin.auth().createCustomToken(userRecord.uid);
    console.log("token: ", token);
    return {
      token,
      error: null,
      userId: userRecord.uid,
    };
  } catch (error) {
    console.log("error: ", error);
    return { token: null, error, userId: null };
  }
};

當然，可讀性是主觀的。 選擇你和你的隊友喜歡的風格。