title: Axios - multiple requests for the same resource
body: <p>I'm creating an app where in one page, I have two components requesting the same http resource. In this case I'm using axios and here's one example:</p>
  
  <pre><code>axios.get('/api/shift/type')
          .then(
              (response) =&gt; {
                  self.shiftTypes = response.data;
                  success(response.data)
              },
              (response) =&gt; {
                  error(response)
              }
          );
  </code></pre>
  
  <p>The issue lies in them requesting it almost at the same time. If Component A makes the request at the same time as Component B, 2 request calls are made and they'll get the same data. Is there a way to check if axios currently has an unresolved promise and return the result to both components once the request is resolved?</p>
  
  <p>Not sure if it helps but the app is being built using the vue framework</p>
  
  <p>Thanks</p>
  
  <p>EDIT: I tried storing the promise in memory but Component B never gets the response</p>
  
  <pre><code>getShiftTypes(success, error = this.handleError, force = false) {
      if (this.shiftTypes &amp;&amp; !force) {
          return Promise.resolve(this.shiftTypes);
      }
  
      if (this.getShiftTypesPromise instanceof Promise &amp;&amp; !force) { return this.getShiftTypesPromise; }
  
      let self = this;
      this.getShiftTypesPromise = axios.get('/api/shift/type')
          .then(
              (response) =&gt; {
                  self.shiftTypes = response.data;
                  self.getShiftTypesPromise = null;
                  success(response.data)
              },
              (response) =&gt; {
                  error(response)
              }
          );
      return this.getShiftTypesPromise;
  }
  </code></pre>