Разширението Lolly URL Screenshot позволява на уеб приложението да направи снимка на всяка уеб страница направо от браузъра ти. Без него заснемането на URL изисква настолното приложение - страница в браузъра не може сама да чете пиксели от друг сайт. Разширението може, използвайки същото заснемане, което ползва настолното приложение.
Разширението върши още две задачи по същия начин. Уеб адрес, поставен в слот за изображение, може да стане снимка на тази страница (Заснеми тази страница), а разширението може да чете една страница, която посочиш, за да може Brand Studio да извлече бранд от жив уебсайт. Всяка заявка чака твоето одобрение в разширението.
Работи на браузъри, базирани на Chromium: Chrome, Edge, Brave, Arc, Opera - Chrome 111 или по-нов.
Докато не е инсталирано, URL Screenshot все пак се отваря, за да можеш да композираш кадър, и бележка в горната част на контролите на инструмента показва какво липсва.
signed by Lollyvector SVG4 paths~2.4k nodes4 groups30 KBПровери самВземи подписания файл
signed by Lollyvector SVG4 paths~2.4k nodes4 groups30 KBПровери самВземи подписания файл
Всеки контрол е активен, докато чакаш: целевият URL, дълбочината на скрола, забавянето за уталожване, изрязващите отстъпи и прецветяването. Само самото заснемане се нуждае от хост.
signed by Lollyvector SVG31 paths~1.7k nodes38 groups30 KBПровери самВземи подписания файл
signed by Lollyvector SVG31 paths~1.7k nodes38 groups30 KBПровери самВземи подписания файл
Инсталиране
От Chrome Web Store
Очаквайте скоро. След публикуването ще го инсталираш с едно кликване, после презареди Lolly.
Зареди го сам (разработчици)
Разширението се намира в хранилището на shells/chrome-extension/. Тази папка е производствената версия, която работи с Lolly само на https://lolly.tools.
- Отвори
chrome://extensions. - Включи Developer mode (горе вдясно).
- Кликни Load unpacked и избери папката
shells/chrome-extension/. - Презареди Lolly - URL Screenshot вече работи в браузъра.
За локален сървър за разработка изпълни pnpm run pack:chrome-extension:dev и зареди вместо това dist/chrome-extension-dev. Този пакет приема и http://localhost:5173, а в името му стои Development.
Как работи
- Малък скрипт съобщава на Lolly, че разширението присъства, така че URL Screenshot може да записва заснемания без допълнителна настройка.
- Ти одобряваш всяка заявка. Когато Lolly поиска, разширението отваря собствен прозорец Approve page request, който показва кой сайт иска, дали му трябва снимка или съдържанието на страницата, и адреса на страницата. Нищо не се чете, докато не натиснеш Approve once. Cancel или затварянето на прозореца прекратява заявката.
- Когато за пръв път одобриш заявка за даден сайт, Chrome пита и дали разширението може да има достъп до този сайт. Chrome пази този достъп, след като го разрешиш, но всяка следваща заявка пак иска собствено Approve once.
- Одобрението важи за една заявка и изтича след 30 секунди. Само една заявка може да чака или да работи наведнъж, а одобрена заявка спира след 55 секунди. Ако страницата на Lolly се затвори или смени, или целевата страница премине на друг сайт, заявката се отменя.
- След като одобриш, разширението отваря целевата страница във фонов таб, заснема я чрез DevTools Protocol (същия
Page.captureScreenshot, който използва настолното приложение), после затваря таба и връща изображението на таба на Lolly, който го е поискал. - Работи изцяло в браузъра ти, в твоята мрежа - затова заснемането на
localhostили вътрешен сайт работи. Страницата се зарежда със сесията на браузъра ти, така че страница, в която си влязъл, може да покаже лична информация в резултата. Самото заснемане никога не се качва никъде; единственият мрежов трафик е твоят собствен браузър, зареждащ страницата, която поискаш да заснемеш.
Докато тече заснемане, може за кратко да видиш банер „…started debugging this browser“ на временния таб. Това е DevTools Protocol в действие; изчезва само, щом кадърът е готов.
Четене на сайт за Brand Studio
Източникът Website в Brand Studio стартира бранд от сайт, който вече имаш. В Chromium разширението е това, което го чете; в настолното приложение същата работа върши нативно извличане, а в обикновен браузър без разширение плочката изобщо не се предлага.
Какво се случва, когато натиснеш:
- Един адрес, една страница. След като одобриш, разширението я отваря в същия вид фонов таб, чете рендирания markup, текста на стиловете и няколко икони и лога изображения, после затваря таба. Не следва връзки и не обхожда сайта.
- Стилови таблици, хоствани другаде (CDN, услуга за шрифтове), също се извличат, защото цветовете и типографията на страницата живеят в тях. Заявките между произходи отиват без твоите бисквитки; тези от същия произход ги използват, точно както самата страница би направила.
- Всичко е ограничено - краен брой стилови листа, изображения и байтове - така че враждебна или полуразбита страница връща частичен материал, вместо да зависне.
- Байтовете отиват директно обратно в таба на Lolly, който е поискал. Разчитането на цветове, типография и лога се случва на твоето устройство; нищо не се качва.
Поставянето на адрес само попълва полето. Нищо не се чете, докато не започнеш четенето и не натиснеш Approve once.
След инсталиране
Презареди таба на Lolly. Подканата „Get the extension“ изчезва, URL Screenshot (в Помощни инструменти) може да записва заснемания във файл, а инструментът става достъпен в режим Batch.
Разрешения
Неговият manifest.json декларира четири разрешения плюс достъп до сайтове, който иска по един сайт наведнъж:
debugger- управлява фоновия таб чрез DevTools Protocol. Това прави снимката.tabs- отваря временния фонов таб и го затваря отново след това, и проверява дали нито страницата на Lolly, нито целевата страница са се преместили, откакто си одобрил заявката.scripting- изпълнява четеца на единична страница вътре в посочения от теб сайт, за източника Website на Brand Studio.storage- записва id-то на отворен от него таб, само в session storage, така че табът пак да се затвори, ако браузърът суспендира разширението по средата на четенето. Изчиства се при следващото стартиране; нищо за теб не се съхранява.optional_host_permissions: ["http:///", "https:///"]- достъп до сайтове, който не се дава при инсталиране. Когато натиснеш Approve once, разширението иска от Chrome достъп до единствения сайт в тази заявка, а Chrome те пита първия път за всеки сайт.
То чете само единствената страница, която одобриш, и не чете и не предава данните от сърфирането ти - нищо не се качва никъде.
Манифестът също задава minimum_chrome_version: 111. Текущата версия е 0.4.0.
Отстраняване на проблеми
- Все още виждаш „Get the extension“? Презареди таба на Lolly - откриването става при зареждане на страницата.
- Нищо не се случва на този сайт? Разширението работи само на
https://lolly.tools, плюсhttp://localhost:5173в пакета за разработка. Друг произход, например самостоятелно хостван екземпляр на Lolly, изисква отделна версия на разширението, която изброява този произход и вmanifest.json, и вpolicy.js. Редактирането само на манифеста вече не върши работа. - Заснемане се проваля? Провери дали URL адресът е достижим и започва с
http://илиhttps://. Някои страници активно блокират автоматизирано заснемане. Ако си натиснал Cancel, затворил си прозореца за одобрение или си чакал повече от 30 секунди, започни заснемането отново.