Ekstensi Lolly URL Screenshot memungkinkan aplikasi web mengambil tangkapan layar halaman web mana pun dari dalam browser Anda. Tanpanya, menangkap URL memerlukan aplikasi desktop - halaman browser tidak bisa membaca piksel dari situs lain dengan sendirinya. Ekstensi ini bisa, menggunakan mekanisme tangkap yang sama dengan yang dipakai aplikasi desktop.
Ia melakukan satu tugas lain dengan cara yang sama: membaca satu halaman yang Anda sebutkan sehingga Brand Studio bisa menarik sebuah brand dari sebuah website live. Keduanya dibahas di bawah.
Berjalan di browser berbasis Chromium: Chrome, Edge, Brave, Arc, Opera - Chrome 111 atau lebih baru.
Sampai terpasang, URL Screenshot tetap terbuka sehingga Anda bisa menyusun bidikan, dan catatan di bagian atas kontrol tool memberi tahu apa yang belum ada.
signed by Lollyvector SVGPeriksa sendiriGet the signed file4 paths~2.4k nodes4 groups29 KB
signed by Lollyvector SVGPeriksa sendiriGet the signed file4 paths~2.4k nodes4 groups29 KB
Setiap kontrol tetap aktif sementara Anda menunggu: URL target, kedalaman gulir, jeda penetapan, inset crop dan pewarnaan ulang. Hanya proses capture itu sendiri yang membutuhkan host.
signed by Lollyvector SVGPeriksa sendiriGet the signed file52 paths~3.6k nodes158 groups1 image62 KB
signed by Lollyvector SVGPeriksa sendiriGet the signed file52 paths~3.6k nodes158 groups1 image62 KB
Pasang
Dari Chrome Web Store
Segera hadir. Setelah diterbitkan Anda akan memasangnya dengan satu klik, lalu memuat ulang Lolly.
Muat sendiri (pengembang)
Ekstensi ini berada di repo pada shells/chrome-extension/.
- Buka
chrome://extensions. - Aktifkan Developer mode (kanan atas).
- Klik Load unpacked dan pilih folder
shells/chrome-extension/. - Muat ulang Lolly - URL Screenshot kini berfungsi di browser.
Cara kerjanya
- Skrip kecil memberi tahu Lolly bahwa ekstensi ada, sehingga tool URL Screenshot aktif secara otomatis - tanpa pengaturan.
- Saat Anda merender, ekstensi membuka halaman target di tab latar belakang, menangkapnya melalui DevTools Protocol (
Page.captureScreenshotyang sama dengan yang dipakai aplikasi desktop), lalu menutup tab dan mengembalikan gambar tersebut. - Ekstensi berjalan sepenuhnya di browser Anda, di jaringan Anda - jadi menangkap
localhostatau situs internal tetap berfungsi. Hasil capture itu sendiri tidak pernah diunggah ke mana pun; satu-satunya lalu lintas jaringan adalah browser Anda sendiri memuat halaman yang Anda minta untuk dibidik.
Selama capture berjalan, Anda mungkin sekilas melihat banner "…started debugging this browser" di tab sementara tersebut. Itu adalah DevTools Protocol yang sedang bekerja; banner itu hilang sendiri saat bidikan selesai.
Membaca situs untuk Brand Studio
Sumber Website di Brand Studio memulai sebuah brand dari situs yang sudah Anda miliki. Di Chromium, ekstensilah yang membacanya; di aplikasi desktop, fetch native melakukan tugas yang sama, dan di browser biasa tanpa ekstensi, ubin ini sama sekali tidak ditawarkan.
Yang terjadi saat Anda menekannya:
- Satu alamat, satu halaman. Ekstensi membukanya di jenis tab latar belakang yang sama, membaca markup yang dirender, teks stylesheet dan beberapa gambar ikon serta logo, lalu menutup tab. Ekstensi tidak mengikuti tautan dan tidak melakukan crawling.
- Stylesheet dan font yang dihosting di tempat lain (CDN, layanan font) juga diambil, karena warna dan tipografi halaman berada di dalamnya. Permintaan lintas asal berjalan tanpa cookie Anda; permintaan asal-sama menggunakannya, persis seperti yang dilakukan halaman itu sendiri.
- Semuanya dibatasi - jumlah sheet, gambar dan byte yang terbatas - sehingga halaman yang jahat atau setengah rusak mengembalikan materi parsial alih-alih macet.
- Byte langsung dikembalikan ke tab Lolly yang memintanya. Penguraian menjadi warna, tipografi dan logo terjadi di perangkat Anda; tidak ada yang diunggah.
Tidak ada yang dibaca sampai Anda menekan tombol. Menempelkan alamat hanya mengisi kolomnya.
Setelah memasang
Muat ulang tab Lolly. Prompt "Get the extension" akan hilang dan URL Screenshot menjadi tersedia di galeri dan di mode Batch.
Izin
manifest.json-nya mendeklarasikan empat izin plus akses host:
debugger- mengendalikan tab latar belakang melalui DevTools Protocol. Inilah yang mengambil tangkapan layar.tabs- membuka tab latar belakang sementara dan menutupnya kembali setelahnya.scripting- menjalankan pembaca satu-halaman di dalam situs yang Anda tentukan, untuk sumber Website Brand Studio.storage- mencatat id tab yang dibukanya, hanya di session storage, sehingga tab tetap ditutup jika browser menangguhkan ekstensi di tengah pembacaan. Dihapus pada permulaan berikutnya; tidak ada apa pun tentang Anda yang disimpan.host_permissions: ["<all_urls>"]- akses host ke semua situs, karena Anda bisa mengarahkannya ke URL apa pun yang Anda pilih. Chrome menampilkan ini saat instalasi sebagai peringatan luas "baca dan ubah semua data Anda di semua situs web".
Terlepas dari peringatan itu, ekstensi hanya membaca satu halaman yang Anda minta untuk ditangkap atau diimpor, dan tidak membaca atau mengirimkan data penjelajahan Anda - tidak ada yang diunggah ke mana pun.
Manifes juga menetapkan minimum_chrome_version: 111. Versi saat ini adalah 0.2.1.
Pemecahan masalah
- Masih melihat "Get the extension"? Muat ulang tab Lolly - deteksi terjadi saat halaman dimuat.
- Tidak ada yang terjadi di situs ini? Ekstensi hanya aktif di origin Lolly sendiri. Menjalankan build kustom di domain lain? Tambahkan ke
content_scripts.matchesdimanifest.jsonekstensi. - Capture gagal? Periksa apakah URL dapat dijangkau dan diawali dengan
http://atauhttps://. Beberapa halaman secara aktif memblokir capture otomatis.