如何让事件在承诺中等待直到它运行？

Question

正在向firebase发送字符认证。

代码流程是...

1. 用户输入电话号码并点击按钮
2. 将值发送到服务器并以文本形式发送验证码
3. 用户输入验证码并点击按钮
4. 认证码值判别

在第二步中，按下按钮将执行signIn()即代码。

 const signIn = () => {
    auth
      .signInWithPhoneNumber(mobileNum, appVerifier)
      .then(function(confirmationResult) {

        //start

        window.confirmationResult = confirmationResult;

        confirmationResult
          .confirm(authCode)
          .then(function(result) {
            var user = result.user;
          })
          .catch(function(error) {
          });

        //end
      })
      .catch(function(error) {
        console.log(error);
      });
  };

此时start到end的部分必须在第3步之后（按钮事件之后）执行。

start 中的end 必须等待按钮事件发生。

我该怎么做？

Answer 1

您试图在没有用户参与的情况下做太多事情。 signInWithPhoneNumber Promise 应该解析为显示确认请求页面，然后停止。完成。下一步由用户提交确认号。

原来如此

1. 事件处理程序 1 提交电话号码，然后解析显示确认输入屏幕
2. 事件处理程序 2 将确认号提交给身份验证函数，然后解析更新用户并显示欢迎屏幕。

Promise 可用于管理计算机进程，而不是用户进程。您不能使用 Promise 来等待用户。您需要提供他们可以触发的事件处理程序以继续流程的下一步。

Answer 2

将下一个代码移动到另一个函数：

confirmationResult
          .confirm(authCode)
          .then(function(result) {
            var user = result.user;
          })
          .catch(function(error) {
          });

在第三步的onClick里面调用上面的函数

Answer 3

你应该把验证码确认移到promise链的左边，所以这一切都是按顺序完成的，一旦两个promise都完成了你就可以执行代码，像这样：

    const signIn = () => {
        auth
          .signInWithPhoneNumber(mobileNum, appVerifier)
          .then(function(confirmationResult) {
            window.confirmationResult = confirmationResult;
            return confirmationResult.confirm(authCode);
          })
          .then(function(result) {
            var user = result.user;
            // end here, auth code has been confirmed and you have access to user
          })
          .catch(function(error) {
            // this will catch errors in either "signInWithPhoneNumber" or "confirmationResult.confirm"
            console.log(error);
          });
      };