Создание расширения 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"]
}
]
}
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 });
}
}
);
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 и убедитесь, что ваше расширение соответствует всем соответствующим рекомендациям.