প্রকাশিত: জুন 12, 2025
20 মে, 2025-এ, এইচটিএমএল স্পেসিফিকেশন পরিবর্তন করা হয়েছিল < এবং > বৈশিষ্ট্যগুলিতে, মিউটেশন XSS (mXSS) দুর্বলতা প্রতিরোধে সহায়তা করে। এই পরিবর্তনটি Chrome 138-এ এসেছে, যা 28 মে, 2025-এ বিটাতে উন্নীত হয়েছিল এবং 24 জুন, 2025-এ স্থিতিশীল হয়ে যাবে।
এই পোস্টটি ওয়েব ডেভেলপারদের উপর এইচটিএমএল অ্যাট্রিবিউট এস্কেপিং পরিবর্তনের প্রভাব এবং সম্ভাব্য ভাঙ্গনের বিবরণ দেয়; এই পরিবর্তনের পিছনে নিরাপত্তার যৌক্তিকতা সিকিউরিটি ইঞ্জিনিয়ারিং ব্লগে আমাদের সম্পর্কিত পোস্টে ব্যাখ্যা করা হয়েছে।
কি পরিবর্তন
ধরুন আপনার একটি <div> উপাদান আছে যার বৈশিষ্ট্যের data-content মান "<u>hello</u>" । আপনি div.outerHTML পড়লে কি হয়?
ঐতিহাসিকভাবে, আপনি নিম্নলিখিত HTML পাবেন:
<div data-content="<u>hello</u>"></div>
পরিবর্তনের পরে, আপনি নিম্নলিখিত HTML পাবেন:
<div data-content="<u>hello</u>"></div>
পূর্বে, কোনোটিই < বা > বৈশিষ্ট্যে এড়িয়ে যায়নি। এখন, এই দুটি চরিত্রই সবসময় পালিয়ে যায়।
কি পরিবর্তন হয়নি
পরিবর্তনটি একচেটিয়াভাবে পরিবর্তন করে যে কীভাবে এইচটিএমএল টুকরাগুলিকে সিরিয়ালাইজেশনের সময় স্ট্রিং উপস্থাপনায় রূপান্তরিত করা হয়। প্রভাবটি এমন পরিস্থিতিতে সীমাবদ্ধ যেখানে innerHTML বা outerHTML বৈশিষ্ট্যগুলি অ্যাক্সেস করা হয়, বা যখন একটি উপাদানে getHTML() পদ্ধতিটি চালু করা হয়। এই অপারেশনগুলি বিদ্যমান DOM কাঠামো গ্রহণ করে এবং একটি পাঠ্য HTML উপস্থাপনা তৈরি করে।
এই পরিবর্তনটি HTML পার্সিংকে প্রভাবিত করে না । নিম্নলিখিত HTML বিবেচনা করুন:
<div id="div1" data-content="<u>hello</u>"></div>
<div id="div2" data-content="<u>hello</u>"></div>
উভয় div একইভাবে পার্স করা হবে এবং উভয় ক্ষেত্রেই div.dataset.content "<u>hello</u>" ফিরে আসবে।
কি ভেঙ্গে যাবে না?
আপনি যদি কোনো DOM API ব্যবহার করেন, যেমন getAttribute , getAttributeNS , dataset , বা attributes , বৈশিষ্ট্যের মানগুলি পুনরুদ্ধার করতে, তারা আগের মতই একই ডিকোড করা মান ফিরিয়ে দেবে, বিশেষ করে < এবং > ডিকোডের সাথে।
নিম্নলিখিত উদাহরণটি বিবেচনা করুন, যেখানে সমস্ত console.log লাইন "<u>" লগ করবে :
<div data-content="<u>"></div>
const div = document.querySelector("div");
// All of the following will log "<u>"
console.log(div.getAttribute("data-content"));
console.log(div.dataset.content);
console.log(div.attributes['data-content'].value);
কি ভাঙতে পারে?
innerHTML এবং outerHTML বৈশিষ্ট্য পেতে
আপনি যদি কোনো অ্যাট্রিবিউটের মান বের করতে innerHTML বা outerHTML ব্যবহার করেন, তাহলে আপনার কোড ভেঙে যেতে পারে। নিম্নোক্ত বিষয়গুলি বিবেচনা করুন, যদিও সামান্য জটিল, উদাহরণ:
<div data-content="<u>"></div>
const div = document.querySelector("div");
const content = div.outerHTML.match(/"([^"]+)"/)[1];
console.log(content);
এই কোড এই পরিবর্তনের পরে ভিন্ন আচরণ প্রদর্শন করবে। পূর্বে, content "<u>" এর সমান হত কিন্তু এখন এটি "<u>" .
মনে রাখবেন রেগুলার এক্সপ্রেশন সহ HTML পার্স করার পরামর্শ দেওয়া হয় না । আপনার যদি কোনো অ্যাট্রিবিউটের মান পেতে হয়, তাহলে পূর্ববর্তী বিভাগে বর্ণিত DOM API ব্যবহার করুন।
শেষ থেকে শেষ পরীক্ষা
যদি আপনার কাছে একটি CI/CD পাইপলাইন থাকে যেখানে আপনি এইচটিএমএল তৈরি করতে ক্রোমিয়াম ব্যবহার করেন এবং আপনি একটি স্ট্যাটিক প্রত্যাশিত মানের সাথে এইচটিএমএল তুলনা করার জন্য পরীক্ষা লিখে থাকেন, তাহলে এই পরীক্ষাগুলি ভেঙে যেতে পারে যদি কোনো বৈশিষ্ট্য < বা > থাকে।
এটি একটি প্রত্যাশিত ভাঙ্গন—আপনাকে প্রত্যাশিত মান আপডেট করতে হবে যাতে সমস্ত < এবং > অক্ষরগুলি < এবং >, যথাক্রমে।
সারাংশ
এই ব্লগ পোস্টটি এইচটিএমএল স্পেসিফিকেশনে একটি পরিবর্তন বর্ণনা করেছে যা ব্রাউজারগুলিকে এক্সএসএস মিউটেশনের কিছু দৃষ্টান্ত রোধ করে নিরাপত্তার উন্নতি করার জন্য বৈশিষ্ট্যগুলিতে < এবং > পালাতে শুরু করবে।
পরিবর্তনটি সমস্ত ব্যবহারকারীর জন্য 24 জুন, 2025 তারিখে Chromium (সংস্করণ 138) এবং Firefox (সংস্করণ 140) এ উপলব্ধ হবে। এটি Safari 26 বিটাতেও অন্তর্ভুক্ত করা হয়েছে যা সেপ্টেম্বর 2025 এর কাছাকাছি প্রকাশিত হওয়া উচিত।
আপনি যদি বিশ্বাস করেন যে এই পরিবর্তনটি আপনার ওয়েবসাইটটি ভেঙে দিয়েছে এবং আপনার কাছে এটি ঠিক করার সহজ উপায় নেই, দয়া করে https://issues.chromium.org/ এ একটি বাগ ফাইল করুন৷