Создание расширения Chrome/Brave для скачивания файлов по заданному формату

Сегодня нашему системному администратору поступила задача – создать расширение для браузеров Chrome и Brave для скачивания всех файлов со страницы по заданному формату файла (например, архив ZIP), зашитой в расширении. Это ускоряет работу в разы для обычных сотрудников, которые раньше были вынуждены кликать по каждой ссылке, чтобы скачать все что нужно.

Создание расширения браузера включает в себя написание кода, и в Chrome обычно используется несколько HTML, CSS и JavaScript. Ниже представлен код для скачивания всех ZIP файлов со страницы:

manifest.json:

{ "manifest_version": 2, "name": "MLHOST.RU Zip Downloader", "version": "1.0", "description": "Download all links with .zip extension", "permissions": ["activeTab", "downloads"], "browser_action": { "default_icon": { "16": "images/icon16.png", "48": "images/icon48.png", "128": "images/icon128.png" }, "default_title": "Download Zip Links", "default_popup": "popup.html" }, "icons": { "16": "images/icon16.png", "48": "images/icon48.png", "128": "images/icon128.png" }, "content_scripts": [ { "matches": ["<all_urls>"], "js": ["content.js"] } ] }

popup.html:

<!DOCTYPE html> <html> <body> <button id="downloadButton">Download Zip Links</button> <script src="popup.js"></script> </body> </html>

content.js:

chrome.runtime.onMessage.addListener( function(request, sender, sendResponse) { if(request.action == "downloadZipLinks") { const zipLinks = document.querySelectorAll('a[href$=".zip"]'); const zipUrls = Array.from(zipLinks).map(link => link.href); sendResponse({ zipUrls }); } } );

Создание расширения Chrome для скачивания файлов по заданному формату

popup.js:

document.getElementById('downloadButton').addEventListener('click', function() { chrome.tabs.query({ active: true, currentWindow: true }, function(tabs) { chrome.tabs.sendMessage(tabs[0].id, { action: "downloadZipLinks" }, function(response) { const zipUrls = response.zipUrls; zipUrls.forEach(url => { chrome.downloads.download({ url: url }); }); }); }); });

Это расширение состоит из нескольких файлов:

  • manifest.json: определяет расширение, его разрешения и файлы, которые оно использует.
  • popup.html: всплывающее окно, которое появляется при нажатии на значок расширения.
  • content.js: скрипт содержимого, внедренный во все веб-страницы, который прослушивает сообщения из всплывающего окна.
  • popup.js: сценарий, который обрабатывает нажатие кнопки во всплывающем окне и взаимодействует со сценарием содержимого.

Чтобы использовать это расширение, создайте папку, поместите в нее эти файлы и загрузите расширение в Chrome, перейдя по адресу chrome://extensions/, включив «Режим разработчика» и нажав «Загрузить распакованное». Выберите папку расширения.

Создание расширения Chrome Brave самостоятельно

Tags:

No responses yet

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *