مدیریت ناوبری در PWA های نصب شده

Demián Renzulli

Dan Murphy

Dibyajyoti Pal

Vincent Scheib

تاریخ انتشار: 19 اوت 2025

مدیریت ناوبری شامل روش هایی برای کنترل نحوه مدیریت یک برنامه وب پیشرو (PWA) با ناوبری کاربر است. یکی از مؤلفه‌های حیاتی این، ضبط پیمایش است، فرآیند مرورگر که تعیین می‌کند آیا با کلیک کردن روی پیوند باید PWA نصب‌شده راه‌اندازی شود یا یک برگه مرورگر جدید باز شود.

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

بخش کنترل‌های برنامه‌نویس نحوه سفارشی‌سازی پیمایش را برای ارائه بهترین تجربه راه‌اندازی ممکن برای PWA به اشتراک می‌گذارد.

رفتار پیش فرض جدید

کروم برای هماهنگی با تنظیمات برگزیده کاربر و کاهش اصطکاک، نحوه مدیریت پیوندها را استاندارد می کند. پیش از این، این رفتار در پلتفرم‌ها ناسازگار بود. دستگاه‌های تلفن همراه معمولاً راه‌اندازی برنامه‌های نصب‌شده را در اولویت قرار می‌دهند، در حالی که مرورگرهای دسک‌تاپ ابتدا پیوندی را در یک برگه باز می‌کنند قبل از اینکه نشان دهند برنامه می‌تواند آن را مدیریت کند.

رویکرد جدید و یکپارچه برای ضبط ناوبری، به طور خودکار پیوندها را در PWA نصب شده مربوطه باز می کند. پیوندها فقط در صورتی به برگه مرورگر باز می‌گردند که PWA نصب نشده باشد یا کاربر از آن انصراف داده باشد. این رفتار جدید از Chrome 139 برای Windows، Mac و Linux در دسترس است، با پشتیبانی ChromeOS در نسخه بعدی.

فرآیند مدیریت ناوبری

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

• اقدامات کاربر: شامل تعاملاتی مانند کلیک کردن یا ضربه زدن روی پیوندها می شود.
• تصمیمات مرورگر: شامل وظایف و تصمیماتی است که توسط مرورگر مدیریت می شود، مانند رفتارهای پیش فرض، مانند ضبط ناوبری.
• کنترل‌های برنامه‌نویس: شامل API‌های وب است که به توسعه‌دهندگان اجازه می‌دهد مرورگر را در مورد نحوه رسیدگی به وظایف خاص راهنمایی کنند.

تعامل این عناصر تعیین می کند که آیا PWA در یک پنجره مستقل باز می شود یا یک تب مرورگر.

یک مورد اساسی استفاده از مدیریت ناوبری زمانی است که کاربر روی پیوندی به PWA نصب شده از صفحه دیگری در مرورگر کلیک یا ضربه می‌زند. مثال زیر در مورد کاربری که Google Chat PWA را نصب کرده و روی پیوندی به آن از دعوتنامه Google Calendar کلیک می‌کند، توضیح می‌دهد.

اقدامات کاربر

هر اقدام کاربر از سه عنصر کلیدی تشکیل شده است: رویداد (مانند یک کلیک یا ضربه)، سطحی که در آن انجام می شود (مانند یک صفحه وب یا میانبر دسکتاپ)، و نوع پیوند فعال شده (مانند URL HTTPS). برای مثال، اقدام کاربر می‌تواند روی پیوندی به https://chat.google.com/meeting_room_id در محدوده Google Chat PWA از یک صفحه وب در calendar.google.com کلیک کند.

تصمیمات مرورگر

پس از یک اقدام کاربر، مانند کلیک کاربر در مرحله قبل، مرورگر فرآیند ضبط پیمایش را اجرا می کند تا تصمیم بگیرد که آیا پیوندها باید در برگه مرورگر باز شوند یا در یک PWA نصب شده. از مراحل زیر تشکیل شده است:

1. تعیین اینکه آیا پیمایش قابل ضبط است : به طور کلی، یک پیمایش در صورتی قابل ضبط در نظر گرفته می شود که یک قاب جدید ایجاد کند و در یک زمینه مرور کمکی باز نشود.
2. شناسایی یک PWA کنترل‌کننده : اگر پیمایش قابل ضبط باشد، مرورگر سعی می‌کند PWA را پیدا کند که URL را «کنترل» کند ( در محدوده تعریف‌شده در مانیفست برنامه وب قرار می‌گیرد).
3. بررسی اولویت کاربر : اگر یک PWA کنترل کننده پیدا شود، مرورگر اولویت کاربر را بررسی می کند. اگر کاربر در تنظیمات برنامه انصراف نداده باشد، PWA راه اندازی می شود. در غیر این صورت، پیوند در یک برگه مرورگر جدید باز می شود.
4. راه اندازی PWA : مرورگر PWA را با استفاده از الگوریتم Launch Handling راه اندازی می کند. می‌توانید با استفاده از Launch Handler API ، که در ادامه توضیح داده می‌شود، بر این موضوع تأثیر بگذارید.

نمودار زیر این فرآیند را به طور خلاصه نشان می دهد:

کنترل های توسعه دهنده

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

Handler API را راه اندازی کنید

این API زمانی وارد عمل می‌شود که مرورگر تصمیم می‌گیرد PWA را راه‌اندازی کند و به شما امکان می‌دهد نحوه راه‌اندازی آن را کنترل کنید - برای مثال، در یک پنجره جدید یا موجود.

نحوه راه‌اندازی PWA از طریق عضو launch_handler در مانیفست برنامه وب، که شامل یک زیرفیلد به نام client_mode است را تعریف کنید. این زیرفیلد تعیین می کند که آیا یک پنجره جدید یا موجود باید استفاده شود و اینکه آیا باید پیمایش شود. مقادیر مجاز برای client_mode عبارتند از:

• focus-existing : برای مدیریت پیوند در یک پنجره برنامه موجود، مانند PWA که قبلاً در حالت مستقل اجرا می شود.
• navigate-existing : در این گزینه که اخیراً با آن تعامل داشته است، زمینه مرور در یک پنجره برنامه وب به آدرس URL هدف راه اندازی هدایت می شود.
• navigate-new : با این گزینه یک زمینه مرور جدید در پنجره برنامه وب ایجاد می شود تا URL هدف راه اندازی بارگیری شود.

از launchQueue API برای ارائه پارامترهای اضافی و رسیدگی به موارد خاص استفاده کنید. Launch Handler API از Chrome 110 در دسترس است، اما با به‌روزرسانی ضبط ناوبری بسیار مفیدتر می‌شود. می‌توانید در مستندات Launch Handler API درباره آن اطلاعات بیشتری کسب کنید.

سایر API های مرتبط

علاوه بر راه‌اندازی، سایر APIها نیز بسته به نیازهای خاص برنامه شما می‌توانند در این فرآیند نقش داشته باشند. اینها شامل کنترل‌کننده‌های پروتکل URL است که به یک برنامه وب اجازه می‌دهد تا توانایی خود را برای مدیریت طرح‌های URL فراتر از http و https استاندارد (برای مثال، پروتکل‌های استاندارد مانند mailto: یا پروتکل‌های سفارشی مانند web+music ) ثبت کند. همچنین، Web App Scope Extensions API (در حال حاضر در دست توسعه) به شما امکان می‌دهد دامنه PWA خود را گسترش دهید تا پیوندهایی از مبداهای دیگر، از جمله زیر دامنه‌ها را ضبط کنید، به طوری که وقتی کاربر روی پیوندی از مبدأ مرتبط کلیک می‌کند، PWA می‌تواند راه‌اندازی شود. پرداختن عمیق به آنها از حوصله این مقاله خارج است، اما برای کسب اطلاعات بیشتر می توانید پیوندهای مربوطه را بررسی کنید.

مورد استفاده: گرفتن پیوندهای Google Chat در Chat PWA

برای جمع بندی، در مثال کلیک روی پیوند تقویم Google به اتاق چت Google، برای کاربری که قبلاً Google Chat PWA را نصب کرده است، یاد بگیرید که چگونه قطعات مختلف با هم کار می کنند.

قبل از ضبط پیمایش

در ویدیوی زیر، کاربری یک جلسه تقویم گوگل ایجاد می کند و سه مهمان را دعوت می کند. برنامه Calendar به طور خودکار یک پیوند گپ Google ایجاد می کند که شامل همه شرکت کنندگان می شود. هنگامی که کاربر روی این لینک کلیک می کند، اتاق گفتگو در یک برگه مرورگر جدید باز می شود. سپس یک نماد در نوار آدرس نشان می دهد که PWA مربوطه نصب شده است، اما کاربر باید آن را به صورت دستی راه اندازی کند. این رفتار قبل از به‌روزرسانی ضبط ناوبری بود:

پس از ضبط ناوبری

ویدیوی زیر همان گردش کار کاربر را نشان می‌دهد، اما اکنون با رفتار ثبت ناوبری جدید. در این نسخه، با کلیک بر روی پیوند Google Chat از Google Calendar، اتاق چت مربوطه به طور مستقیم در PWA نصب شده باز می شود. علاوه بر این، تیم Google Chat با افزودن ویژگی launch_handler به مانیفست برنامه وب، Launch Handling را پیاده سازی کرده است. با تنظیم client_mode آن روی focus-existing ، اطمینان حاصل می‌کنند که پیوند در یک نمونه موجود از PWA باز می‌شود، در صورتی که قبلاً در حال اجرا است. با حذف تأخیر مربوط به باز کردن یک برگه مرورگر جدید و سپس راه‌اندازی بارگذاری صفحه، «زمان تعامل با کاربر» می‌تواند با طراحی سریع‌تر باشد. در واقع، Google Chat با حذف نیاز به راه‌اندازی اپلیکیشن جدید، تأخیر ناوبری را به طور قابل توجهی بهبود بخشید.

نتیجه گیری و مراحل بعدی

این مقاله رفتار پیش‌فرض ضبط پیمایش را که در Chrome 139 در دسترس است بررسی می‌کند، با تمرکز بر یک مورد معمول استفاده از کاربر که روی پیوند HTTPS در محدوده یک PWA نصب‌شده کلیک می‌کند. می توانید اطلاعات بیشتر و موارد استفاده را در مدیریت ناوبری در PWAهای نصب شده بیابید. نمودار زیر تفکیک کامل موارد استفاده، از جمله رویدادهای کاربر، سطوح و پروتکل‌ها را به همراه نتایج مربوطه نشان می‌دهد:

مدیریت ناوبری یک جنبه حیاتی و در عین حال اغلب نادیده گرفته شده از UX برنامه شما است، زیرا نقطه ورود آن را کنترل می کند. ویژگی‌ها و پیوندهای پوشش داده شده در این مقاله می‌توانند به شما کمک کنند تا به بهترین تجربه ممکن شبیه برنامه برای PWA خود برسید.