𝗥𝗲𝗮𝗰𝘁 𝘃𝘀. 𝗫𝗦𝗦: 𝗪𝗵𝗲𝗿𝗲 𝘁𝗵𝗲 𝗚𝘂𝗮𝗿𝗱𝗿𝗮𝗶𝗹𝘀 𝗘𝗻𝗱
React ഡിഫോൾട്ടായി സുരക്ഷിതമാണ്. മിക്ക സ്ക്രിപ്റ്റ് ഇൻജക്ഷനുകളെയും തടയാൻ ഇത് JSX-ലെ വാല്യൂസിനെ എസ്കേപ്പ് (escape) ചെയ്യുന്നു. എന്നാൽ ഇത് സുരക്ഷയെക്കുറിച്ച് ഒരു തെറ്റായ ധാരണ ഉണ്ടാക്കിയേക്കാം. React XSS റിസ്ക് കുറയ്ക്കുന്നുണ്ടെങ്കിലും അത് പൂർണ്ണമായും ഇല്ലാതാക്കുന്നില്ല.
പ്രധാനമായും മൂന്ന് തരത്തിലുള്ള XSS ആക്രമണങ്ങളുണ്ട്:
- Reflected XSS: ഒരു അറ്റാക്കർ ഒരു മാലീഷ്യസ് ലിങ്ക് അയക്കുന്നു. സെർവർ ആ സ്ക്രിപ്റ്റ് ഉടൻ തന്നെ ഉപയോക്താവിന് തിരികെ നൽകുന്നു. വിശ്വസനീയമായ ഒരു സൈറ്റിൽ നിന്ന് വന്നതാണെന്ന് തോന്നുന്നതിനാൽ ബ്രൗസർ ആ സ്ക്രിപ്റ്റ് പ്രവർത്തിപ്പിക്കുന്നു.
- Stored XSS: അറ്റാക്കർ നിങ്ങളുടെ സെർവറിൽ ഒരു സ്ക്രിപ്റ്റ് സേവ് ചെയ്യുന്നു. ഇത് നിങ്ങളുടെ ഡാറ്റാബേസിലോ, കമന്റുകളിലോ, അല്ലെങ്കിൽ ലോഗുകളിലോ നിലനിൽക്കുന്നു. ആ കണ്ടന്റ് കാണുന്ന ഓരോ ഉപയോക്താവിലും ആ സ്ക്രിപ്റ്റ് പ്രവർത്തിക്കുന്നു.
- DOM Based XSS: ഈ ആക്രമണം പൂർണ്ണമായും ബ്രൗസറിൽ സംഭവിക്കുന്നു. നിങ്ങളുടെ JavaScript തെറ്റായി പ്രവർത്തിപ്പിക്കുന്നതിനായി അറ്റാക്കർ URL പാരാമീറ്ററുകളോ ക്ലയന്റ് സൈഡ് ഇൻപുട്ടുകളോ മാറ്റം വരുത്തുന്നു.
React യഥാർത്ഥത്തിൽ നിങ്ങളെ എന്തിൽ നിന്നാണ് സംരക്ഷിക്കുന്നത്?
- Automatic Escaping: React സ്ട്രിംഗുകളെ പ്ലെയിൻ ടെക്സ്റ്റ് ആയിട്ടാണ് പരിഗണിക്കുന്നത്. നിങ്ങൾ JSX-ലേക്ക് ഒരു സ്ക്രിപ്റ്റ് ടാഗ് ഇൻജക്ട് ചെയ്യാൻ ശ്രമിച്ചാൽ, കോഡ് പ്രവർത്തിപ്പിക്കുന്നതിന് പകരം React ആ ടെക്സ്റ്റ് കാണിക്കുന്നു.
- Safe Rendering: കണ്ടന്റ് എങ്ങനെ കാണപ്പെടണം എന്ന് React നിയന്ത്രിക്കുന്നു. ഇത് അപകടകരമായ ബ്രൗസർ API-കൾ ഉപയോഗിക്കേണ്ട സാഹചര്യം കുറയ്ക്കുന്നു.
- Less DOM Manipulation: അപ്ഡേറ്റുകൾ കൈകാര്യം ചെയ്യുന്നത് React ആണ്. അതിനാൽ
document.write()അല്ലെങ്കിൽinnerHTMLഎന്നിവ ഇടയ്ക്കിടെ ഉപയോഗിക്കേണ്ട ആവശ്യം വരുന്നില്ല.
React ചില escape hatches നൽകുന്നുണ്ട്. അവ തെറ്റായി ഉപയോഗിച്ചാൽ സുരക്ഷാ വീഴ്ചകൾ (vulnerabilities) ഉണ്ടായേക്കാം.
ഈ തെറ്റുകൾ ശ്രദ്ധിക്കുക:
- dangerouslySetInnerHTML: ഈ പ്രോപ്പർട്ടി ഉപയോഗിക്കുമ്പോൾ എസ്കേപ്പിംഗ് ഒഴിവാക്കാൻ React-നോട് നിർദ്ദേശിക്കുന്നു. ഇത് HTML-നെ മാറ്റമില്ലാതെ തന്നെ ഇൻസേർട്ട് ചെയ്യുന്നു. കണ്ടന്റ് ശുദ്ധമല്ലെങ്കിൽ (not clean), അറ്റാക്കർക്ക് അത് ഉപയോഗിക്കാം. അതിനാൽ കണ്ടന്റ് സാനിറ്റൈസ് (sanitize) ചെയ്യാൻ ആദ്യം DOMPurify ഉപയോഗിക്കുക.
- Direct DOM Manipulation: ഉപയോക്താവിന്റെ ഇൻപുട്ട് ഉപയോഗിച്ച്
element.innerHTMLഉപയോഗിക്കുകയാണെങ്കിൽ, നിങ്ങൾ React-ന്റെ എല്ലാ സുരക്ഷാ സംവിധാനങ്ങളെയും മറികടക്കുന്നു. - Third Party Libraries: ചില എക്സ്റ്റേണൽ ടൂളുകൾ ഇതേ സുരക്ഷാ നിയമങ്ങൾ പാലിച്ചേക്കില്ല.
സുരക്ഷയ്ക്കായുള്ള ടൂളുകൾ React നൽകുന്നുണ്ട്. അവ നിങ്ങൾ ശരിയായി ഉപയോഗിക്കണം. സുരക്ഷ എന്നത് നിങ്ങളുടെ ഉത്തരവാദിത്തമാണ്.
Source: https://dev.to/ayomidejhay/react-vs-xss-where-the-guardrails-end-6p2