Создание расширения Chrome/Brave «Download Image» для AI Image Generator

Сегодня нашему сисадмину поступила задача Создать расширение Brave для скачивания файлов с сайтов генерации изображений, чтобы облегчить задачу дизайнерам. По сути, создание расширения для Brave включает в себя те же шаги, что и создание расширения Chrome, поскольку Brave построен на платформе Chromium. Ниже приведен пример расширения Brave, которое при нажатии загружает все файлы изображений, связанные с текстом «Загрузить изображение», с текущей веб-страницы.

manifest.json:

{
"manifest_version": 2,
"name": "MLHOST.RU Image Downloader for AI Image Generators",
"version": "1.0",
"description": "Download all image files with 'Download image' link",
"permissions": ["activeTab", "downloads"],
"browser_action": {
"default_icon": {
"16": "images/icon16.png",
"48": "images/icon48.png",
"128": "images/icon128.png"
},
"default_title": "Download Images",
"default_popup": "popup.html"
},
"icons": {
"16": "images/icon16.png",
"48": "images/icon48.png",
"128": "images/icon128.png"
},
"content_scripts": [
{
"matches": [""],
"js": ["content.js"]
}
]
}

Создание расширения Chrome для AI Image Generator

popup.html:

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

content.js:

chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
if(request.action == "downloadImages") {
const imageLinks = document.querySelectorAll('a[href*="Download image"]');
const imageUrls = Array.from(imageLinks).map(link => link.href);
sendResponse({ imageUrls });
}
}
);

Создание расширения Brave для AI Image Generator

popup.js:

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

Это расширение адаптировано для Brave.

Чтобы создать расширение, выполните следующие действия:

  • Создайте папку с файлами расширения.
  • Поместите предоставленные файлы Manifest.json, popup.html, content.js и popup.js в папку.
  • Создайте папку «images» в каталоге расширения и добавьте изображения значков (например, icon16.png, icon48.png и icon128.png).

Чтобы загрузить расширение в Brave:

  • Откройте Brave и перейдите по адресу brave://extensions/.
  • Включите «Режим разработчика» в правом верхнем углу.
  • Нажмите «Загрузить распакованное» и выберите папку, содержащую файлы расширения.

Не забывайте соблюдать политику расширений Brave и убедитесь, что ваше расширение соответствует всем соответствующим рекомендациям.

Tags:

No responses yet

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

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