将Auth0的parseHash函数包装在一个Promise中

Question

auth0.js有一个函数，用于解析URL哈希片段并从中提取验证结果。我将这个函数封装在名为loadSession的函数中，如下所示：

public loadSession(): void {
  this.auth0.parseHash((err, authResult) => {
    if (authResult) {
      window.location.hash = '';
      localStorage.setItem('token', authResult.accessToken);
      // TODO (1)
    } else if (err) {
      // TODO (2)
    }
  });
}

如上所示，parseHash将回调函数作为参数传递，而我无法控制它。我希望loadSession返回一个Promise，在上面的// TODO (1)处解决并在// TODO (2)处拒绝。这样我就可以使用obj.loadSession().then(() => { // do something if successful }).catch((err) => { // raise error if not })。

- Sammy

Answer 1

只需将其包装在一个 Promise 中：

public loadSession() {
    return new Promise((resolve, reject) => {
        this.auth0.parseHash((err, authResult) => {
            if(authResult) {
                window.location.hash = '';
                localStorage.setItem('token', authResult.accessToken);
                resolve(authResult);
            } else if (err) {
                reject(err);
            }
        });
    });
}

- Kartik Sharma

Answer 2

您可以向返回承诺的函数传递任何回调函数，只要：

1. 回调是最后一个参数
2. 回调函数将错误作为其第一个参数

这里有一个例子：

const asPromise = 
  (context)   =>
  (fn)   =>
  (args)      =>
    new Promise(
      (resolve,reject) =>
        fn.apply(
          context,
          (args||[]).concat(
            function(){
              if(arguments[0]){
                reject(arguments[0]);return;
              }
              resolve(Array.from(arguments).slice(1));
            }
          )
        )
    );

// to apply parseHash on auth0
public loadSession(): Promise {
  return asPromise(this.auth0)(this.auth0.parseHash)()
  .then(
    ([authResult])=>{
      if (authResult) {
        window.location.hash = '';
        localStorage.setItem('token', authResult.accessToken);
        //whatever you return here is the resolve
        return authResult;
      } 
      //just throw in a promise handler will return a rejected promise
      // this is only for native promises, some libraries don't behave
      // according to spec so you should test your promise polyfil if supporting IE
      throw "Promise resolved but got no authResult";
    }
  )
}

- HMR

Answer 3

或者您可以使用一个小型库来为您完成这个任务：promisify-auth0 在 GitHub 上，promisify-auth0 在 npmjs.org 上。

现已更新至版本9.5.1。

- Igor Soloydenko

Answer 4

public loadSession(): Promise {
  return new Promise((resolve, reject) => {
    this.auth0.parseHash((err, authResult) => {
    if (authResult) {
      window.location.hash = '';
      localStorage.setItem('token', authResult.accessToken);
      // TODO (1)
      // resolve(something)
    } else if (err) {
      // TODO (2)
      // reject(something)
    }
  });
}

如需了解有关使用 Promise API 的更多信息，请访问 MDN 文档

- SALEH