از کروم ۱۳۲، توسعهدهندگان میتوانند در یک نسخه آزمایشی توسعهدهندگان برای رویکردی جدید به پاپآپهای وب شرکت کنند: پاپآپهای پارتیشنبندیشده. این نسخه آزمایشی توسعهدهندگان فقط برای دسکتاپ در دسترس است و این ویژگی هنوز در اندروید در دسترس نیست.
پاپآپهای پارتیشنبندیشده نوع جدیدی از پاپآپها هستند که برای تعاملات کوتاهمدت، مانند ورود به سیستم یا تأیید سریع، طراحی شدهاند. این پاپآپها محتوای وب را با دو ویژگی منحصر به فرد بارگذاری میکنند:
چرا به پاپینهای پارتیشنبندیشده نیاز داریم؟
پاپینهای پارتیشنبندیشده برای حفظ ویژگیهای حریم خصوصی یک iframe پارتیشنبندیشده و ویژگیهای امنیتی پاپآپها طراحی شدهاند.
با افزایش تعداد کاربرانی که بدون کوکیهای شخص ثالث به مرور صفحات وب میپردازند، جریانهایی که به ذخیره دادهها در یک پنجره بازشو برای بازیابی در یک زمینه شخص ثالث در آینده (به عنوان مثال، برای حفظ جلسه کاربر در سایتهای مختلف) متکی هستند، ممکن است مختل شوند. هدف از پاپآپهای پارتیشنبندی شده، حل این مشکل است.
پاپینهای پارتیشنبندیشده چگونه کار میکنند؟
فضای ذخیرهسازی هر پاپین پارتیشنبندی شده به بازکنندهی آن پارتیشنبندی میشود. پارتیشنبندی فضای ذخیرهسازی، دسترسی به دادههای بینسایتی را محدود میکند و خطرات ردیابی و حملات تزریق اسکریپت را کاهش میدهد. برای آشنایی با نحوهی عملکرد پارتیشنبندی فضای ذخیرهسازی، مستندات ما را مطالعه کنید.
یک وبسایت opener.example را در نظر بگیرید که محتوا را از third-party.example جاسازی میکند. برای نمایش محتوای شخصیسازیشده در opener.example ، کاربر باید در third-party.example وارد سیستم شود. وقتی کوکیهای شخص ثالث در مرورگر کاربر مسدود میشوند، جریان پاپآپ فعلی به شرح زیر است:
- کاربر روی دکمه ورود کلیک میکند.
- یک کادر محاورهای باز میشود.
- کاربر از طریق context سطح بالای
third-party.exampleوارد سیستم میشود و یک کوکی احراز هویت پارتیشنبندی نشده نوشته میشود. - محتوای
third-party.exampleکه درopener.exampleجاسازی شده است، به کوکیهای سطح بالای خود که درthird-party.exampleنوشته شدهاند، زمانی که در یک زمینه شخص اول ارائه شده است، دسترسی ندارد. این اتفاق میافتد زیرا کوکی احراز هویت پارتیشنبندی نشده است و بنابراین یک کوکی شخص ثالث است.
third-party.example که در opener.example تعبیه شده است، به مجموعه کوکیهای پارتیشنبندی نشده خود در متن سطح بالای پنجره بازشو third-party.example دسترسی ندارد.فضای ذخیرهسازی یک popin پارتیشنبندی شده به opener پارتیشنبندی میشود. این کار مراحل ۳-۴ جریانها را تغییر میدهد:
کاربر از طریق context سطح بالای
third-party.exampleوارد سیستم میشود. از آنجایی که در یک popin پارتیشنبندی شده باز است، فضای ذخیرهسازی توسطopener.exampleپارتیشنبندی میشود.محتوای
third-party.exampleکه درopener.exampleجاسازی شده است، به کوکی خود که در popin تنظیم شده است، دسترسی دارد، زیرا آنها فضای ذخیرهسازی پارتیشنبندی شده یکسانی را به اشتراک میگذارند.
third-party.example که در opener.example تعبیه شده است، به مجموعه کوکی پارتیشن بندی شده خود در زمینه سطح بالای popin مربوط به third-party.example دسترسی دارد، زیرا کوکی توسط opener.example پارتیشن بندی شده است.رابط کاربری شبه-مودال نسبت به تب آغازین آن
هدف از پاپینهای پارتیشنبندیشده این است که به کاربر کمک کنند تا بفهمد که بازکننده و پاپین به هم مرتبط هستند:
- وقتی کاربر به تب دیگری میرود، پاپین بهطور خودکار نامرئی و غیرقابلدسترس میشود، همانطور که یک پنجرهی مودال فقط زمانی قابل مشاهده است که تب بازکننده فعال باشد.
- وقتی کاربر به برگه بازکننده برمیگردد، پاپین دوباره نمایش داده میشود.
- کاربر نمیتواند در نوار آدرس مرورگر پاپین تغییراتی ایجاد کند.
امتحانش کن.
کروم ۱۳۲ در حال معرفی یک نسخه آزمایشی برای توسعهدهندگان برای ویژگی Partitioned Popins است. این بدان معناست که این ویژگی در پشت یک پرچم (flag) در دسترس خواهد بود. در اینجا نحوه امتحان کردن Partitioned Popins آورده شده است:
- مطمئن شوید که از کروم ۱۳۲ یا بالاتر استفاده میکنید.
- به
chrome://flags#partitioned-popinsبروید و feature flag را فعال کنید. - کروم را مجدداً راهاندازی کنید.
- نسخه آزمایشی ما را امتحان کنید.
از پاپینهای پارتیشنبندیشده در وبسایت خود استفاده کنید
برای استفاده از یک popin پارتیشنبندی شده در وبسایت خود، متد window.open() را با پارامتر popin ارسالی فراخوانی کنید:
window.open("third-party-popin.example", "_blank", "popin");
بازخورد خود را به اشتراک بگذارید
ما در حال بررسی پاپینهای پارتیشنبندی شده و دریافت بازخورد از توسعهدهندگان هستیم. در اینجا چند سناریوی احتمالی برای استفاده از آنها آورده شده است:
- جریان احراز هویت کاربر . اگر یک جریان احراز هویت سفارشی پیادهسازی کردهاید و احراز هویت در دامنهای متفاوت از سایت شما اتفاق میافتد (برای مثال،
site.exampleکاربران از طریقauth-site.exampleوارد سیستم میشوند)، سعی کنید صفحه احراز هویت را در یک پنجره بازشو باز کنید تا از کوکی جلسه در صفحه آغازین استفاده کنید. - محتوای جاسازیشده. از پاپینهای پارتیشنبندیشده برای نمایش محتوای اضافی از یک ویجت شخص ثالث، مانند یک کادر تنظیمات، یک تصویر یا یک PDF (یا محتوای دیگری که معمولاً در یک پاپآپ بارگذاری میشود) و رندر شده در یک پنجره بزرگتر استفاده کنید. در این حالت، پاپینهای پارتیشنبندیشده با هدف حفظ وضعیت جلسه کاربر بین ویجت شخص ثالث و سایت شما عمل میکنند.
اگر هر یک از این سناریوها را در راهحلهای خود دارید، موارد استفاده دیگری را در ذهن دارید یا میخواهید به شکلدهی آینده این ویژگی کمک کنید، آن را امتحان کنید و به ما اطلاع دهید:
- آیا با مشکلی مواجه شدید؟
- آیا پیشنهادی برای تجربه کاربری بهتر دارید؟
- آیا پیشنهادی برای رابط کاربری بهتر دارید؟ به طور خاص، آیا متوجه شدهاید که رابط کاربری به وضوح نشان میدهد که بازکننده و ترکنده به هم مرتبط هستند؟
- این قابلیت را چقدر مفید میدانید؟
- آیا موارد استفاده دیگری وجود دارد که مایل به استفاده از پاپینهای پارتیشنبندی شده باشید؟
برای به اشتراک گذاشتن نظرات خود، یک مشکل را در GitHub ثبت کنید.