परिचय
नेटवर्क एरर लॉगिंग (एनईएल) की मदद से, किसी ऑरिजिन से, क्लाइंट-साइड नेटवर्क की गड़बड़ियां इकट्ठा करना.
यह 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
).
उदाहरण के लिए, अपने मुख्य पेज के साथ इस रिस्पॉन्स हेडर को भेजना
ब्राउज़र को, ब्राउज़र की जनरेट की गई चेतावनियों की रिपोर्ट करने के लिए कॉन्फ़िगर करता है
https://analytics.provider.com/browser-errors
एंडपॉइंट पर max_age
सेकंड के लिए.
यह ध्यान देना ज़रूरी है कि पेज की ओर से किए गए सभी एचटीटीपी अनुरोध
(इमेज, स्क्रिप्ट वगैरह के लिए) को अनदेखा कर दिया जाता है. कॉन्फ़िगरेशन को इस दौरान सेटअप किया गया है
मुख्य पेज के जवाब के बारे में बताएँ.
हेडर फ़ील्ड के बारे में जानकारी
हर एंडपॉइंट कॉन्फ़िगरेशन में एक group
नाम, max_age
, और endpoints
होता है
कलेक्शन. आपके पास यह चुनने का विकल्प भी है कि रिपोर्ट करते समय, सबडोमेन पर विचार करना है या नहीं
include_subdomains
फ़ील्ड का इस्तेमाल करके गड़बड़ियां ठीक की गई हैं.
फ़ील्ड | टाइप | ब्यौरा |
---|---|---|
group |
स्ट्रिंग | ज़रूरी नहीं. अगर group का नाम नहीं बताया गया है, तो एंडपॉइंट को "डिफ़ॉल्ट" नाम दिया जाता है. |
max_age |
संख्या | ज़रूरी है. यह एक नॉन-नेगेटिव पूर्णांक होता है, जो एंडपॉइंट के लाइफ़टाइम को सेकंड में बताता है. वैल्यू "0" उपयोगकर्ता एजेंट की रिपोर्टिंग कैश मेमोरी से एंडपॉइंट ग्रुप हट जाएगा. |
endpoints |
कलेक्शन<ऑब्जेक्ट> | ज़रूरी है. JSON ऑब्जेक्ट का कलेक्शन, जो आपके रिपोर्ट कलेक्टर के असल यूआरएल के बारे में बताता है. |
include_subdomains |
बूलियन | ज़रूरी नहीं. यह एक बूलियन है. यह मौजूदा ऑरिजिन के होस्ट के सभी सबडोमेन के लिए, एंडपॉइंट ग्रुप को चालू करता है. अगर इसे हटाया जाता है या इसे "सही" के अलावा कुछ और किया जाता है, तो एंडपॉइंट को सबडोमेन को रिपोर्ट नहीं किया जाता. |
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"
}]
}
या उन्हें एक ही एचटीटीपी हेडर में जोड़कर:
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}
]
}
नेटवर्क की गड़बड़ी को लॉग करने की सुविधा सेट अप की जा रही है
सेटअप
एनईएल का इस्तेमाल करने के लिए, 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
के NEL कलेक्टर को सूचना नहीं दी गई है
कॉन्टेंट बनाने बुनियादी नियम यह है कि NEL, सर्वर साइड लॉग फिर से जनरेट करता है. यह डेटा से संपर्क करने के लिए प्रोत्साहित करें.
example.com
, foobar.com
के सर्वर को ऐक्सेस नहीं कर सकता
लॉग में शामिल है, तो उसकी NEL रिपोर्ट को भी नहीं देखा जा सकता.
रिपोर्ट के कॉन्फ़िगरेशन डीबग करना
अगर आपको अपने सर्वर पर रिपोर्ट नहीं दिख रही हैं, तो यहां जाएं
chrome://net-export/
. वह पेज इनके लिए काम का है
यह पुष्टि की जा रही है कि डेटा सही तरीके से कॉन्फ़िगर किया गया है और रिपोर्ट भेजी जा रही हैं
बाहर रखा जाता था.
रिपोर्टिंग ऑब्ज़र्वर का क्या होता है?
ReportingObserver
एक मिलती-जुलती है, लेकिन रिपोर्टिंग का तरीका अलग है. यह JavaScript कॉल पर आधारित है.
नेटवर्क की गड़बड़ियों के तौर पर, यह नेटवर्क की गड़बड़ी को लॉग करने के लिए सही नहीं है
इन्हें JavaScript के ज़रिए रोका नहीं जा सकता.
उदाहरण सर्वर
नीचे एक नोड सर्वर का उदाहरण दिया गया है, जो एक्सप्रेस का इस्तेमाल करता है. इसमें, नेटवर्क की गड़बड़ियों के लिए रिपोर्टिंग को कॉन्फ़िगर करने का तरीका बताया गया है. साथ ही, नतीजा कैप्चर करने के लिए, एक खास हैंडलर बनाया जाता है.
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}`);
});