परिचय
नेटवर्क गड़बड़ी लॉगिंग (एनईएल), किसी ऑरिजिन से क्लाइंट-साइड नेटवर्क गड़बड़ियों को इकट्ठा करने का एक तरीका है.
यह NEL एचटीटीपी रिस्पॉन्स हेडर का इस्तेमाल करके, ब्राउज़र को नेटवर्क से जुड़ी गड़बड़ियां इकट्ठा करने के लिए कहता है. इसके बाद, सर्वर को गड़बड़ियों की रिपोर्ट करने के लिए, Reporting API के साथ इंटिग्रेट होता है.
लेगसी Reporting API के बारे में खास जानकारी
लीगेसी Report-To हेडर
Reporting API के पुराने वर्शन का इस्तेमाल करने के लिए, आपको Report-To एचटीटीपी रिस्पॉन्स हेडर सेट करना होगा. इसकी वैल्यू एक ऑब्जेक्ट है, जो ब्राउज़र के एंडपॉइंट ग्रुप के बारे में बताती है, ताकि:
Report-To:
{
"max_age": 10886400,
"endpoints": [{
"url": "https://analytics.provider.com/browser-errors"
}]
}
अगर आपका एंडपॉइंट यूआरएल आपकी साइट से अलग ऑरिजिन पर मौजूद है, तो एंडपॉइंट को सीओआरएस प्रीफ़्लाइट रिक्वेस्ट के साथ काम करना चाहिए. (उदाहरण के लिए, 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).
उदाहरण में, अपने मुख्य पेज के साथ यह रिस्पॉन्स हेडर भेजने से, ब्राउज़र को max_age सेकंड के लिए, ब्राउज़र से जनरेट की गई चेतावनियों को एंडपॉइंट https://analytics.provider.com/browser-errors पर रिपोर्ट करने के लिए कॉन्फ़िगर किया जाता है.
यह ध्यान रखना ज़रूरी है कि पेज से किए गए सभी बाद के एचटीटीपी अनुरोधों (इमेज, स्क्रिप्ट वगैरह के लिए) को अनदेखा कर दिया जाता है. कॉन्फ़िगरेशन, मुख्य पेज के जवाब के दौरान सेटअप किया जाता है.
हेडर फ़ील्ड के बारे में जानकारी
हर एंडपॉइंट कॉन्फ़िगरेशन में एक group नाम, max_age, और endpoints कलेक्शन होता है. include_subdomains फ़ील्ड का इस्तेमाल करके, यह भी चुना जा सकता है कि गड़बड़ियों की शिकायत करते समय सबडोमेन को शामिल किया जाए या नहीं.
| फ़ील्ड | टाइप | ब्यौरा |
|---|---|---|
group |
स्ट्रिंग | ज़रूरी नहीं. अगर group का नाम नहीं बताया गया है, तो एंडपॉइंट को "डिफ़ॉल्ट" नाम दिया जाता है. |
max_age |
संख्या | ज़रूरी है. यह एक ऐसा पूर्णांक होता है जो एंडपॉइंट के लाइफ़टाइम को सेकंड में तय करता है. "0" वैल्यू से, एंडपॉइंट ग्रुप को उपयोगकर्ता एजेंट के रिपोर्टिंग कैश मेमोरी से हटा दिया जाएगा. |
endpoints |
कलेक्शन<ऑब्जेक्ट> | ज़रूरी है. JSON ऑब्जेक्ट का एक कलेक्शन, जो आपके रिपोर्ट कलेक्टर का असल यूआरएल बताता है. |
include_subdomains |
बूलियन | ज़रूरी नहीं. एक बूलियन, जो मौजूदा ऑरिजिन के होस्ट के सभी सबडोमेन के लिए एंडपॉइंट ग्रुप को चालू करता है. अगर इस एट्रिब्यूट को शामिल नहीं किया जाता है या इसे "सही" के अलावा किसी और वैल्यू पर सेट किया जाता है, तो एंडपॉइंट को सबडोमेन की रिपोर्ट नहीं भेजी जाती. |
group नाम एक यूनीक नाम होता है. इसका इस्तेमाल, किसी स्ट्रिंग को एंडपॉइंट से जोड़ने के लिए किया जाता है. किसी खास एंडपॉइंट ग्रुप का रेफ़रंस देने के लिए, इस नाम का इस्तेमाल उन जगहों पर करें जो Reporting API के साथ इंटिग्रेट होती हैं.
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"
}]
}
या उन्हें एक ही एचटीटीपी हेडर में जोड़कर:
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 वैल्यू के हिसाब से कैश मेमोरी में सेव करता है. साथ ही, कंसोल की सभी खराब चेतावनियों/गड़बड़ियों को आपके यूआरएल पर भेजता है.
फ़ेलओवर और लोड बैलेंसिंग
ज़्यादातर मामलों में, आपको हर ग्रुप के लिए एक यूआरएल कलेक्टर कॉन्फ़िगर करना होगा. हालांकि, रिपोर्टिंग से काफ़ी ट्रैफ़िक जनरेट हो सकता है. इसलिए, स्पेसिफ़िकेशन में डीएनएस एसआरवी रिकॉर्ड से प्रेरित फ़ॉलओवर और लोड-बैलेंसिंग की सुविधाएं शामिल हैं.
ब्राउज़र, किसी ग्रुप में ज़्यादा से ज़्यादा एक एंडपॉइंट पर रिपोर्ट डिलीवर करने की पूरी कोशिश करेगा. लोड को बांटने के लिए, एंडपॉइंट को एक 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}
]
}
नेटवर्क से जुड़ी गड़बड़ी की जानकारी लॉग करने की सुविधा सेट अप करना
सेटअप
एनईएल का इस्तेमाल करने के लिए, Report-To हेडर को कलेक्टर की मदद से सेट अप करें, जो नाम वाले ग्रुप का इस्तेमाल करता हो:
Report-To: {
...
}, {
"group": "network-errors",
"max_age": 2592000,
"endpoints": [{
"url": "https://analytics.provider.com/networkerrors"
}]
}
इसके बाद, गड़बड़ियों को इकट्ठा करना शुरू करने के लिए NEL रिस्पॉन्स हेडर भेजें. NEL ने ऑरिजिन के लिए ऑप्ट-इन किया है. इसलिए, आपको सिर्फ़ एक बार हेडर भेजना होगा. NEL और Report-To, दोनों एक ही ऑरिजिन के लिए आने वाले अनुरोधों पर लागू होंगे. साथ ही, कलेक्टर को सेट अप करने में इस्तेमाल की गई max_age वैल्यू के हिसाब से, गड़बड़ियां इकट्ठा करना जारी रखेंगे.
हेडर की वैल्यू, JSON ऑब्जेक्ट होनी चाहिए, जिसमें max_age और
report_to फ़ील्ड शामिल हों. अपने नेटवर्क गड़बड़ी कलेक्टर के ग्रुप के नाम का रेफ़रंस देने के लिए, बाद वाले का इस्तेमाल करें:
GET /index.html HTTP/1.1
NEL: {"report_to": "network-errors", "max_age": 2592000}
सब-रिसॉर्स
उदाहरण: अगर example.com, foobar.com/cat.gif को लोड करता है और वह रिसॉर्स लोड नहीं होता है, तो:
foobar.comके NEL कलेक्टर को सूचना दी गईexample.comके एनईएल कलेक्टर को सूचना नहीं दी गई है
आम तौर पर, एनईएल सिर्फ़ क्लाइंट पर जनरेट किए गए सर्वर-साइड लॉग को फिर से बनाता है.
example.com को foobar.com के सर्वर लॉग नहीं दिखते. इसलिए, इसकी एनईएल रिपोर्ट भी नहीं दिखती.
रिपोर्ट कॉन्फ़िगरेशन को डीबग करना
अगर आपको अपने सर्वर पर रिपोर्ट नहीं दिख रही हैं, तो chrome://net-export/ पर जाएं. उस पेज से यह पुष्टि की जा सकती है कि चीज़ों को सही तरह से कॉन्फ़िगर किया गया है और रिपोर्ट सही तरीके से भेजी जा रही हैं.
रिपोर्टिंग ऑब्ज़र्वर का क्या होगा?
ReportingObserver, रिपोर्टिंग का एक तरीका है, जो मिलता-जुलता है, लेकिन अलग है. यह JavaScript कॉल पर आधारित है.
यह नेटवर्क गड़बड़ी को लॉग करने के लिए सही नहीं है, क्योंकि नेटवर्क गड़बड़ियों को JavaScript की मदद से इंटरसेप्ट नहीं किया जा सकता.
सर्वर का उदाहरण
यहां Express का इस्तेमाल करने वाले Node सर्वर का उदाहरण दिया गया है. इसमें, नेटवर्क की गड़बड़ियों के लिए रिपोर्टिंग को कॉन्फ़िगर करने का तरीका बताया गया है. साथ ही, नतीजे को कैप्चर करने के लिए एक खास हैंडलर बनाया गया है.
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}`);
});