Chrome تغییر document.domain را غیرفعال می‌کند

اگر وب‌سایت شما به تنظیم document.domain متکی است، اقدام شما ضروری است.

ماد نالپاس
ایجی کیتامورا

چه چیزی در حال تغییر است و چرا؟

از نسخه ۱۱۵ کروم ، وب‌سایت‌ها قادر به تنظیم document.domain نخواهند بود: کروم document.domain را تغییرناپذیر می‌کند. برای برقراری ارتباط بین مبدا و مبدا، باید از رویکردهای جایگزین مانند postMessage() یا API پیام‌رسانی کانال استفاده کنید.

توجه داشته باشید که این تغییر به تدریج اعمال خواهد شد.

ما انتظار داریم که مرورگرهای دیگر در نهایت این قابلیت را منسوخ و حذف کنند. برای جزئیات بیشتر، بخش سازگاری مرورگر را بررسی کنید.

چرا document.domain را تغییرناپذیر کنیم؟

document.domain برای دریافت یا تنظیم نام میزبان مبدا طراحی شده است. بسیاری از وب‌سایت‌ها document.domain طوری تنظیم می‌کنند که امکان ارتباط بین صفحات یک سایت اما با مبدا متفاوت را فراهم کند.

اگرچه این یک تکنیک راحت است، اما یک ریسک امنیتی ایجاد می‌کند، زیرا سیاست same-origin را تضعیف می‌کند . نگرانی‌های امنیتی پیرامون document.domain منجر به تغییر در مشخصات شده است که به کاربران هشدار می‌دهد از استفاده از آن خودداری کنند .

با جزئیات: چرا document.domain را تغییرناپذیر کنیم؟

نحوه استفاده از document.domain امروزه

بسیاری از وب‌سایت‌ها document.domain طوری تنظیم می‌کنند که امکان ارتباط بین صفحات هم‌سایت اما با منشأ متقابل را فراهم کند.

سایت‌های هم‌سایت اما با منشأ متقابل ، eTLD+1 یکسانی دارند اما زیردامنه‌های آنها متفاوت است.

نحوه‌ی استفاده از document.domain تاکنون به این صورت بوده است:

فرض کنید صفحه‌ای در https://parent.example.com یک صفحه iframe از https://video.example.com را در خود جای داده است. این صفحات دارای eTLD+1 یکسان ( example.com ) با زیر دامنه‌های متفاوت هستند. وقتی document.domain هر دو صفحه روی 'example.com' تنظیم شده باشد، مرورگر با دو مبدا طوری رفتار می‌کند که انگار مبدا یکسانی دارند.

document.domain را برای https://parent.example.com تنظیم کنید:

// Confirm the current origin of "parent.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

document.domain را برای https://video.example.com تنظیم کنید:

// Confirm the current origin of "video.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

اکنون می‌توانید یک دستکاری DOM با منشأ متقابل روی https://parent.example.com در مقابل https://video.example.com ایجاد کنید.

وب‌سایت‌ها document.domain تنظیم می‌کنند تا اسناد مشابه سایت بتوانند راحت‌تر با هم ارتباط برقرار کنند. از آنجا که این تغییر ، سیاست مبدا یکسان را تعدیل می‌کند ، صفحه والد قادر است به سند iframe دسترسی پیدا کند و درخت DOM را پیمایش کند و برعکس.

این یک تکنیک راحت است، با این حال یک خطر امنیتی را ایجاد می‌کند.

نگرانی‌های امنیتی با document.domain

نگرانی‌های امنیتی پیرامون document.domain منجر به تغییر در مشخصات شده است که به کاربران هشدار می‌دهد از استفاده از آن خودداری کنند .

برای مثال، وقتی دو صفحه document.domain را تنظیم می‌کنند، می‌توانند وانمود کنند که منشأ یکسانی دارند. این امر به ویژه زمانی اهمیت پیدا می‌کند که این صفحات از یک سرویس میزبانی مشترک با زیردامنه‌های مختلف استفاده کنند. تنظیم document.domain دسترسی به تمام سایت‌های دیگر میزبانی شده توسط همان سرویس را باز می‌کند، که دسترسی مهاجمان به سایت‌های شما را آسان‌تر می‌کند. این امر به این دلیل امکان‌پذیر است که document.domain بخش شماره پورت دامنه را نادیده می‌گیرد.

برای کسب اطلاعات بیشتر در مورد پیامدهای امنیتی تنظیم document.domain ، صفحه "Document.domain" را در MDN مطالعه کنید.

سازگاری با مرورگرها

چگونه بفهمم که سایت من تحت تأثیر قرار گرفته است؟

اگر وب‌سایت شما تحت تأثیر این تغییر قرار گرفته باشد، کروم در پنل مشکلات DevTools به شما هشدار می‌دهد - این هشدار در سال ۲۰۲۲ اضافه شده است. به پرچم زرد در سمت راست بالای DevTools توجه کنید.

تصویر هشدار مشکل در DevTools

همچنین می‌توانید سایت خود را از طریق ممیزی API منسوخ‌شده LightHouse بررسی کنید تا تمام APIهایی را که قرار است از کروم حذف شوند، پیدا کنید.

اگر API گزارش‌دهی را راه‌اندازی کرده‌اید، Chrome گزارش‌های منسوخ شدن را برای شما ارسال کرده است تا شما را از این منسوخ شدن قریب‌الوقوع مطلع کند. درباره نحوه استفاده از API گزارش‌دهی با سرویس‌های جمع‌آوری گزارش موجود یا با ساخت راهکار داخلی خودتان بیشتر بیاموزید.

چگونه می‌توانم این تغییر را در عمل ببینم؟

این تغییر به تدریج و با شروع از کروم ۱۱۵ اعمال خواهد شد. برای مشاهده‌ی این تغییر در عمل، حتی اگر هنوز در مرورگر کروم شما اعمال نشده است، می‌توانید آن را به روش زیر فعال کنید:

  1. chrome://flags/#origin-agent-cluster-default
  2. فعال کردن را انتخاب کنید.
  3. کروم را مجدداً راه‌اندازی کنید.

از چه جایگزین‌هایی می‌توانم استفاده کنم؟

بهترین گزینه این است که اصلاً document.domain تغییر ندهید، برای مثال، صفحه و تمام فریم‌های تشکیل‌دهنده را در یک مبدأ میزبانی کنید. این روش در همه نسخه‌های همه مرورگرها کار می‌کند. اما این ممکن است نیاز به کار مجدد قابل توجهی روی یک برنامه داشته باشد، بنابراین ارزش دارد که به گزینه‌های دیگری که همچنان از دسترسی‌های بین مبدأیی پشتیبانی می‌کنند نیز نگاهی بیندازید.

به جای document.domain از postMessage() یا API پیام‌رسانی کانال استفاده کنید

در بیشتر موارد استفاده، postMessage() ‎ بین‌منبعی یا API پیام‌رسانی کانال می‌توانند جایگزین document.domain شوند.

در مثال زیر:

  1. https://parent.example.com درون یک iframe از https://video.example.com درخواست می‌کند تا با ارسال پیامی از طریق postMessage() DOM را دستکاری کند.
  2. https://video.example.com به محض دریافت پیام، DOM را دستکاری می‌کند و موفقیت را به والد اطلاع می‌دهد.
  3. https://parent.example.com موفقیت را تأیید می‌کند.

در https://parent.example.com :

// Send a message to https://video.example.com
iframe.postMessage('Request DOM manipulation', 'https://video.example.com');

// Receive messages
iframe.addEventListener('message', (event) => {
  // Reject all messages except ones from https://video.example.com
  if (event.origin !== 'https://video.example.com') return;

  // Filter success messages
  if (event.data === 'succeeded') {
    // DOM manipulation is succeeded
  }
});

در https://video.example.com :

// Receive messages
window.addEventListener('message', (event) => {
  // Reject all messages except ones from https://parent.example.com
  if (event.origin !== 'https://parent.example.com') return;

  // Do a DOM manipulation on https://video.example.com.

  // Send a success message to https://parent.example.com
  event.source.postMessage('succeeded', event.origin);
});

آن را امتحان کنید و ببینید چگونه کار می‌کند. اگر الزامات خاصی دارید که با postMessage() یا API پیام‌رسانی کانال کار نمی‌کند، از طریق @ChromiumDev در توییتر به ما اطلاع دهید یا با استفاده از برچسب document.domain در Stack Overflow سوال کنید.

به عنوان آخرین راه حل، هدر Origin-Agent-Cluster: ?0 را ارسال کنید.

اگر دلایل محکمی برای ادامه تنظیم document.domain دارید، می‌توانید هدر پاسخ Origin-Agent-Cluster: ?0 را به همراه سند هدف ارسال کنید.

Origin-Agent-Cluster: ?0

هدر Origin-Agent-Cluster به مرورگر دستور می‌دهد که آیا سند باید توسط خوشه عامل دارای کلید مبدأ مدیریت شود یا خیر. برای کسب اطلاعات بیشتر در مورد Origin-Agent-Cluster ، درخواست جداسازی عملکرد با هدر Origin-Agent-Cluster را مطالعه کنید.

وقتی این هدر را ارسال می‌کنید، سند شما می‌تواند حتی پس از اینکه به طور پیش‌فرض تغییرناپذیر شد، به تنظیم document.domain ادامه دهد.

تمام اسناد دیگری که به آن رفتار نیاز دارند نیز باید یک Origin-Agent-Cluster ارسال کنند (توجه داشته باشید که اگر فقط یک سند آن را تنظیم کند، document.domain هیچ تاثیری نخواهد داشت).

پیکربندی OriginAgentClusterDefaultEnabled برای سیاست سازمانی

به صورت اختیاری، مدیر شما می‌تواند سیاست OriginAgentClusterDefaultEnabled را روی false پیکربندی کند تا document.domain به طور پیش‌فرض در نمونه‌های Chrome در سراسر سازمان شما قابل تنظیم باشد. برای کسب اطلاعات بیشتر، فهرست و مدیریت سیاست‌های سازمانی Chrome | مستندات را مطالعه کنید.

منابع

تقدیرنامه‌ها

عکس از فینان اکبر در Unsplash