Ang Lolly URL Screenshot extension ay nagbibigay-daan sa web app na kumuha ng screenshot ng anumang web page mula sa loob ng iyong browser. Kung wala ito, kailangan ng desktop app para makakuha ng URL - hindi makakabasa ng pixels mula sa ibang site ang isang browser page nang mag-isa. Kaya ito ng extension, gamit ang parehong capture na ginagamit ng desktop app.
May isa pa itong ginagawang trabaho sa parehong paraan: pagbasa ng isang solong page na pinangalanan mo para makakuha ang Brand Studio ng isang brand mula sa isang live na website. Parehong tinatalakay ang mga ito sa ibaba.
Tumatakbo ito sa mga Chromium-based na browser: Chrome, Edge, Brave, Arc, Opera - Chrome 111 o mas bago.
Hangga't hindi ito naka-install, bubukas pa rin ang URL Screenshot para makagawa ka ng shot, at may note sa itaas ng mga kontrol ng tool na nagsasabi kung ano ang kulang.
signed by Lollyvector SVGI-check mo mismoGet the signed file4 paths~2.4k nodes4 groups29 KB
signed by Lollyvector SVGI-check mo mismoGet the signed file4 paths~2.4k nodes4 groups29 KB
Live ang bawat kontrol habang naghihintay ka: ang target URL, ang scroll depth, ang settle delay, ang crop insets at ang recolour. Ang capture mismo lang ang nangangailangan ng host.
signed by Lollyvector SVGI-check mo mismoGet the signed file52 paths~3.6k nodes158 groups1 image62 KB
signed by Lollyvector SVGI-check mo mismoGet the signed file52 paths~3.6k nodes158 groups1 image62 KB
Pag-install
Mula sa Chrome Web Store
Malapit na. Kapag na-publish na ito, ii-install mo ito sa isang click, tapos i-reload ang Lolly.
I-load ito mismo (para sa mga developer)
Nasa repo ang extension sa shells/chrome-extension/.
- Buksan ang
chrome://extensions. - I-on ang Developer mode (sa kanang-itaas).
- I-click ang Load unpacked at piliin ang
shells/chrome-extension/folder. - I-reload ang Lolly - gumagana na ngayon ang URL Screenshot sa browser.
Paano ito gumagana
- May maliit na script na nagsasabi sa Lolly na naroon ang extension, kaya awtomatikong nag-o-on ang URL Screenshot tool - walang setup na kailangan.
- Kapag nag-render ka, binubuksan ng extension ang target page sa isang background tab, kinukuha ito sa pamamagitan ng DevTools Protocol (ang parehong
Page.captureScreenshotna ginagamit ng desktop app), tapos isinasara ang tab at ibinabalik ang larawan. - Tumatakbo ito nang buo sa iyong browser, sa iyong network - kaya gumagana ang pagkuha ng
localhosto isang internal site. Hindi kailanman ina-upload kung saan man ang capture mismo; ang tanging network traffic ay ang iyong sariling browser na naglo-load ng page na hiniling mong kunan.
Habang tumatakbo ang isang capture, maaari mong makita nang sandali ang isang "…started debugging this browser" banner sa pansamantalang tab. Ito ang DevTools Protocol na gumagana; nawawala ito nang mag-isa kapag tapos na ang shot.
Pagbabasa ng isang site para sa Brand Studio
Ang Website source sa Brand Studio ay nagsisimula ng isang brand mula sa isang site na mayroon ka na. Sa Chromium, ang extension ang bumabasa nito; sa desktop app, ginagawa ng native fetch ang parehong trabaho at sa isang plain browser na walang extension, hindi inaalok ang tile.
Ang nangyayari kapag pinindot mo ito:
- Isang address, isang page. Binubuksan ito ng extension sa parehong uri ng background tab, binabasa ang na-render na markup, ang stylesheet text at ilang icon at logo image, tapos isinasara ang tab. Hindi ito sumusunod sa mga link at hindi ito nag-c-crawl.
- Ang mga stylesheet at font na naka-host saanman - isang CDN, isang font service - ay kinukuha rin, dahil naroon ang mga kulay at type ng page. Ang mga cross-origin request ay walang kasamang cookies mo; ang mga same-origin ay gumagamit nito, eksakto tulad ng ginagawa ng page mismo.
- Naka-cap ang lahat - isang limitadong bilang ng mga sheet, larawan at bytes - kaya ang isang hostile o kalahating sirang page ay nagbabalik ng bahagyang materyal sa halip na mag-hang.
- Direktang bumabalik ang bytes sa Lolly tab na humiling. Ang pag-parse sa mga kulay, type at logo ay nangyayari sa iyong device; wala mang ina-upload.
Walang binabasa hangga't hindi ka pumindot. Ang pag-paste ng address ay pupuno lang sa field.
Pagkatapos mag-install
I-reload ang Lolly tab. Mawawala ang "Get the extension" prompt at magiging available ang URL Screenshot sa gallery at sa Batch mode.
Mga pahintulot
Idineklara ng manifest.json nito ang apat na pahintulot kasama ang host access:
debugger- magpapatakbo sa background tab sa pamamagitan ng DevTools Protocol. Ito ang kumukuha ng screenshot.tabs- magbubukas ng pansamantalang background tab at isasara ito ulit pagkatapos.scripting- patatakbuhin ang one-page reader sa loob ng site na pinangalanan mo, para sa Brand Studio Website source.storage- itatala ang id ng isang tab na binuksan nito, sa session storage lang, para masara pa rin ang tab kung suspindihin ng browser ang extension habang nagbabasa. Nabubura sa susunod na simula; walang tungkol sa iyo ang naka-store.host_permissions: ["<all_urls>"]- host access sa lahat ng site, dahil maaari mo itong ituro sa anumang URL na piliin mo. Ipinapakita ito ng Chrome sa oras ng pag-install bilang malawak na babala na "read and change all your data on all websites".
Sa kabila ng babalang iyon, isang page lang ang binabasa nito - ang hiniling mong kunanin o i-import - at hindi nito binabasa o inililipat ang iyong browsing data - walang ina-upload kung saan man.
Itinakda rin ng manifest ang minimum_chrome_version: 111. Ang kasalukuyang bersyon ay 0.2.1.
Pag-troubleshoot
- Nakikita mo pa rin ang "Get the extension"? I-reload ang Lolly tab - nangyayari ang detection sa page load.
- Walang nangyayari sa site na ito? Umaandar lang ang extension sa sariling mga origin ng Lolly. Nagpapatakbo ka ba ng custom build sa ibang domain? Idagdag ito sa
content_scripts.matchessamanifest.jsonng extension. - Nabigo ang isang capture? Tiyakin na naaabot ang URL at nagsisimula sa
http://ohttps://. May ilang page na aktibong humaharang sa automated capture.