詳解Provisional headers are shown

 

前言

我們在發送異步請求遇到問題的時候，都會先打開Chrome的控制台來看一下http請求，有時候會在請求頭看到Provisional headers are shown的報錯

 

 

 

 

問題描述：

這個問題字面意思是“顯示了臨時報文頭”，瀏覽器第一次發送這個請求，請求被阻塞，未收到響應。當要求瀏覽器再次發送這個請求時，上個同樣的請求都還沒有收到響應，瀏覽器就會報這個警告。

簡而言之，就是請求並沒有發出去。

原因分析

這種情況出現的情況很多，但原因是多樣的，一般有如下幾種：

1. 跨域請求被瀏覽器攔截

現在網站的靜態資源都會存在專門的靜態域名下面，和實際訪問的域名可能不一致。

這種情況基本發生在ajax請求，都是基於CORS來解決這個問題。

  $.ajax({
      url: ajaxUrl,
      type: 'GET',
      success: function (res) {}
  });

　　可以替換為

  $.cors(ajaxUrl, {}, function (json) {
    if (json.code == 0) {}
  });

　　

2. 服務器未及時響應（超時）

    這種特定情況下才會出現，跟服務器關聯不大。

3. 請求被瀏覽器插件攔截

    作為一個開發人員，大家的chrome上肯定裝了不少的插件。我們可以通過 chrome://net-internals 來根據關鍵字查找相關請求，然后具體去看相關狀態。

4. 該數據直接采用了緩存，並沒有發送請求

    只從緩存中獲得的通信顯示為“顯示臨時標題”（或“執行”），因為該文件是從緩存中獲取的，並且未進行通信，所以並不會顯示詳細標頭。

如果上一個資源加載失敗，可能導致從緩存加載的資源失敗，即緩存資源請求之前的請求不能失敗。強緩存from disk cache或者from memory cache，此時也不會顯示。

前面提到的那么多情況，其實都是與服務器沒有進行或者完成正確的通信，所以只展示臨時信息。