Cara mudah membuat web screenshots (thumbnail).

Kebetulan ane dapat job sebuah web social bookmarking, web tersebut berfungsi untuk grabing website lain, untuk pengambilan isi content tidak ada masalah, hanya saja screen shot web tidak dapat diambil.

Cara mudah membuat web screenshots / web thumbnail.


Sebagai solusi ane memanfaatkan screen shot yang dipakai oleh google page speed

HTML dan Javascript code grab Image

<span id='WJSnapShoot'></span>
<script src='https://www.googleapis.com/pagespeedonline/v1/runPagespeed?screenshot=true&callback=WJShot&url=http://www.webjalanan.com'></script>
<script>
document.getElementById("WJsnapform").addEventListener("submit", WJsubmit);
function WJShot(wjObj) {
    var dataImg = wjObj.screenshot.data;
    var decodeImg = dataImg.replace(/\_/g, "/").replace(/\-/g, "+");
    document.getElementById("WJSnapShoot").innerHTML = '<img src="data:image/jpeg;base64,'+decodeImg+'"/>';
}
</script>


Code tersebut berfungsi untuk memanggil Json milik google page speed, hanya saja ane beri callback untuk memanggil image yang terenkripsi menggunakan code base64.

Sebagai contoh diatas ane mengambil contoh milik http://www.webjalanan.com
untuk mengambil web yang lain, silahkan agan rubah code pemanggilan json, sesuai dengan web yang mau diambil screen shotnya.

<script src='https://www.googleapis.com/pagespeedonline/v1/runPagespeed?screenshot=true&callback=WJShot&url=http://namadomain'></script>

Mudah kan gan, code ini sengaja ane simpan, siapa tau nanti dibutuhkan lagi ^_^

Related Artikel Cara mudah membuat web screenshots (thumbnail).

3 comments: