نحوه انتقال به Manifest V3 برای برنامه های افزودنی کروم

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

همانطور که در حال تقلا بودم تا بفهمم چه مشکلی دارد، خجالتم را زیر فرش فرو بردم و بلافاصله به دنیای برنامه های افزودنی کروم بازگشتم. متأسفانه، اطلاعات مربوط به Manifest V3 کمیاب بود و درک سریع این انتقال برای من دشوار بود.

ناگفته نماند که با یک شغل معلق، مجبور شدم با زحمت راهم را طی کنم اسناد توسعه دهنده کروم گوگل و خودم همه چیز را بفهمم در حالی که کار را انجام دادم، نمی خواستم دانش و تحقیقاتم در این زمینه به هدر برود و تصمیم گرفتم آنچه را که آرزو می کردم در سفر یادگیری خود به آسانی به آن دسترسی داشته باشم به اشتراک بگذارم.

چرا انتقال به Manifest 3 مهم است

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

انتقال به Manifest V3 را می توان اینگونه خلاصه کرد:

1. این انتقال از سال 2018 ادامه دارد.
2. Manifest V3 رسماً در ژانویه 2023 عرضه خواهد شد.
3. تا ژوئن 2023، برنامه‌های افزودنی که Manifest V2 را اجرا می‌کنند، دیگر در فروشگاه وب Chrome در دسترس نخواهند بود.
4. برنامه‌های افزودنی که با قوانین جدید معرفی‌شده در Manifest V3 مطابقت ندارند، در نهایت از فروشگاه وب Chrome حذف خواهند شد.

یکی از اهداف اصلی Manifest V3 ایمن کردن کاربران و بهبود تجربه کلی مرورگر است. پیش از این، بسیاری از برنامه‌های افزودنی مرورگر به کد موجود در فضای ابری متکی بودند، به این معنی که این کار ممکن بود دشوار باشد ارزیابی کنید که آیا تمدید خطرناک است یا خیر. Manifest V3 قصد دارد با الزام برنامه‌های افزودنی حاوی تمام کدهایی که اجرا می‌کنند، به این مشکل رسیدگی کند و به Google اجازه دهد آنها را اسکن کند و خطرات احتمالی را شناسایی کند. همچنین افزونه‌ها را مجبور می‌کند تا برای تغییراتی که می‌توانند در مرورگر اعمال کنند، از Google مجوز درخواست کنند.

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

به طور خلاصه، تمام تلاش شما در ایجاد برنامه‌های افزودنی که از Manifest V2 استفاده می‌کنند، می‌تواند بیهوده باشد، اگر در ماه‌های آینده این انتقال را انجام ندهید.

تفاوت های کلیدی بین Manifest V2 و V3

تفاوت های زیادی بین این دو وجود دارد، و در حالی که من به شدت توصیه می کنم که ادامه مطلب را بخوانید راهنمای کروم "مهاجرت به Manifest V3".، در اینجا خلاصه ای کوتاه و شیرین از نکات کلیدی آورده شده است:

1. کارگران خدماتی صفحات پس زمینه را در Manifest V3 جایگزین کنید.
2. اصلاح درخواست شبکه با جدید انجام می شود declarativeNetRequest API در Manifest V3.
3. در Manifest V3، برنامه‌های افزودنی فقط می‌توانند جاوا اسکریپتی را اجرا کنند که در بسته آن‌ها گنجانده شده است و نمی‌توانند از کدهای میزبانی از راه دور استفاده کنند.
4. Manifest V3 معرفی می کند promise از بسیاری از روش‌ها پشتیبانی می‌کند، اگرچه تماس‌های برگشتی همچنان به عنوان یک جایگزین پشتیبانی می‌شوند.
5. مجوزهای میزبان در Manifest V3 یک عنصر جداگانه است و باید در آن مشخص شود "host_permissions" رشته.
6. خط‌مشی امنیت محتوا در Manifest V3 یک شی با اعضایی است که زمینه‌های سیاست امنیت محتوای جایگزین (CSP) را نشان می‌دهند، نه رشته‌ای که در Manifest V2 بود.

در مانیفست ساده Chrome Extension که پس‌زمینه صفحه وب را تغییر می‌دهد، ممکن است به شکل زیر باشد:

// Manifest V2
{ "manifest_version": 2, "name": "Shane's Extension", "version": "1.0", "description": "A simple extension that changes the background of a webpage to Shane's face.", "background": { "scripts": ["background.js"], "persistent": true }, "browser_action": { "default_popup": "popup.html" }, "permissions": [ "activeTab", ], "optional_permissions": ["<all_urls>"]
}

// Manifest V3
{ "manifest_version": 3, "name": "Shane's Extension", "version": "1.0", "description": "A simple extension that changes the background of a webpage to Shane's face.", "background": { "service_worker": "background.js" }, "action": { "default_popup": "popup.html" }, "permissions": [ "activeTab", ], "host_permissions": [ "<all_urls>" ]
}

اگر متوجه شدید که برخی از برچسب های بالا برای شما غریبه به نظر می رسند، به خواندن ادامه دهید تا دقیقاً آنچه را که باید بدانید.

نحوه انتقال هموار به Manifest V3

من انتقال به Manifest V3 را در چهار حوزه کلیدی خلاصه کرده ام. البته، در حالی که زنگ‌ها و سوت‌های زیادی در Manifest V3 جدید وجود دارد که باید از Manifest V2 قدیمی پیاده‌سازی شوند، اعمال تغییرات در این چهار زمینه، افزونه Chrome شما را به‌خوبی در مسیر درست برای انتقال نهایی قرار می‌دهد.

چهار حوزه کلیدی عبارتند از:

1. به روز رسانی ساختار اصلی مانیفست شما.
2. مجوزهای میزبان خود را تغییر دهید.
3. خط مشی امنیت محتوا را به روز کنید.
4. مدیریت درخواست شبکه خود را اصلاح کنید.

با این چهار حوزه، اصول Manifest شما برای انتقال به Manifest V3 آماده خواهد بود. بیایید هر یک از این جنبه‌های کلیدی را به تفصیل بررسی کنیم و ببینیم چگونه می‌توانیم برای محافظت از برنامه افزودنی Chrome شما از این انتقال در آینده کار کنیم.

به روز رسانی ساختار اصلی مانیفست شما

به‌روزرسانی ساختار اصلی مانیفست اولین گام برای انتقال به Manifest V3 است. مهمترین تغییری که باید انجام دهید تغییر ارزش آن است "manifest_version" عنصر به 3، که مشخص می کند از مجموعه ویژگی Manifest V3 استفاده می کنید.

یکی از تفاوت‌های عمده بین Manifest V2 و V3، جایگزینی صفحات پس‌زمینه با یک کارگر خدمات افزونه در Manifest V3 است. شما باید کارمند خدمات را تحت عنوان ثبت نام کنید "background" زمینه، با استفاده از "service_worker" کلید کنید و یک فایل جاوا اسکریپت را مشخص کنید. حتی اگر Manifest V3 از چندین اسکریپت پس‌زمینه پشتیبانی نمی‌کند، می‌توانید به‌صورت اختیاری سرویس‌کار را به‌عنوان یک ماژول ES با مشخص کردن آن اعلام کنید. "type": "module"، که به شما امکان می دهد کد بیشتری وارد کنید.

در Manifest V3، "browser_action" و "page_action" خواص در یک واحد متحد می شوند "action" ویژگی. شما باید این ویژگی ها را جایگزین کنید "action" در مانیفست شما به طور مشابه، "chrome.browserAction" و "chrome.pageAction" APIها در Manifest V3 در یک API Action یکپارچه می شوند و شما باید به این API مهاجرت کنید.

// Manifest V2 "background": { "scripts": ["background.js"], "persistent": false
}, "browser_action": { "default_popup": "popup.html"
},

// Manifest V3 "background": { "service_worker": "background.js"
}, "action": { "default_popup": "popup.html"
}

به طور کلی، به‌روزرسانی ساختار اصلی مانیفست شما یک گام مهم در فرآیند انتقال به Manifest V3 است، زیرا به شما امکان می‌دهد از ویژگی‌ها و تغییرات جدید معرفی‌شده در این نسخه از API استفاده کنید.

مجوزهای میزبان خود را تغییر دهید

مرحله دوم در انتقال به Manifest V3 تغییر مجوزهای میزبان شما است. در Manifest V2، شما مجوزهای میزبان را در "permissions" فیلد در فایل مانیفست در Manifest V3، مجوزهای میزبان یک عنصر جداگانه هستند و شما باید آنها را در قسمت مشخص کنید "host_permissions" فیلد در فایل مانیفست

در اینجا مثالی از نحوه تغییر مجوزهای میزبان خود آورده شده است:

// Manifest V2 "permissions": [ "activeTab", "storage", "http://www.css-tricks.com/", ":///*" ]

// Manifest V3 "permissions": [ "activeTab", "scripting", "storage"
], "host_permissions": [ "http://www.css-tricks.com/" ], "optional_host_permissions": [ ":///*" ]

خط مشی امنیت محتوا را به روز کنید

برای اینکه CSP افزونه Manifest V2 خود را به‌روزرسانی کنید تا با Manifest V3 مطابقت داشته باشد، باید تغییراتی در فایل مانیفست خود ایجاد کنید. در Manifest V2، CSP به عنوان یک رشته در مشخص شد "content_security_policy" میدان مانیفست

در Manifest V3، CSP اکنون یک شی با اعضای مختلف است که زمینه‌های جایگزین CSP را نشان می‌دهند. به جای تک "content_security_policy" اکنون باید فیلدهای جداگانه ای را برای آن مشخص کنید "content_security_policy.extension_pages" و "content_security_policy.sandbox"بسته به نوع صفحات افزونه ای که استفاده می کنید.

همچنین باید هر گونه ارجاع به دامنه های خارجی را حذف کنید "script-src", "worker-src", "object-src"و "style-src" بخشنامه ها در صورت وجود. مهم است که این به‌روزرسانی‌ها را در CSP خود انجام دهید تا از امنیت و پایداری برنامه افزودنی خود در Manifest V3 اطمینان حاصل کنید.

// Manifest V2 "content_security_policy": "script-src 'self' https://css-tricks.com; object-src 'self'"

// Manfiest V3 "content_security_policy.extension_pages": "script-src 'self' https://example.com; object-src 'self'", "content_security_policy.sandbox": "script-src 'self' https://css-tricks.com; object-src 'self'"

مدیریت درخواست شبکه خود را اصلاح کنید

آخرین مرحله در انتقال به Manifest V3، تغییر نحوه رسیدگی به درخواست شبکه است. در Manifest V2، شما باید از آن استفاده می‌کردید chrome.webRequest API برای اصلاح درخواست های شبکه. با این حال، این API در Manifest V3 جایگزین شده است declarativeNetRequest API

برای استفاده از این API جدید، باید آن را مشخص کنید declarativeNetRequest اجازه در مانیفست خود داشته باشید و کد خود را برای استفاده از API جدید به روز کنید. یک تفاوت کلیدی بین این دو API این است که declarativeNetRequest API از شما می‌خواهد تا لیستی از آدرس‌های از پیش تعیین‌شده را برای مسدود کردن مشخص کنید، به جای اینکه بتوانید تمام دسته‌های درخواست‌های HTTP را همانطور که می‌توانید با chrome.webRequest API

مهم است که این تغییرات را در کد خود ایجاد کنید تا اطمینان حاصل کنید که برنامه افزودنی شما در Manifest V3 به درستی کار می کند. در اینجا مثالی از نحوه تغییر مانیفست خود برای استفاده از آن آورده شده است declarativeNetRequest API در Manifest V3:

// Manifest V2 "permissions": [ "webRequest", "webRequestBlocking"
]

// Manifest V3 "permissions": [ "declarativeNetRequest"
]

همچنین برای استفاده از کد برنامه افزودنی خود باید به روز رسانی کنید declarativeNetRequest API به جای chrome.webRequest API

جنبه های دیگری که باید بررسی کنید

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

• انتقال اسکریپت‌های پس‌زمینه به زمینه اجرای سرویس‌کار: همانطور که قبلاً ذکر شد، Manifest V3 صفحات پس‌زمینه را با یک کارگر سرویس افزودنی جایگزین می‌کند، بنابراین ممکن است لازم باشد اسکریپت‌های پس‌زمینه برای انطباق با زمینه اجرای سرویس‌کار به‌روزرسانی شود.
• متحد کردن **chrome.browserAction** و **chrome.pageAction** API: این دو API معادل در Manifest V3 در یک API واحد متحد می شوند، بنابراین ممکن است لازم باشد به Action API مهاجرت کنید.
• انتقال توابع که انتظار یک زمینه پس زمینه Manifest V2 را دارند: پذیرش کارگران سرویس در Manifest V3 با روش هایی مانند سازگاری ندارد chrome.runtime.getBackgroundPage(), chrome.extension.getBackgroundPage(), chrome.extension.getExtensionTabs()و chrome.extension.getViews(). ممکن است لازم باشد به طرحی مهاجرت کنید که پیام‌ها را بین سایر زمینه‌ها و کارمند خدمات پس‌زمینه ارسال می‌کند.
• انتقال درخواست‌های CORS در اسکریپت‌های محتوا به کارگر خدمات پس‌زمینه: ممکن است لازم باشد درخواست‌های CORS در اسکریپت‌های محتوا را به کارمند خدمات پس‌زمینه منتقل کنید تا با Manifest V3 مطابقت داشته باشد.
• مهاجرت به دور از اجرای کد خارجی یا رشته های دلخواه: Manifest V3 دیگر اجازه اجرای منطق خارجی را با استفاده از آن نمی دهد chrome.scripting.executeScript({code: '...'}), eval()و new Function(). ممکن است لازم باشد همه کدهای خارجی (جاوا اسکریپت، WebAssembly، CSS) را به بسته برنامه افزودنی منتقل کنید، اسکریپت و مراجع سبک را به روز کنید تا منابع را از بسته برنامه افزودنی بارگیری کنید، و از آن استفاده کنید. chrome.runtime.getURL() برای ساخت URL های منبع در زمان اجرا.
• به روز رسانی برخی از روش های اسکریپت نویسی و CSS در Tabs API: همانطور که قبلا ذکر شد، چندین روش از Tabs API به API Scripting در Manifest V3 منتقل می شوند. برای استفاده از Manifest V3 API صحیح ممکن است لازم باشد هر تماسی را به این روش ها به روز کنید.

و خیلی بیشتر!

با خیال راحت کمی وقت بگذارید تا خود را در مورد همه تغییرات به روز کنید. به هر حال، این تغییر اجتناب‌ناپذیر است و اگر نمی‌خواهید افزونه‌های Manifest V2 به دلیل اجتناب از این انتقال از بین بروند، پس مدتی را صرف مسلح کردن خود به دانش لازم کنید.

از سوی دیگر، اگر در برنامه‌نویسی افزونه‌های کروم تازه کار هستید و به دنبال شروع کار هستید، یک راه عالی برای انجام این کار این است که به دنیای ابزارهای توسعه‌دهنده وب کروم بروید. من این کار را از طریق یک دوره در یادگیری Linkedin، که من را خیلی سریع به سرعت بالا برد. هنگامی که آن دانش پایه را دارید، به این مقاله بازگردید و آنچه را که می دانید به Manifest V3 ترجمه کنید!

بنابراین، چگونه در آینده از ویژگی‌های Manifest V3 جدید استفاده خواهم کرد؟

خوب، برای من، انتقال به Manifest V3 و حذف آن chrome.webRequest به نظر می‌رسد API برنامه‌های افزودنی را از موارد استفاده مبتنی بر داده (مانند مسدودکننده‌های تبلیغات) به استفاده‌های کاربردی‌تر و مبتنی بر برنامه تغییر می‌دهد. من اخیراً از توسعه برنامه دور مانده ام زیرا ممکن است کاملاً پیشرفت کند منابع فشرده در زمان. با این حال، این تغییر ممکن است چیزی باشد که من را برگرداند!

ظهور ابزارهای هوش مصنوعی در زمان‌های اخیر، که بسیاری از آنها دارای APIهای قابل استفاده هستند، باعث ایجاد هزاران برنامه جدید و تازه SaaS شده است. من شخصاً فکر می‌کنم که با تغییر به برنامه‌های افزودنی Chrome مبتنی بر برنامه در زمان مناسبی از راه می‌رسد! در حالی که بسیاری از برنامه‌های افزودنی قدیمی ممکن است از این انتقال حذف شوند، بسیاری از برنامه‌های افزودنی جدید که بر اساس ایده‌های جدید SaaS ساخته شده‌اند جای آن‌ها را خواهند گرفت.

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

با این حال، به یاد داشته باشید که نیازهای هر توسعه‌دهنده‌ای متفاوت است، بنابراین بیاموزید که برای حفظ برنامه‌های افزودنی فعلی یا توسعه برنامه‌های جدید به چه چیزهایی نیاز دارید!

• محتوای مبتنی بر SEO و توزیع روابط عمومی. امروز تقویت شوید.
• پلاتوبلاک چین. Web3 Metaverse Intelligence. دانش تقویت شده دسترسی به اینجا.
• منبع: https://css-tricks.com/how-to-transition-to-manifest-v3-for-chrome-extensions/