在 Promise 中包装 Auth0 的 parseHash 函数

Posted 2023-03-08

【中文标题】在 Promise 中包装 Auth0 的 parseHash 函数

【英文标题】：Wrapping Auth0's parseHash function in a Promise

【发布时间】：2018-05-17 03:52:42

【问题描述】：

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 )

【参考方案1】：

或者您可以使用一个小型库来为您执行此操作：GitHub 上的promisify-auth0，npmjs.org 上的promisify-auth0。

现在更新到版本9.5.1。

【参考方案2】：

只需将其包装在一个 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);
            
        );
    );

【参考方案3】：

您几乎可以将任何回调函数传递给返回给定承诺的函数：

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

这是一个例子：

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";
    
  )

【参考方案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 Docs