Angular2缓存HTTP响应的最简单方法[重复]

Question

我有一个页面，它向同一个位置发出超文本传输协议请求，只是根据用户的需求使用不同的参数。所以我的代码看起来像这样：

this.http.post( //I am open to POST methods or GET methods as I have security in the back to prevent malicious writes.
   'http://192.168.1.45:3000/mylocation',
   'p1=' + param1 + '&p2=' + param2, 
   {headers: headers}
)

例如，在 JQuery 中，您在框架中构建了一个缓存属性，该属性会自动缓存并且非常容易实现：

$.ajax({
  cache: true,
  //other options...
});

Angular2有类似的东西吗？只要用户在应用程序中，我就希望缓存这些动态响应。因此，如果用户使用相同的参数请求相同的url，那么它只会从缓存中获取它，如果参数从未被使用，那么它会进行网络调用。

我在请求选项的Angular2文档中找不到任何内容:

https://angular . io/docs/js/latest/API/http/request options-class . html

Answer 1

缓存数据，如果缓存数据可用，则返回此值，否则发出HTTP请求。如果您想为不同的请求（参数）重用，您可以调整为将引用存储在数组中。

getData() {
    if(this.data) {
      // if `data` is available just return it as `Observable`
      return Observable.of(this.data); 
    else if(this.observable) {
      // if `this.observable` is set then the request is in progress
      // return the `Observable` for the ongoing request
      return this.observable;
    } else {
      // create the request, store the `Observable` for subsequent subscribers
      this.observable = this.http.get('/someUrl')
          .map(res => res.json())
          .do(val => {
            this.data = val;
            // when the cached data is available we don't need the `Observable` reference anymore
            this.observable = null;
          })
          // make it shared so more than one subscriber can get the result
          .share();
      return this.observable;
    }
}