javascript - Chrome Tab重复项未发出网络请求

Question

我在应用程序加载(componentDidMount)上有3个api调用。
当我重新加载页面或打开新选项卡时，会进行所有api调用，但在复制选项卡时仅会触发其中一个。
如何触发页面复制中的所有api调用
注意:
浏览器:chrome。

Answer 1

使用Memopromise工具是处理异步过程的有效工具。

class MemoPromise {

 constructor(getPromise) {

   this.cache = {};

   this.getPromise = getPromise;

   this.request = this.request.bind(this);

 }

 request({ uniqueKey, ...rest }) {

   if (!uniqueKey) {

     return Promise.reject(new Error('Unique key not passed'));

   }

   if (this.cache[uniqueKey]) {

     return this.cache[uniqueKey];

   }

   const promise = this.getPromise(rest);

   this.cache[uniqueKey] = promise

     .then((res) => {

       delete this.cache[uniqueKey];

       return res;

     })

     .catch((err) => {

       delete this.cache[uniqueKey];

       throw err;

     });

   return this.cache[uniqueKey];

 }

}

在上面的示例中，我创建了一个MemoPromise类，该类的实例化对象可以记住构造函数中传递的函数返回的promise，直到它们未被解析或拒绝为止。
查看执行代码

const memoPromise = new MemoPromise(fn);

// invocation

const { request } = memoPromise;

request({ uniqueKey: url, apiType, url, payload });

// not required now

// fn({ apiType, url, payload });

在将Memopromise类集成到您的浏览器之后，您的API请求可能不会遇到任何问题。它可以有效地处理您的重复请求。