本頁面由 Cloud Translation API 翻譯而成。

網路錯誤記錄 (NEL)

Eric Bidelman

Maud Nalpas

簡介

網路錯誤記錄 (NEL) 機制是收集來源的用戶端網路錯誤。

這個外掛程式會使用 NEL HTTP 回應標頭來指示瀏覽器收集網路錯誤，然後與 Reporting API 整合，向伺服器回報錯誤。

注意： 如要為網站設定網路錯誤記錄功能，請使用參考 Report-To 標頭的舊版 Reporting API。這是因為採用 Reporting-Endpoints 標頭的新版 Reporting API「不」支援網路錯誤記錄。詳情請參閱瀏覽器支援。而是日後將開發新的網路錯誤記錄機制。新機制推出後，請從舊版 Reporting API 改用這個新機制。

舊版 Reporting API 總覽

舊版 `Report-To` 標頭

如要使用舊版 Reporting API，您必須設定 Report-To HTTP 回應標頭。結果值是一個物件，用來描述瀏覽器的端點群組回報錯誤：

Report-To:
{
    "max_age": 10886400,
    "endpoints": [{
    "url": "https://analytics.provider.com/browser-errors"
    }]
}

如果端點網址所在的來源與網站不同， CORS 預檢要求(例如 Access-Control-Allow-Origin: *; Access-Control-Allow-Methods: GET,PUT,POST,DELETE,OPTIONS; Access-Control-Allow-Headers: Content-Type, Authorization, Content-Length, X-Requested-With)。

在這個範例中，傳送這個回應標頭和主頁面時設定讓瀏覽器回報瀏覽器產生的警告端點 https://analytics.provider.com/browser-errors 的時間為 max_age 秒。請特別注意，這個網頁提出的所有後續 HTTP 要求 (用於映像檔、指令碼等) 都會遭到忽略。設定於也就是首頁的回應。

標頭欄位的說明

每個端點設定都包含 group 名稱、max_age 和 endpoints 陣列。您也可以選擇是否在報表時將子網域納入考量錯誤。include_subdomains

欄位	類型	說明
`group`	字串	選用設定。如未指定 `group` 名稱，則端點的名稱會是「default」。
`max_age`	數字	必填。非負整數，以秒為單位定義端點的生命週期。值為「0」將端點群組從使用者代理程式的報表快取中移除。
`endpoints`	陣列<物件>	必填。指定報表收集器實際網址的 JSON 物件陣列。
`include_subdomains`	布林值	選用設定。這個布林值可為目前來源主機的所有子網域啟用端點群組。如果省略或省略任何「true」，子網域則不會回報給端點。

group 名稱是一組不重複名稱，可用來與字串建立關聯服務端點在其他整合產品的位置使用這個名稱來參照特定端點群組

max-age 也是必填欄位，並指定如何，並向瀏覽器回報錯誤。

endpoints 欄位是提供容錯移轉和負載平衡的陣列接著介紹網際網路通訊層包括兩項主要的安全防護功能請參閱容錯移轉和負載平衡一節。是請特別注意，瀏覽器只會選取一個端點，即使表示群組在 endpoints 中列出多個收集器。如要傳送因此您的後端必須報表。

瀏覽器如何傳送報告？

瀏覽器會定期批次傳送報告，並傳送至報表所有端點都沒問題

為了傳送報告，瀏覽器會發出 POST 要求 Content-Type: application/reports+json 和包含陣列的主體已擷取的警告/錯誤數量

瀏覽器何時傳送報告？

應用程式會以非架構的方式提供報表，意即瀏覽器控制報告傳送至伺服器的時間。

瀏覽器會嘗試會在最適當時間提供排入佇列的報告。這些程序準備就緒後，請耐心等候即時提供意見回饋給開發人員)，但瀏覽器也可能會延遲送達忙於處理優先順序較高的工作，或是使用者的速度緩慢和/或整個網路的流量此外，瀏覽器也可能會優先傳送系統會將特定來源的資料優先顯示 (如果使用者是常用訪客)。

效能問題微乎其微 (例如：使用 Reporting API 時的網路爭用情況)。還有也無法控制瀏覽器傳送佇列報表的時機。

設定多個端點

單一回應可藉由傳送多個 Report-To 標頭：

Report-To: {
             "group": "default",
             "max_age": 10886400,
             "endpoints": [{
               "url": "https://example.com/browser-reports"
             }]
           }
Report-To: {
             "group": "network-errors-endpoint",
             "max_age": 10886400,
             "endpoints": [{
               "url": "https://example.com/network-errors"
             }]
           }

也可以將這些參數合併成單一 HTTP 標頭

Report-To: {
             "group": "network-errors-endpoint",
             "max_age": 10886400,
             "endpoints": [{
               "url": "https://example.com/network-errors"
             }]
           },
           {
             "max_age": 10886400,
             "endpoints": [{
               "url": "https://example.com/browser-errors"
             }]
           }

傳送 Report-To 標頭後，瀏覽器會快取端點依據其 max_age 值，將這全部的垃圾控制台警告/錯誤

容錯移轉和負載平衡

在多數情況下，您需為每個群組設定一個網址收集器。不過由於報表可能產生大量流量，因此規格包括容錯移轉和負載平衡功能 SRV 記錄。

瀏覽器會盡力將報告傳送至最多一個端點群組您可以為端點指派 weight 以分配負載，接收特定比例報告流量的端點。端點也會指派 priority 來設定備用收集器。

只有在上傳至主要收集器失敗時，系統才會嘗試備用收集器。

範例：在 https://backup.com/reports 中建立備用收集器：

Report-To: {
             "group": "endpoint-1",
             "max_age": 10886400,
             "endpoints": [
               {"url": "https://example.com/reports", "priority": 1},
               {"url": "https://backup.com/reports", "priority": 2}
             ]
           }

設定網路錯誤記錄

設定

如要使用 NEL，請設定 Report-To 標頭和使用已命名群組的收集器：

Report-To: {
    ...
  }, {
    "group": "network-errors",
    "max_age": 2592000,
    "endpoints": [{
      "url": "https://analytics.provider.com/networkerrors"
    }]
  }

接下來，請傳送 NEL 回應標頭，開始收集錯誤。自 NEL 以來選擇加入來源，只要傳送一次標頭即可。NEL 和 Report-To 會套用至日後對相同來源發出的要求，並將繼續處理根據用來設定的 max_age 值收集錯誤收集器。

標頭值應為包含 max_age 的 JSON 物件，並「report_to」欄位中的值。請使用後者來表示應用程式的群組名稱網路錯誤收集器：

GET /index.html HTTP/1.1
NEL: {"report_to": "network-errors", "max_age": 2592000}

敬上

注意： Report-To 標頭使用連字號。此處的 report_to 使用底線。

子資源

範例：如果 example.com 載入 foobar.com/cat.gif 且資源失敗載入：

foobar.com的 NEL 收集器已收到通知
example.com 的 NEL 收集器未收到通知

根據經驗法則，NEL 會在用戶端。

因為 example.com 無法查看 foobar.com 的伺服器也無法查看 NEL 報告。

對報表設定進行偵錯

如果伺服器未顯示報表，請前往 chrome://net-export/。這個頁面適用於以下情況：確認內容是否設定正確，並正在傳送報告。

ReportingObserver 呢？

「ReportingObserver」是具有相關但但檢舉機制不同的內容。這種模式是以 JavaScript 呼叫為基礎。發生網路錯誤時，「不適合記錄網路錯誤」不能透過 JavaScript 攔截

範例伺服器

以下是使用 Express 的節點伺服器範例。說明如何設定網路錯誤的報告，並建立專用的處理常式來擷取結果。

const express = require('express');

const app = express();
app.use(
  express.json({
    type: ['application/json', 'application/reports+json'],
  }),
);
app.use(express.urlencoded());

app.get('/', (request, response) => {
  // Note: report_to and not report-to for NEL.
  response.set('NEL', `{"report_to": "network-errors", "max_age": 2592000}`);

  // The Report-To header tells the browser where to send network errors.
  // The default group (first example below) captures interventions and
  // deprecation reports. Other groups, like the network-error group, are referenced by their "group" name.
  response.set(
    'Report-To',
    `{
    "max_age": 2592000,
    "endpoints": [{
      "url": "https://reporting-observer-api-demo.glitch.me/reports"
    }],
  }, {
    "group": "network-errors",
    "max_age": 2592000,
    "endpoints": [{
      "url": "https://reporting-observer-api-demo.glitch.me/network-reports"
    }]
  }`,
  );

  response.sendFile('./index.html');
});

function echoReports(request, response) {
  // Record report in server logs or otherwise process results.
  for (const report of request.body) {
    console.log(report.body);
  }
  response.send(request.body);
}

app.post('/network-reports', (request, response) => {
  console.log(`${request.body.length} Network error reports:`);
  echoReports(request, response);
});

const listener = app.listen(process.env.PORT, () => {
  console.log(`Your app is listening on port ${listener.address().port}`);
});

網路錯誤記錄 (NEL)

簡介

舊版 Reporting API 總覽

舊版 Report-To 標頭

標頭欄位的說明

瀏覽器如何傳送報告？

瀏覽器何時傳送報告？

設定多個端點

容錯移轉和負載平衡

設定網路錯誤記錄

設定

子資源

對報表設定進行偵錯

ReportingObserver 呢？

範例伺服器

延伸閱讀

舊版 `Report-To` 標頭