Как перейти на Manifest V3 для расширений Chrome

Хотя я не являюсь обычным программистом расширений для Chrome, я, безусловно, написал достаточное количество расширений и имею достаточно обширный портфель веб-разработок, чтобы справиться с этой задачей. Однако совсем недавно у меня был клиент, который отклонил одно из моих расширений, поскольку я получил отзыв о том, что мое расширение «устарело».

Пока я пытался понять, что не так, я заместил свое смущение под ковер и сразу же начал свое глубокое погружение в мир расширений Chrome. К сожалению, информации о Manifest V3 было мало, и мне было трудно быстро понять, что это за переход.

Излишне говорить, что с незавершенной работой мне пришлось кропотливо ориентироваться Документация Google для разработчиков Chrome и придумать что-нибудь для себя. Пока я выполнял свою работу, я не хотел, чтобы мои знания и исследования в этой области пропали даром, и решил поделиться тем, к чему я хотел бы иметь легкий доступ в моем учебном путешествии.

Почему важен переход на Manifest 3

Manifest V3 — это API, который Google будет использовать в своем браузере Chrome. Это преемник текущего 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

Между ними есть много различий, и, хотя я настоятельно рекомендую вам прочитать Руководство Chrome «Переход на Manifest V3», вот краткое и приятное изложение ключевых моментов:

1. Сервисные работники заменить фоновые страницы в Manifest V3.
2. Модификация сетевого запроса обрабатывается с помощью нового declarativeNetRequest API в манифесте V3.
3. В Manifest V3 расширения могут выполнять только тот JavaScript, который включен в их пакет, и не могут использовать удаленно размещенный код.
4. Манифест V3 представляет promise поддержка многих методов, хотя обратные вызовы по-прежнему поддерживаются в качестве альтернативы.
5. Разрешения хоста в Manifest V3 являются отдельным элементом и должны быть указаны в "host_permissions" поле.
6. Политика безопасности контента в Manifest V3 — это объект, элементы которого представляют альтернативные контексты политики безопасности контента (CSP), а не строка, как в Manifest V2.

В простом манифесте расширения Chrome, который изменяет фон веб-страницы, это может выглядеть так:

// 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. Измените обработку сетевых запросов.

С этими четырьмя областями основы вашего манифеста будут готовы к переходу на манифест версии 3. Давайте подробно рассмотрим каждый из этих ключевых аспектов и посмотрим, как мы можем работать над тем, чтобы ваше расширение Chrome было защищено от этого перехода в будущем.

Обновление базовой структуры вашего манифеста

Обновление базовой структуры вашего манифеста — это первый шаг в переходе на Manifest V3. Самое важное изменение, которое вам нужно будет сделать, это изменить значение "manifest_version" элемент к 3, который определяет, что вы используете набор функций Manifest V3.

Одним из основных различий между Manifest V2 и V3 является замена фоновых страниц одним работником службы расширения в Manifest V3. Вам нужно будет зарегистрировать сервис-воркера под "background" поле, используя "service_worker" key и укажите один файл JavaScript. Несмотря на то, что Manifest V3 не поддерживает несколько фоновых сценариев, вы можете дополнительно объявить сервис-воркер как модуль ES, указав "type": "module", что позволяет импортировать дополнительный код.

В манифесте V3 "browser_action" и "page_action" свойства объединены в единый "action" имущество. Вам нужно будет заменить эти свойства на "action" в вашем манифесте. Точно так же "chrome.browserAction" и "chrome.pageAction" API объединены в единый API «Действие» в Manifest V3, и вам нужно будет перейти на этот 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, вам потребуется внести некоторые изменения в файл манифеста. В манифесте V2 CSP был указан в виде строки в "content_security_policy" поле манифеста.

В манифесте версии 3 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 в манифесте V3:

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

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

Вам также потребуется обновить код расширения, чтобы использовать declarativeNetRequest API вместо chrome.webRequest API.

Другие аспекты, которые необходимо проверить

То, что я описал, — это только верхушка айсберга. Конечно, если бы я хотел охватить все, я мог бы быть здесь несколько дней, и не было бы никакого смысла в руководствах для разработчиков Chrome от Google. Хотя то, что я рассказал, обеспечит вам достаточную готовность к будущему, чтобы вооружить расширения Chrome в этот переход, вот некоторые другие вещи, на которые вы, возможно, захотите обратить внимание, чтобы убедиться, что ваши расширения работают на высоте.

• Миграция фоновых скриптов в контекст выполнения сервис-воркера: Как упоминалось ранее, Manifest V3 заменяет фоновые страницы одним сервисным работником расширения, поэтому может потребоваться обновить фоновые сценарии для адаптации к контексту выполнения сервисного работника.
• Объединение **chrome.browserAction** и **chrome.pageAction** API-интерфейсы: Эти два эквивалентных API объединены в единый API в Manifest V3, поэтому может потребоваться переход на API действий.
• Миграция функций, которые ожидают фоновый контекст Manifest V2: Принятие сервис-воркеров в Manifest V3 несовместимо с такими методами, как chrome.runtime.getBackgroundPage(), chrome.extension.getBackgroundPage(), chrome.extension.getExtensionTabs()качества chrome.extension.getViews(). Может потребоваться переход на дизайн, который передает сообщения между другими контекстами и фоновым сервис-воркером.
• Перемещение запросов CORS в сценариях контента в фоновый сервис-воркер: Может потребоваться переместить запросы CORS в сценариях контента в фоновый рабочий процесс, чтобы соответствовать манифесту версии 3.
• Миграция от выполнения внешнего кода или произвольных строк: Manifest V3 больше не позволяет выполнять внешнюю логику с использованием chrome.scripting.executeScript({code: '...'}), eval()качества new Function(). Может потребоваться переместить весь внешний код (JavaScript, WebAssembly, CSS) в пакет расширения, обновить ссылки на сценарии и стили для загрузки ресурсов из пакета расширения и использовать chrome.runtime.getURL() для создания URL-адресов ресурсов во время выполнения.
• Обновление некоторых методов сценариев и CSS в Tabs API: Как упоминалось ранее, несколько методов перемещаются из API вкладок в API сценариев в Manifest V3. Может потребоваться обновить любые вызовы этих методов, чтобы использовать правильный API-интерфейс Manifest V3.

И многое другое!

Не стесняйтесь потратить некоторое время, чтобы быть в курсе всех изменений. В конце концов, это изменение неизбежно, и если вы не хотите, чтобы ваши расширения Manifest V2 были потеряны из-за уклонения от этого перехода, то потратьте некоторое время на то, чтобы вооружиться необходимыми знаниями.

С другой стороны, если вы новичок в программировании расширений Chrome и хотите начать работу, отличный способ сделать это — погрузиться в мир инструментов веб-разработчика Chrome. Я сделал это через курс по Обучение Linkedin, который довольно быстро ввел меня в курс дела. Получив базовые знания, вернитесь к этой статье и перенесите то, что вы знаете, в Manifest V3!

Итак, как я буду использовать функции нового Manifest V3 в будущем?

Ну, для меня переход на Manifest V3 и удаление chrome.webRequest API, похоже, смещает расширения от сценариев использования, ориентированных на данные (таких как блокировщики рекламы), к более функциональным и основанным на приложениях. В последнее время я держусь подальше от разработки приложений, так как это может стать довольно ресурсоемкий во время. Тем не менее, этот сдвиг может быть тем, что вернет меня!

Рост числа инструментов искусственного интеллекта в последнее время, многие из которых имеют доступные для использования API, породил множество новых и свежих приложений SaaS. Лично я думаю, что это происходит в идеальное время с переходом на больше расширений Chrome для приложений! Хотя многие из старых расширений могут быть уничтожены в результате этого перехода, на их место придет множество новых, основанных на новых идеях SaaS.

Таким образом, это захватывающее обновление, позволяющее обновить старые расширения или создать новые! Лично я вижу много возможностей в использовании API, которые включают использование ИИ в расширениях для улучшения работы пользователя в Интернете. Но на самом деле это только вершина айсберга. Если вы действительно хотите разобраться со своими собственными профессиональными расширениями или обратиться к компаниям для создания/обновления расширений для них, я бы порекомендовал обновление вашей учетной записи Gmail за преимущества, которые он дает при совместной работе, разработке и публикации расширений в Интернет-магазине Chrome.

Однако помните, что требования каждого разработчика разные, поэтому узнайте, что вам нужно, чтобы ваши текущие расширения оставались на плаву, а новые работали!

• SEO-контент и PR-распределение. Получите усиление сегодня.
• Платоблокчейн. Интеллект метавселенной Web3. Расширение знаний. Доступ здесь.
• Источник: https://css-tricks.com/how-to-transition-to-manifest-v3-for-chrome-extensions/