在不同的浏览器上对相同的api调用获得不同的响应

Question

我正在使用Angular6进行项目。 在一个奇怪的问题上，我已经挠了三天。 问题是，对于通过适当参数传递的相同api调用，我在两种浏览器（chrome和Internet Explorer 11）上得到了不同的响应。 镀铬响应非常好并且已更新。

算法：我有两种方法

1. populateProjectTimesheetUsers（）：它从服务器中带出时间表的用户。
2. onSaveAddUserInstructionClick（）：将新用户保存到时间表。

流程：使用“ onSaveAddUserInstructionClick（）”将用户保存到时间表后，将调用“ populateProjectTimesheetUsers（）”以在屏幕上获取更新的用户数据。

问题：在chrome上，“ populateProjectTimesheetUsers（）”正在获取更新的数据，但在IE上，它将带​​来旧数据，即IE上的“最新用户”列表中没有最新的用户。

代码：

onSaveAddUserInstructionClick(){
    this.addUserModel.WorkerId = this.addUserModel.Worker.Key;
    this.adminTimeEntryService.addUserToInstruction(this.selectedProjectId, this.addUserModel.WorkerId).subscribe(
      (response) => {
        this.messageService.showMessage("success","User added to instruction successfully");
        this.populateProjectTimesheetUsers(this.selectedProjectId);
        this.addUserModalRef.hide();
      },
      (error) => {
        this.handleError(error);
        this.addUserModalRef.hide();
      }
    )
  }

populateProjectTimesheetUsers(projectId = null) {
    if (projectId != null) {
      this.userGridRowData = [];

      this.adminTimeEntryService.getTimesheetUsersByProjectId(projectId).subscribe(
        (response) => {
          this.serviceLineGridRowData = response.ServiceLines;
          this.userGridRowData = response.Users;
          console.log("this.userGridRowData1: " , this.userGridRowData);
          console.log("response1: " , response );
          for(let i=0; i< this.userGridRowData.length; i++){
            this.userGridRowData[i].AddInstructionRate = "Add Instruction Rate"; 
            this.userGridRowData[i].RemoveUserFromInstruction = "Remove User From Instruction";
          }

          console.log("this.this.userGridRowData2: " , this.userGridRowData);
          console.log("response2: " , response );

          setTimeout(()=>{
            console.log("this.this.userGridRowData3: " , this.userGridRowData);
            console.log("response3: " , response );
            this.userGridApi.setRowData(this.userGridRowData);
            this.serviceLineGridApi.setRowData(this.serviceLineGridRowData);
          }, 0);
        },
        (error) => {
          Logger.logError(`getTimesheetUsersByProjectId error: ${JSON.stringify(error.error)}`);
        }
      );
    }
  }

尝试：

1. 我检查了按引用将变量彼此分配。

2. 我检查了函数调用的异步性。

3. 刷新缓存

等等

但是问题仍然存在。 如果有人指出这个问题，那就太好了，我们可以学习。 可能是我错过了最小的事情，但是我无法找到什么。

Answer 1

也许问题与IE浏览器缓存有关。

尝试清除IE浏览器的历史记录，并参考本文和该线程以添加http标头，然后禁用缓存：

headers = new Headers({
        'Cache-Control':  'no-cache, no-store, must-revalidate, post- 
                            check=0, pre-check=0',
        'Pragma': 'no-cache',
        'Expires': '0'
    });

Answer 2

我错过了Internet Explorer网络统计信息的一瞥。 它迫使api调用从缓存中获取数据。

我强迫我的api调用从真实服务器中获取数据并绕过缓存。 我以以下方式设置标题。

headers = headers.set('Cache-control','no-cache');
headers = headers.set('Pragma','no-cache');