Angular не обновляет страницу с включенным кешем

Я создал веб-сайт angular, который содержит форму "добавить" и "удалить", чтобы манипулировать данными в таблице на той же странице.

Когда я тестирую его локально или с помощью Chrome Dev Console (отключенный кеш), когда я добавляю новый элемент или удаляю его, таблица автоматически обновляется. Когда я тестирую его на сервере производства (IIS Server) моего клиента, он работает только с консолью Chrome Dev Console. В противном случае они должны использовать CTRL + F5 для обновления кеша и отображения изменений на странице.

Это код компонентов:

  addProduct() {
    this._productsService.addProduct(this.addFormProductItem)
      .subscribe(v => {
        this._productsService.getProducts().subscribe( 
          products => {this.products = products, this.onChangeTable(this.config)}
      );
    });
    this.addmodalWindow.hide();
    return;
  } 


  onChangeTable(config: any, page: any = {
    page: this.page,
    itemsPerPage: this.itemsPerPage
  }): any {
    if (config.filtering) {
      Object.assign(this.config.filtering, config.filtering);
    }
    if (config.sorting) {
      Object.assign(this.config.sorting, config.sorting);
    }
    this.ng2TableData = this.products;
    this.length = this.ng2TableData.length;
    let filteredData = this.changeFilter(this.ng2TableData, this.config);
    let sortedData = this.changeSort(filteredData, this.config);
    this.rows = page && config.paging ? this.changePage(page, sortedData) : sortedData;
    this.length = sortedData.length;
  }

Я предполагаю, что это связано либо с конфигурацией сервера, либо с кодом webpack. Тем не менее, я не знаком с последним, и я просто оставил его, как это было в исходном пакете, который я использовал.

Я создал сущность с веб-пакетом, так как это длинный файл

Изменить 1: После некоторых дополнительных исследований я попытался добавить следующее в файл web.config в корневую папку приложения.

<caching enabled="false" enableKernelCache="false">
      <profiles>
         <add extension=".css" policy="DontCache" kernelCachePolicy="DontCache" />
         <add extension=".html" policy="DontCache" kernelCachePolicy="DontCache" />
         <add extension=".js" policy="DontCache" kernelCachePolicy="DontCache" />
      </profiles>
</caching>

Тем не менее, у меня все еще такое же поведение. Добавление элемента с закрытой консолью Dev Console не обновляет таблицу. Но если у меня консоль dev открыта и отключена кеш, то она обновляет ее без необходимости обновления.

Изменить 2: Работа с окном инкогнито не устраняет проблему.

Изменить 3: Добавление метатег в index.html еще не исправляет проблему.

<meta http-equiv="Cache-control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">

Изменить 4:

  getProducts() {
    return this._http.get(this.API + '/products/all')
      .map((response: Response) => <Product[]>response.json().products);
  }

  addProduct(product:Product) {
    if ( this._loggedInGuard.isLoggedIn() ) {
      let token = localStorage.getItem('my.token');
      let body = JSON.stringify(product);
      let headers = new Headers(
         { 'Content-Type': 'application/json',
         'Authorization': 'Bearer ' + token});
      return this._http
      .post(this.API + "/products/store", body, {headers: headers} )
      .map(res => res.json())
      .catch(this._responseService.catchBadResponse)
      .do(() => this._responseService.success('Success. You added a product!'));

    }  
  }

Изменить 5

Единственное решение, которое я могу найти, - это перезагрузить окно каждый раз, когда я обновляю данные с помощью location.reload(true). Но опять же, это работает только на Firefox, а не на Chrome. И я не буду признавать, что вам нужно отказаться от единственной причины иметь одностраничное приложение, чтобы это сработало.

Ответы

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
  <location path=".">
    <system.webServer>
      <staticContent>
        <clientCache cacheControlMode="DisableCache" />
      </staticContent>
    </system.webServer>
  </location>
</configuration>

Response.Cache.SetCacheability(HttpCacheability.NoCache);

HttpContext.Current.Response.Cache.SetCacheability
                            (HttpCacheability.Server);
HttpContext.Current.Response.Cache.SetNoStore();
Response.Cache.SetExpires(DateTime.Now); 
Response.Cache.SetValidUntilExpires(true); 

 Cache-Control:no-cache, no-store
 Pragma:no-cache
 Expires:-1

.post(this.API + "/products/store?unique=milliseconds", body, {headers: headers} )