𝗥𝗲𝗮𝗰𝘁 𝘃𝘀. 𝗫𝗦𝗦: 𝗪𝗵𝗲𝗿𝗲 𝘁𝗵𝗲 𝗚𝘂𝗮𝗿𝗱𝗿𝗮𝗶𝗹𝘀 𝗘𝗻𝗱
React बाय डिफॉल्ट सुरक्षित आहे. बहुतेक स्क्रिप्ट इंजेक्शन रोखण्यासाठी ते JSX मधील व्हॅल्यूज 'एस्केप' (escape) करते. परंतु यामुळे सुरक्षेची एक चुकीची भावना निर्माण होऊ शकते. React मुळे XSS चा धोका कमी होतो, पण तो पूर्णपणे संपत नाही.
XSS हल्ल्यांचे तीन मुख्य प्रकार आहेत:
- Reflected XSS: हल्लेखोर एक घातक लिंक पाठवतो. सर्व्हर लगेच ती स्क्रिप्ट वापरकर्त्याला परत पाठवतो. ब्राउझर ती स्क्रिप्ट रन करतो कारण ती एखाद्या विश्वासार्ह साइटवरून आल्यासारखी वाटते.
- Stored XSS: हल्लेखोर तुमच्या सर्व्हरवर एक स्क्रिप्ट सेव्ह करतो. ती तुमच्या डेटाबेसमध्ये, कमेंट्समध्ये किंवा लॉग्समध्ये साठवली जाते. जो कोणी ते कंटेंट पाहतो, त्याच्या ब्राउझरमध्ये ती स्क्रिप्ट रन होते.
- DOM Based XSS: हा हल्ला पूर्णपणे ब्राउझरमध्ये होतो. हल्लेखोर URL पॅरामीटर्स किंवा क्लायंट-साइड इनपुट्समध्ये बदल करून तुमच्या JavaScript ला चुकीच्या पद्धतीने वागायला लावतो.
React प्रत्यक्षात तुमचे कशापासून संरक्षण करते?
- Automatic Escaping: React स्ट्रिंग्सना साध्या टेक्स्टप्रमाणे (plain text) हाताळते. जर तुम्ही JSX मध्ये स्क्रिप्ट टॅग इंजेक्ट करण्याचा प्रयत्न केला, तर React कोड रन करण्याऐवजी फक्त तो मजकूर दाखवते.
- Safe Rendering: कंटेंट कसा दिसेल याचे व्यवस्थापन React करते. यामुळे तुम्हाला धोकादायक ब्राउझर APIs वापरण्याची गरज कमी होते.
- Less DOM Manipulation: अपडेट्सचे काम React स्वतः हाताळते. त्यामुळे तुम्हाला
document.write()किंवाinnerHTMLसारख्या गोष्टी वारंवार वापरण्याची गरज पडत नाही.
React काही 'एस्केप हॅचेस' (escape hatches) प्रदान करते. जर तुम्ही त्यांचा चुकीचा वापर केला, तर तुम्ही असुरक्षितता (vulnerabilities) निर्माण करू शकता.
या चुकांपासून सावध राहा:
dangerouslySetInnerHTML: ही प्रॉपर्टी React ला 'एस्केपिंग' वगळण्यास सांगते. ती HTML जसे आहे तसे इन्सर्ट करते. जर कंटेंट स्वच्छ (clean) नसेल, तर हल्लेखोर यशस्वी होऊ शकतो. तुमचे कंटेंट सॅनिटाइज करण्यासाठी प्रथम DOMPurify वापरा.- Direct DOM Manipulation: जर तुम्ही युजर इनपुटसोबत
element.innerHTMLवापरले, तर तुम्ही React ची सर्व सुरक्षा यंत्रणा बायपास करता. - Third Party Libraries: काही बाह्य टूल्स (external tools) कदाचित सुरक्षिततेचे तेच नियम पाळणार नाहीत.
React सुरक्षेसाठी साधने प्रदान करते. तुम्ही त्यांचा योग्य वापर केला पाहिजे. सुरक्षा ही तुमची जबाबदारी आहे.
स्त्रोत: https://dev.to/ayomidejhay/react-vs-xss-where-the-guardrails-end-6p2