بهبودهای پیشنهادی <مجوز> عنصر

Thomas Steiner

تاریخ انتشار: 12 می 2025

عنصر <permission> HTML پیشنهادی هنوز در مرحله آزمایشی اصلی است، زیرا تیم Chrome آن را اصلاح می‌کند و بر اساس پایه‌ای که در آزمایش اولیه اولیه ما گذاشته شده است، است. این پست پیشرفت‌هایی را به اشتراک می‌گذارد که هدف آن ارائه انعطاف‌پذیری و کنترل بیشتر هنگام درخواست مجوز در برنامه‌های وب است. برای یک نمای کلی جامع از معرفی عنصر <permission> و قابلیت های اولیه آن، به مقاله قبلی ما آزمایش مبدا برای عنصر جدید <permission> HTML مراجعه کنید.

پشتیبانی از محتوا برای UX بازگشتی

عنصر <permission> در ابتدا تا Chrome 136 به عنوان یک عنصر خالی بدون محتوا تعریف شده بود. از Chrome 137 از محتوا پشتیبانی می کند، به این معنی که اکنون باید آن را با برچسب های باز و بسته علامت گذاری کنید:

<permission>
  <!-- optional content -->
</permission>

این تغییر به شما امکان می‌دهد رابط‌های کاربری جایگزین را در محتوای عنصر قرار دهید. این بازگشت‌ها در مرورگرهایی نمایش داده می‌شوند که عنصر <permission> را پشتیبانی نمی‌کنند یا زمانی که یک ویژگی type پشتیبانی‌نشده مشخص شده باشد. این باعث می‌شود که تخریب زیباتر و بهبود تجربه کاربری در محیط‌های مختلف مرورگر تضمین شود.

<!-- Invalid `type` attribute value -->
<permission type="not-supported">
  <p>Your browser does not support the specified <code>type</code>.</p>
</permission>

تشخیص ویژگی های برنامه ای دقیق تر

برای کمک به شما در تعیین پشتیبانی از انواع مجوزهای خاص، یک روش ثابت به isTypeSupported() معرفی کرده‌ایم:

HTMLPermissionElement.isTypeSupported('geolocation');

این روش یک بولی برمی گرداند که نشان می دهد آیا نوع مجوز مشخص شده پشتیبانی می شود یا خیر. همراه با تشخیص ویژگی موجود، typeof HTMLPermissionElement !== 'undefined' ، اکنون می توانید به صورت برنامه نویسی مطمئن شوید که هم از عنصر <permission> پشتیبانی می کند و هم از انواع مجوزهای خاص پشتیبانی می کند.

توجه داشته باشید که می‌توانید چندین نوع مجوز جدا شده با فاصله (مثلاً "camera microphone" ) را نیز ارسال کنید و نشان می‌دهد که آیا رشته کلی یک مقدار "type" معتبر است یا خیر. برای مثال، فراخوانی isTypeSupported() با پارامترهای زیر این نتایج را برمی‌گرداند:

• "camera" → true
• "geolocation" → true
• "camera geolocation" ← false (اگرچه انواع به صورت جداگانه پشتیبانی می شوند، ترکیب اینطور نیست.)

نام رویدادها به روز شد

در Chrome 136، دو رویداد جدید را برای جایگزینی موارد قبلی معرفی کردیم:

• onpromptdismiss (جایگزین ondismiss می شود)
• onpromptaction (جایگزین onresolve می شود)

این رویدادهای جدید معنایی واضح‌تر را ارائه می‌کنند و با رفتار عنصر هماهنگ‌تر می‌شوند. رویدادهای قدیمی‌تر در Chrome 138 منسوخ می‌شوند، بنابراین توصیه می‌کنیم کنترل‌کننده‌های رویداد خود را بر این اساس به‌روزرسانی کنید.

پشتیبانی از آیکون

ما در حال کار بر روی فعال کردن پشتیبانی از نمادها در عنصر <permission> ، هدفمند برای Chrome 138 هستیم. این ویژگی به شما امکان می‌دهد نمادهای از پیش تعریف‌شده مربوط به نوع مجوز را با گزینه‌های سبک محدود مانند تنظیمات رنگ و اندازه نمایش دهید. جزئیات دقیق API هنوز در حال نهایی شدن است. 

مثال‌های زیر پیش‌فرض، رنگ پری متفاوت و بدون رنگ پر کردن را نشان می‌دهند، اما با یک طرح کلی سیاه.

یک ظاهر طراحی پیش فرض

رنگ پیش‌فرض نماد همان رنگ متن عنصر مجوز است.

استایل اصلاح شده

مثال‌های زیر تغییرات نمونه‌ای را در استایل پیش‌فرض نشان می‌دهند.

تغییر رنگ آیکون

::permission-icon {
  fill: black;
}

تغییر طرح کلی آیکون

::permission-icon {
  fill: white;
  stroke: black;
  stroke-width: 20px;
}

نماد را غیرفعال کنید

پس از راه اندازی، نماد به طور پیش فرض فعال می شود. اگر می خواهید نماد را غیرفعال کنید، می توانید با استفاده از CSS زیر این کار را انجام دهید

::permission-icon {
  display: none;
}

دستورالعمل های سبک

برای راهنمایی جامع در مورد استایل کردن عنصر <permission> ، از جمله بهترین شیوه ها و محدودیت ها، به دستورالعمل های سبک <permission> مراجعه کنید. این منبع دستورالعمل‌های دقیقی را ارائه می‌دهد تا به شما کمک کند به طور مؤثری به عنصر در برنامه‌های خود سبک دهید.

پشتیبانی از پلتفرم و قابلیت گسترده

عنصر <permission> اکنون از پلتفرم‌ها و قابلیت‌های اضافی پشتیبانی می‌کند:

• پشتیبانی از اندروید: این عنصر اکنون در دستگاه‌های اندرویدی کاربردی است و کاربرد آن را در پلتفرم‌های مختلف کاربر گسترش می‌دهد.
• پشتیبانی از موقعیت جغرافیایی: اکنون می توانید مجوزهای type="geolocation" با استفاده از عنصر <permission> با یک ویژگی بولی preciselocation درخواست کنید. در حالی که مشخصه preciselocation فقط بر روی عبارت اعلان تأثیر می گذارد، ما به طور فعال در حال کار بر روی تمایز بین مجوزهای مکان دقیق و درشت در به روز رسانی های آینده هستیم.

نتیجه گیری

این پیشرفت‌ها در عنصر <permission> بخشی از تلاش‌های مداوم ما برای ساده‌سازی درخواست‌های مجوز و بهبود تجربه کاربر در وب است. ما شما را تشویق می‌کنیم که این ویژگی‌های جدید را آزمایش کنید و بازخورد ارائه دهید تا به ما در اصلاح و تکامل این قابلیت کمک کنید.