การทำ Website Thumbnail ด้วยตัวเอง
หัวข้อ บทความ แทก HTML | Internet Explorer | Linux | Microsoft | Mozilla | Tool | Windows
หลายๆคนคงสังเกตเห็นผมเอา Snap.com ติดมาที่ Scriptdd
มันเป็น javascript ที่ทำงานแบบ Ajax กลับไปติดต่อกับ Server ของ Snap.com
เพื่อสร้างรูปหน้า Website ใน Link ต่อไป เป็น Thumbnail เล็กๆ
ก็เพิ่มความน่าสนใจให้กับ Website กันไปล่ะครับ
ปัญหาคือแค่เอามาติดคงไม่เท่าไร แต่นิสัยของผมคงจะมีคำถามต่อมาว่า
แล้วเขาทำยังไง ?? เรื่องของเรื่องมาจาก สมาชิก Scriptdd นี่แหล่ะครับ
ตั้งโจทย์มาถามผมว่าจะทำยังไง ไอ้ครั้นตอบไปผ่าน Email คงไม่ได้กระจายความรู้ดีกว่า
จากที่ค้นหาใน Google นั้น ผมพบว่าการสร้าง Website Thumbnail เฉพาะส่วนการจับภาพหน้าจอนั้น
มีวิธีการไม่ต่างกับการ Browse Web ด้วย Web Browser ตามปกติเลยครับ
1. สำหรับท่านที่จะใช้งานบน Windows Server
ชีวิตท่านจะง่ายดายโคตรๆ เพราะท่านจะเอาตัวเองไปผูกกับ IE Engine ครับ ^^ ด้วย IECapt
http://iecapt.sourceforge.net/
IECapt คือ program ที่ทำงานบน commandline ในลักษณะระบุ parameter เป็น URL แล้ว
มันจะทำหน้าที่จับภาพหน้าจอ Website นั้นๆด้วย IE Engine (Windows ลง IE ไว้อยู่แล้ว)
ออกมาเป็นรูปภาพให้เราตามต้องการ Download มาแล้วแตก Zip จะได้
IECapt.exe ออกมา
ให้ไปเพิ่ม Path ใน System ด้วยนะครับให้ IECapt สามารถเรียกใช้งานได้ทุกๆตำแหน่ง
หรือง่ายๆก็ Copy IECapt.exe ไปใส่ไว้ใน C:\WINDOWS เลยก็ได้ครับ
เสร็จแล้วลองเรียก PHP Script นี้ทำงานดูครับ
<?
$url = "http://www.scriptdd.com/";
$filename = "c:\temp\scriptdd.jpg";
system("IECapt.exe $url $filename");
?>
PHP Script นี้จะเรียก system โดยไปเรียก IECapt.exe ให้ไปจับภาพหน้าจอ
http://www.scriptdd.com ออกมา Save เป็น File ตามที่เราระบุเอาไว้
ตัว IECapt สำมารถ Save เป็น jpg หรือ png ก็ได้นะครับเลือกเอาตามใจชอบ
แต่เนื่องด้วยการใช้งานจริงนั้น IE ไม่ใช่ Webbrowser เดียวในโลก การผูกขาดอยู่
กับ Microsoft ไม่ใช่เรื่องที่ถูกต้อง เพื่อไม่ให้น้อยหน้าชาว Linux
ผมขอเสนอวิธีที่สองครับ
2. สำหรับชาว Linux ครับ (จริงๆ Windows ก็ใช้ได้ลองมาแล้ว) ด้วย Pearl Crescent Page Saver
http://pearlcrescent.com/products/pagesaver/
มันคือ extension สำหรับ Firefox ที่ช่วยจับภาพหน้าจอให้ แน่นอนด้วยความที่มันคือ Firefox ฉะนั้น มันจะสามารถตามไปอยู่ใน
Linux, Windows, Mac (อันนี้ผมยังไม่ได้ Test ใคร test แล้วช่วยยืนยันด้วย)
ผมติดตั้งตัว Install Page Saver Basic
ตัวอย่างผมใช้ Ubuntu 6.10 Desktop ทดสอบนะครับ โดยใช้ Firefox 2.0.0.3
สำหรับท่านใดจะใช้งานบน Linux Server แท้ๆ การติดตั้ง extension ให้กับ Firefox สามารถทำผ่าน commandline ได้ด้วยคำสั่ง
firefox -install-global-extension "/path/to/the/extension-file.xpi"
เปลี่ยน path ที่ download extension มาให้ถูกต้องนะครับ
ลองทดสอบโลดครับ
<?
$url = "http://www.scriptdd.com/";
system("firefox -savepng $url");
?>
Script จะทำการเปิด Firefox เรียก URL ดังกล่าว Load หน้าจอจนเสร็จ
แล้วปิดตัวเอง
และก็จะได้รูปออกมา Save ได้ที่ตำแหน่ง Download ของ Firefox
อย่างผมจะตั้งไว้ที่ Desktop
ตัว extension ระบุว่าสามารถ Save เป็นทั้ง jpg และ png
แต่ผมทดสอบดูมันได้แต่ png หว่า ยังไงใครเอาไปดัดแปลงลองเช็คดูนะครับ
สรุป
จากที่กล่าวมาทั้งหมดผมคงสร้างแนวคิดได้แล้วว่าการจับภาพหน้าจอ Website คงไม่ใช่เรื่องยากแล้ว
ต่อไปถ้าคิดจะนำไปพัฒนาต่อ คงเป็นเรื่อง การ Crop รูป การ Resize รูป
การทำ Javascript CSS Ajax เพื่อรับตรวจสอบ Link ต่างๆ อันนี้คงเป็นเรื่องยากต่อไป
อีกเรื่องคุณควรติดตั้ง plugin ต่างๆของ Web Browser ที่จะใช้งานให้ครบถ้วนด้วยนะครับ
ไม่ว่าจะเป็น Java หรือ Flash เพื่อให้ทั้ง IE และ Firefox Engine สามารถแสดงผลได้ถูกต้อง
อ้างอิง
http://iecapt.sourceforge.net/
http://pearlcrescent.com/products/pagesaver/
http://www.zubrag.com/scripts/website-thumbnail-generator.php
http://www.zubrag.com/forum/index.php/topic,82.0.html
Read (32,318)
Comments (23)
2007-04-14 17:37:14
ความคิดเห็น
โอว!
ยอดมากครับพี่
ขอบคุณสำหรับเรื่องราวดีๆครับ
โดยคุณ อ๊อด
2007-04-14 22:06:48
หายไปยาวๆ มีบทความดีดี มาเลยเชียว ^^
โดยคุณ pikae
2007-04-15 01:30:33
โอ๊ววยอดเยี่ยมมากเลยคับ..ขอบคุณมากครับ
เที่ยวสุรินทร์นึกถึง สุรินทร์ร้อยแปด http://www.surin108.com โดยคุณ ดอกธูป
2007-04-15 02:04:51
ก็สวยดีแล้ว สีชมพู อย่าคิดมาก ฮิๆ
ทีจริง มันน่าจะมีคนทำ module ออกมา สำหรับ php/perl นะ
โดยคุณ โต้ง
2007-04-15 10:34:28
ลองนี่ดู
คุณสมบัติค่อนข้างครบเลยจริงๆ
รีบไปโหลดซะนะ ก่อนมันจะไม่ฟรี
http://www.websitescreenshots.com/
โดยคุณ ปุก
2007-04-15 10:42:46
สีชมพู มันน่าร้ากกกก มากๆ เลยเฮีย
โดยคุณ พร อันทะ
2007-04-15 10:45:38
ไม่ได้เข้าเว็บสะนาน เว็บสวยขึ้นเยอะเลย แบบว่าชอบเรียบๆ อย่างนี้อะ
ลิงค์อื่นอีกวิธีคับ http://www.titov.net/2006/03/19/how-to-make-site-screenshots-with-linux-server/
โดยคุณ rokoman
2007-04-16 01:04:08
ลืมอีกลิงค์ http://www.debian-administration.org/articles/413 สำหรับคนใช้ firefox
ชีวิตอยู่กับลีนุกส์ทุกวันชั่งมีความสุขจิงๆ
สาวก debian, php
โดยคุณ rokoman
2007-04-16 01:16:38
มาคราวนี้มีเรื่องดี ๆ มาให้อ่านอีกแว๊ววว ดีจัง
โดยคุณ 9GRiT
2007-04-16 10:34:09
เอ อย่างนี้ ก็น่าจะมี plugins สำหรับ Wordpress ด้วยสิเนี่ย เดี๋ยวไปหาดีกว่า
โดยคุณ DJ PAT
2007-04-20 01:35:40
ยังๆไง ก็ต้องใช้ browser เหรอ น่าจะ generate ผ่าน scripts
ป.ล. ตอนแรก นึกว่าเข้าผิดเว็บ
โดยคุณ Patrickz
2007-04-24 16:51:31
เยี่ยม ครับ เยี่ยม เอาอะไรแบบนี้มาอัพเดทบ่อย ๆ น่ะครับ
โดยคุณ modx
2007-04-27 13:44:25
เจ๋งๆ ชอบครับ
โดยคุณ ตั๋ง
2007-05-08 17:23:07
เจ๋งมากๆ ครับ ชอบๆ อยากได้แบบนี้มานานแล้ว เคยแกะรอย Snap แล้วแต่ไปไม่ถูก
โดยคุณ msdn
2007-06-18 01:40:46
สุดยอดมากเลยอ่ะ
โดยคุณ jommann
2007-11-02 15:58:04
ส่วนผมนี่ ยุ่งยากกับทางโฮสต์มากกว่าครับ อยากได้แบบเขียนด้วย GD มีเปล่ครับพี่อั้ม(พัชราภา)
โดยคุณ k2w
2008-01-03 21:07:37
เยี่ยมครับ ขอบคุณมาก
โดยคุณ นายอักษร
2008-11-30 18:55:16
มีวิธีทำให้มัน Auto run เว็บที่เราอยากให้ capt หรือป่าวครับ
โดยคุณ penthai06
2008-12-02 13:03:01
เยี้ยมครับ แต่ผมว่าผมไม่เข้าใจอยู่ดีครับพี่
ผม แบบว่า งง
โดยคุณ โต้ครับ
2010-01-22 11:08:46
ขอบคุณครับ
โดยคุณ wcee
2010-05-02 12:39:06
มีวิธีนี้ด้วยหรอคับๆ
ขอบคุณมากๆๆ คับ
โดยคุณ #include<mildz.h>
2010-07-18 16:57:40
เอาไปใช้ในบล็อกเราบ้างดีกว่า
โดยคุณ ijunnn
2010-08-06 16:14:56
เยี่ยมๆ เลยครับ แจ่มๆๆ
โดยคุณ bom
2010-08-28 15:46:11