![]() หมวดหมู่
|
Flash Upload Multi File
วันที่
30 พ.ย. 51 + 19:00.49
ความคิดเห็น
0
กลุ่ม
PHP
มาอัปโหลดไฟล์ทีละเยอะๆด้วย flash ดีก่า
ว่าจะไม่เขียนแล้วนะ แต่มีคนขอให้เขียน จิงๆก็ไม่กล้าขัดอ่ากลัวเผื่อวันไหนเค้านึกสนุกอยาก "เทคอันเด้อ!!" เราขึ้นมาจะแย่ ซึ่งเป็นความสามารถพิเศษของเค้าเลยก็ว่าได้ เข้าเรื่องดีฝ่า เรื่องกะมีอยู่เกิดสนใจตัวอัปโหลดรูปของเว็ป photobukket ขึ้นมาเพราะมันที่เดียวแล้วเลือกได้ที่ละหลายๆไฟล์ โดยกด เลือกไฟล์แล้วกด Ctrl ค้างไว้แล้วเลือกไฟล์ ไม่ต้องมากดเลือกทีละไฟล์อย่างทุกที แล้วมันอัปขึ้นไปให้เราเลย ด้วยความอยากรู้อ่ะนะมันทำยังไงหว่า แอบดูประตูหลังหน่อยจิ๊ ก็ได้ความว่ามันใช้ความสามารถของ flash มาอัปโหลดรูปขึ้นนั่นเอง แต่ด้วยความสามารถทางการแกะอันยอดเยี่ยมของข้าพเจ้า ดูแล้วว่ามันคงง่ายเกินไปที่เราจะทำได้(มั้ง) ว่าแล้วที่พิ่งสิ่งแรกที่พิงจะคิดได้ ถามอากู๋นั้นเอง พอนึกได้ดังนั้นกด home เข้าไห้ ไส่ keyword ไปเลย flash+upload+multi file พอ ขึ้นปั๊บเข้าลิ้งแรกเลย จิงๆก็ดูหลายเว็ปอ่านะแต่อันแรกมันน่าสนใจสุด ด้วยความว่ารีบจะเลิกงานล่ะ ดูผ่านๆ เซฟๆ แล้วโยนไส่ hdd กลับบ้าน กลับมาถึงนั่งหายใจทิ้งจั๊กหน่อยก็มาเปิดดูที่เซฟไว้ อ่าว "ชิหายแระ" มัน เป็น Flash กะ asp.Net เฮ้อ... แต่ด้วยความว่าอยากจะใช้อ่ะอ่านผ่านๆด้วยเทคนิคการเดาสุ่ม เออเว้ยใช้กะ php ได้ด้วย แต่อ่าวไหนละวิธีใช้ ว่าแล้วต่อ gprs ออนเอมเปิดเว็ป+ก็ถามเสี่ยเอกเค้าจั๊กหน่อยพอเป็นกะสัย สรุปว่ามันจะใช้ได้ ระหว่างที่กำลังถามไปด้วยหาไปด้วยก็เจอ มันแอบอยู่ในคอมเมนต์หน้า 4 นี่เอง โฮ๊ะๆๆๆๆ (ออกอาการมากไปตรู) ได้ความล่ะ ก่อนลงมือทำมาดูหลักการของมันก่อน ด้วยหลักการที่ ให้ตัว flash ทำงานในส่วน cliant ส่งไฟล์ที่เราต้องการไปยัง server โดยให้ server side language เช่น php, java, coldfusion, asp อื่นๆ ทำการประมวลผล แต่ที่เราจะทำกันคือ php ซึ่งเราจะให้ php ทำการรับไฟล์ที่ส่งมาจาก cliant หรือที่ flash ส่งมาบันทึกไฟล์ลงบน server ของเรา มาลงมือทำกันดีกว่าหลักการรู้แค่พอเป็นพิธีพอ เริ่มต้นด้วยไปโหลดไฟล์ FlashUpload.zip จากหน้าเว็ปเค้ามาก่อน (ต้องเป็นmember) ใครจะอ่านเนื้อหาเพิ่มเติมก็ตามใจเด้อ หลังจากได้ไฟล์มาแล้วก็ระเบิด zip เอาไฟล์ที่ชื่อว่า FlashFileUpload.swf ที่อยู่ในโฟล์เดอร์ FlashUpload ออกมา ส่วนไฟล์ที่เหลือจะเก็บไว้เชยชมหรือจะลบทิ้งก็ตามใจเพราะเราไม่ได้ใช้ โหลดมาตั้งเยอะใช้ไฟล์เดียว จริงมันคือ source ของ ASP กับ flex ไว้คราวหน้าราค่อยมาพูดกันถึงการประยุกตืใช้งานและการแก้ใข source ของ flex กันเพราะหน้าตามันอาจจะถูกใจเรามากเกินไปเลยต้องทำให้มันดูแย่ๆหน่อย *-* ส่วน source ของ ASP ตัวใครตัวมัน lol~ ขั้นแรกเริ่มต้นด้วยสร้างไฟล์ html ชื่ออะไรก็ได้ ในที่นี้ข้าพเจ้าใช้ index.html เพื่อเรียกใช้งาน flash <html>
<head>
<!-- Include the javascript -->
</head>
<body>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0"
width="600"
height="370"
id="fileUpload"
align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="FlashFileUpload.swf" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<param name="flashvars" value='
&completeFunction=UploadComplete()
&fileTypes=*.gif%3b+*.png%3b+*.jpg%3b+*.jpeg
&fileTypeDescription=Images
&totalUploadSize=2097152
&fileSizeLimit=524288
&uploadPage=uploadfiles.php'>
<embed
src="FlashFileUpload.swf"
flashvars='
&completeFunction=UploadComplete()
&fileTypes=*.gif%3b+*.png%3b+*.jpg%3b+*.jpeg
&fileTypeDescription=Images
&totalUploadSize=2097152
&fileSizeLimit=524288
&uploadPage=uploadfiles.php'
quality="high"
wmode="transparent"
width="600"
height="370"
name="fileUpload"
align="middle"
allowScriptAccess="sameDomain"
type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
<script language="javascript">
function UploadComplete()
{
window.location = 'uploadcomplete.php';
}
</script>
</body>
</html>การกำหนดค่าดังนี้
ขั้นต่อไปมาลงกะ php บ้าง สร้างไฟล์มา 1 ไฟล์ชื่อ uploadfiles.php (หรือชื่ออื่นก็ได้) เพื่อทำการบันทึกไฟล์ที่ทาง flash ส่งมาลงบน server ขอเอาแบบง่ายๆ เพื่อเป็นตัวอย่างละกัน ในที่นี้ผมได้เก็บชื่อไฟล์ลง session เพื่อเอาไว้แสดงผลแบบง่ายๆ <?php
session_start ();
$uploaddir = dirname ( $_SERVER['SCRIPT_FILENAME'] ) ."/UploadedFiles/";
if ( count ( $_FILES ) > 0 )
{
$arrfile = pos($_FILES);
$uploadfile = $uploaddir . basename ( $arrfile['name'] );
$_SESSION['filelist'][] = $arrfile['name'];
if ( move_uploaded_file ( $arrfile['tmp_name'], $uploadfile ) )
echo "UploadComplete();";
}
?>ต่อไปก็สร้างไฟล์แสดงผลการอัปไฟล์ที่เราอัปขึ้นไป ชื่อ uploadcomplete.php ละกันเอาแบบง่ายๆ เพื่อแสดงผลว่าเราได้อัปไฟล์อะไรขึ้นไปบ้าง จิงๆตรงนี้ต้องเป็นส่วนที่ดำเนินการเอาไฟล์ไปใช้ว่าจะใช้ทำอะไรก็ตามแต่จะ ออกแบบกันละครับ ในที่นี้ผมเลือกแสดงชื่อไฟล์เฉยๆ <?php session_start (); echo '<pre>'.print_r ( $_SESSION['filelist'], true ).'</pre>"; ?> สุดท้ายสร้างโฟล์เดอร์ชื่อ UploadedFiles มาหนึ่งอันเพื่อเก็บไฟล์ที่เราอัปขึ้นไปก็จะได้ไฟล์ดังนี้ ![]() ซึ่งไฟล์ทั้งหมดนี้ผมเอาไว้ในโฟล์เดอร์ชื่อ FlashFileUpload ก็แล้วกัน เมื่อได้ไฟล์ครบแล้วเรามาลองกันเลย เข้าไปที่ http://127.0.0.1/FlashFileUpload/index.html เพื่อลอง test ดู จะพบกับปุ่ม add files อยู่ปุ่มนึง *-* ![]() ทดลองไส่ไฟล์ลงไป ![]() กดปุ่มอัปดูมันก็จะแสดงผลไฟล์ออกมา (ไม่ต้องตกว่าทำไมมีหลานอัน ผมจิ้มลองหลายทีไปหน่อยแล้วลืมล้าง session) T__T ![]() ดูไฟล์ที่อัปขึ้นไปหน่อยจิ๊ ![]() จากการทดสอบพบว่าใช้งานได้ดีในระดับนึงเลยล่ะ เราสามารถนำไปประยุกใช้งานในการอัปรูป อัปไฟล์ แล้วแต่การออกแบบ คราวหน้าเราจะมาถึงการปรับเปลี่ยนหน้าตาของตัวอัปใหม่รวมถึงการประยุกใช้งาน ในรุปแบบต่างๆ จะเมื่อไรก็บอกไม่ได้แล้วแต่อารมย์ที่จะเขียน ปล. อาจจะมีปัญหาบ้างกับโฮสที่เป็น unix ก็อย่าลืม chamd โฟล์เดอร์ที่อัปไฟล์เป็น 777 ก่อนละกันเด้อ ว่าแต่เว็ปตรูกะมีทำไมไม่เขียนหว่า อ้างอิง http://www.codeproject.com/KB/aspnet/FlashUpload.aspx flash, php, upload
|
ขับเคลื่อนโดย un-no Engine 2.1.2 © ลิขสิทธ์โดย บริษัท อันโน คอร์ปอเรชั่น จำกัด [ แผนที่เว็บไซต์ ]
แก้ไขล่าสุด: 2009-11-15 00:40:43, หมายเลขเซสชั่น: ce3dd4e452b40e0dc877041c2c00c3db, ใช้เวลาสร้าง: 0.041872025 วินาที