Securing React Application

#react #webdev #cybersecurity #reactnative

React Application එකක් හදනකොට අපි ගොඩක් වෙලාවට Performance සහ UI එක ගැන වද උනාට, Security පැත්ත ගැන හිතනවා මදි නේද? 🤔

React කියන්නේ safe framework එකක් තමයි, ඒත් අපි නොදැනුවත්වම කරන පුංචි වැරදි නිසා මුළු application එකම අනතුරේ වැටෙන්න පුළුවන්. 2025 දී React App එකක් Secure කරගන්න නම් මේ දේවල් අනිවාර්යයෙන්ම බලන්න ඕන. 👇

🔐 1. dangerouslySetInnerHTML පාවිච්චිය සීමා කරන්න React වලින් XSS (Cross-Site Scripting) නවත්වන්න default protection එකක් දෙනවා. හැබැයි ඔයා manual HTML render කරන්න dangerouslySetInnerHTML පාවිච්චි කරනවා නම්, අනිවාර්යයෙන්ම DOMPurify වගේ library එකක් පාවිච්චි කරලා ඒ content එක sanitize කරගන්න. නැත්නම් hacker කෙනෙක්ට ලේසියෙන්ම malicious scripts run කරන්න පුළුවන්.

🛡️ 2. Authentication Tokens පරිස්සම් කරන්න (LocalStorage vs. Cookies) JWT Tokens හෝ Session ID කවදාවත් localStorage එකේ save කරන්න එපා. XSS attack එකකදී attackers ලට ලේසියෙන්ම localStorage access කරන්න පුළුවන්. ඒ වෙනුවට HttpOnly Cookies පාවිච්චි කරන්න. ඒක ගොඩක් ආරක්ෂිතයි.

🔗 3. URL Based Attacks වලින් ප්‍රවේශම් වෙන්න User කෙනෙක් input කරන link එකක් කෙලින්ම a tag එකේ href එකට දානකොට පරිස්සම් වෙන්න. කෙනෙක්ට පුළුවන් javascript:alert('Hacked') වගේ malicious code එකක් ඒ හරහා execute කරන්න. හැමවිටම link එක http හෝ https වලින් පටන් ගන්නවද කියලා validate කරන්න.

📦 4. Dependencies Update කරලා තියාගන්න React වල විතරක් නෙවෙයි, අපි පාවිච්චි කරන third-party libraries වලත් vulnerabilities තියෙන්න පුළුවන්. නිතරම npm audit run කරලා බලන්න. පරණ වෙච්ච packages (outdated dependencies) අප්ඩේට් කරගන්න.

backend එකේ validation නැතුව කවදාවත් client-side validation මත විතරක් යැපෙන්න එපා. Frontend එක කොච්චර secure කරත්, Backend එකේ security එක තමයි වැදගත්ම දේ! 💯