𝗥𝗲𝗮𝗰𝘁 𝘃𝘀. 𝗫𝗦𝗦: 𝗪𝗵𝗲𝗿𝗲 𝘁𝗵𝗲 𝗚𝘂𝗮𝗿𝗱𝗿𝗮𝗶𝗹𝘀 𝗘𝗻𝗱
React ডিফল্টভাবেই নিরাপদ। এটি বেশিরভাগ স্ক্রিপ্ট ইনজেকশন রোধ করতে JSX-এ ভ্যালুগুলোকে escape করে। কিন্তু এটি নিরাপত্তার একটি মিথ্যা ধারণা তৈরি করতে পারে। React XSS-এর ঝুঁকি কমায়, কিন্তু এটি পুরোপুরি নির্মূল করে না।
XSS আক্রমণের প্রধান তিনটি ধরন রয়েছে:
- Reflected XSS: একজন আক্রমণকারী একটি ক্ষতিকারক লিঙ্ক পাঠায়। সার্ভার তাৎক্ষণিকভাবে সেই স্ক্রিপ্টটি ব্যবহারকারীর কাছে ফেরত পাঠায়। ব্রাউজার স্ক্রিপ্টটি রান করে কারণ এটি দেখে মনে হয় যে এটি একটি বিশ্বস্ত সাইট থেকে এসেছে।
- Stored XSS: আক্রমণকারী আপনার সার্ভারে একটি স্ক্রিপ্ট সেভ করে রাখে। এটি আপনার ডাটাবেস, কমেন্ট বা লগ-এ থেকে যায়। যে ব্যবহারকারী সেই কন্টেন্টটি দেখেন, তার ব্রাউজারে স্ক্রিপ্টটি রান হয়।
- DOM Based XSS: এই আক্রমণটি সম্পূর্ণ ব্রাউজারের ভেতরে ঘটে। আক্রমণকারী URL প্যারামিটার বা ক্লায়েন্ট-সাইড ইনপুট পরিবর্তন করে আপনার JavaScript-কে ভুলভাবে কাজ করতে বাধ্য করে।
React আসলে আপনাকে কী থেকে রক্ষা করে?
- Automatic Escaping: React স্ট্রিংগুলোকে সাধারণ টেক্সট হিসেবে বিবেচনা করে। আপনি যদি JSX-এ কোনো script tag ইনজেক্ট করার চেষ্টা করেন, তবে React কোডটি রান না করে কেবল টেক্সট হিসেবে সেটি দেখায়।
- Safe Rendering: কন্টেন্ট কীভাবে প্রদর্শিত হবে তা React পরিচালনা করে। এটি বিপজ্জনক browser API ব্যবহারের প্রয়োজনীয়তা কমিয়ে দেয়।
- Less DOM Manipulation: React আপডেটগুলো পরিচালনা করে। ফলে আপনাকে ঘন ঘন
document.write()বাinnerHTMLব্যবহার করতে হয় না।
React কিছু escape hatch প্রদান করে। আপনি যদি সেগুলো ভুলভাবে ব্যবহার করেন, তবে আপনি নিরাপত্তাজনিত ঝুঁকি বা vulnerability তৈরি করতে পারেন।
এই ভুলগুলো থেকে সাবধান থাকুন:
dangerouslySetInnerHTML: এই প্রপার্টিটি React-কে escape প্রক্রিয়া এড়িয়ে যেতে বলে। এটি HTML-কে হুবহু যেভাবে আছে সেভাবেই ইনসার্ট করে। যদি কন্টেন্টটি পরিষ্কার (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