𝗥𝗲𝗮𝗰𝘁 𝘃𝘀. 𝗫𝗦𝗦: 𝗪𝗵𝗲𝗿𝗲 𝘁𝗵𝗲 𝗚𝘂𝗮𝗿𝗱𝗿𝗮𝗶𝗹𝘀 𝗘𝗻𝗱
React இயல்பாகவே பாதுகாப்பானது. பெரும்பாலான ஸ்கிரிப்ட் இன்ஜெக்ஷன்களைத் (script injections) தடுக்க இது JSX-இல் உள்ள மதிப்புகளை எஸ்கேப் (escape) செய்கிறது. ஆனால் இது ஒரு தவறான பாதுகாப்பு உணர்வை உருவாக்குகிறது. React XSS அபாயத்தைக் குறைக்கிறது, ஆனால் அதை முழுமையாகத் தடுத்துவிடுவதில்லை.
XSS தாக்குதல்களில் மூன்று முக்கிய வகைகள் உள்ளன:
- Reflected XSS: ஒரு தாக்குதல் நடத்துபவர் (attacker) ஒரு தீங்கிழைக்கும் இணைப்பை (malicious link) அனுப்புகிறார். சர்வர் அந்த ஸ்கிரிப்டை உடனடியாக பயனருக்குத் திருப்பி அனுப்புகிறது. அது ஒரு நம்பகமான தளத்திலிருந்து வந்ததாகத் தெரிவதால், பிரவுசர் அந்த ஸ்கிரிப்டை இயக்கிவிடுகிறது.
- Stored XSS: தாக்குதல் நடத்துபவர் உங்கள் சர்வரில் ஒரு ஸ்கிரிப்டைச் சேமிக்கிறார். அது உங்கள் டேட்டாபேஸ் (database), கமெண்ட்கள் (comments) அல்லது லாக்ஸில் (logs) இருக்கும். அந்த உள்ளடக்கத்தைப் பார்க்கும் ஒவ்வொரு பயனரின் கணினியிலும் அந்த ஸ்கிரிப்ட் இயங்கும்.
- DOM Based XSS: இந்தத் தாக்குதல் முழுமையாக பிரவுசருக்குள்ளேயே நடக்கிறது. உங்கள் JavaScript தவறாகச் செயல்படுவதற்கு ஏதுவாக, தாக்குதல் நடத்துபவர் URL பாராமீட்டர்களை (parameters) அல்லது கிளையண்ட் பக்க உள்ளீடுகளை (client side inputs) மாற்றுகிறார்.
React உண்மையில் உங்களை எதிலிருந்து பாதுகாக்கிறது?
- Automatic Escaping: React சரங்களை (strings) வெறும் உரையாகவே (plain text) treats செய்கிறது. நீங்கள் JSX-க்குள் ஒரு ஸ்கிரிப்ட் டேக்-ஐ (script tag) செலுத்த முயன்றால், React அந்த குறியீட்டை இயக்குவதற்குப் பதிலாக வெறும் உரையாகவே காட்டும்.
- Safe Rendering: உள்ளடக்கங்கள் எவ்வாறு தோன்றும் என்பதை React நிர்வகிக்கிறது. இது ஆபத்தான பிரவுசர் API-களைப் பயன்படுத்த வேண்டிய அவசியத்தைக் குறைக்கிறது.
- Less DOM Manipulation: மாற்றங்களை (updates) React கையாளுவதால், நீங்கள் அடிக்கடி
document.write()அல்லதுinnerHTMLஆகியவற்றைப் பயன்படுத்த வேண்டிய அவசியம் இல்லை.
React சில மாற்று வழிகளை (escape hatches) வழங்குகிறது. அவற்றை நீங்கள் தவறாகப் பயன்படுத்தினால், பாதுகாப்பு ஓட்டைகளை (vulnerabilities) உருவாக்கிவிடுவீர்கள்.
இந்தத் தவறுகளைக் கவனத்தில் கொள்ளுங்கள்:
dangerouslySetInnerHTML: இந்தத் பண்பு (property) எஸ்கேப்பிங் செய்வதைத் தவிர்க்க React-இடம் கூறுகிறது. இது HTML-ஐ அப்படியே உள்ளிடுகிறது. உள்ளடக்கத்தைச் சுத்தப்படுத்தவில்லை என்றால், தாக்குதல் நடத்துபவர் வெற்றி பெற்றுவிடுவார். உங்கள் உள்ளடக்கத்தைச் சுத்தப்படுத்த (sanitize) முதலில் DOMPurify-ஐப் பயன்படுத்தவும்.- Direct DOM Manipulation: பயனர் உள்ளீட்டுடன் (user input)
element.innerHTML-ஐப் பயன்படுத்தினால், நீங்கள் React-இன் அனைத்துப் பாதுகாப்புகளையும் மீறிவிடுகிறீர்கள். - Third Party Libraries: சில வெளிப்படையான கருவிகள் (external tools) இதே பாதுகாப்பு விதிகளைப் பின்பற்றாமல் இருக்கலாம்.
React பாதுகாப்பிற்கான கருவிகளை வழங்குகிறது. நீங்கள் அவற்றைச் சரியாகப் பயன்படுத்த வேண்டும். பாதுகாப்பு என்பது உங்கள் பொறுப்பு.
ஆதாரம்: https://dev.to/ayomidejhay/react-vs-xss-where-the-guardrails-end-6p2