Ci upload file

Codeigniter รู้จักวิธี Upload file

Codeigniter ในประเทศไทย น่าจะยังคงเป็น PHP Framework ที่เหมาะกับมือใหม่ ไปอีกนาน หลังจากที่ Series นี้ ในบล็อกของผม ได้รับความนิยมในการเข้ามาเรียน และสอบถามอยู่เยอะไม่น้อย วันนี้เลยมากล่าวถึง วิธีการ Upload File รูปภาพเข้าไป จัดเก็บไว้ในระบบ แบบเริ่มต้นกันครับ

Ci upload file

Ci upload file

Codeigniter Upload file

วันนี้จะพามาดู วิธีการสร้าง Form สำหรับ Upload รูปภาพซึ่งสามารถ นำไปประยุกต์ใช้กับ การ Upload file ต่างๆได้ด้วยเช่นกัน CI เตรียมเครื่องมือมาให้เรา ค่อนข้างพร้อมแล้ว เราสามารถที่จะทำงานได้ง่าย เร็ว และไม่ยุ่งยากเท่ากับการเขียนด้วย PHP ล้วนๆเหมือนเดิม

Ci เตรียม Function ที่จะใช้สำหรับ การทำงานรูปแบบ Upload เอาไว้ให้เราแล้ว ในลักษณะของ Library ซึ่ง ในส่วนของ Library นี่จริงๆแล้วมีอะไร ให้เราเลือกใช้งานได้เยอะเลย ใครมีโอกาสแนะนำให้ลองขุดคุ้ยดูใน Code นั้นแหละครับ ส่วน Upload ที่เรากำลังจะเอามาใช้กัน มันจะประกอบไปด้วย การเรียก function และการ ตั้งค่า

อันดับแรก ขออธิบายค่าต่างๆที่อยู่กฏเกณฑ์ ที่จะให้เราตั้งก่อนนะครับ

  • upload_path : อันนี้จะเป็นค่าของ Folder ที่เราจะใส่ระบุเป็น path ตั้งแต่ตัว folder ของ project เข้ามา
  • allowed_types : อันนี้เป็นค่า สำหรับระบุ นามสกุล หรือไฟล์ extension ที่จะให้เข้า ถ้ารูปภาพก็พวก jpg, png, gif หรือไม่ก็ไฟล์ zip หรือ PDF แบบนี้ แต่หากใครอยากรับได้ทุกอย่าง แบบวงแคลช ก็ต้องนี่เลย * เอาหมดทีเดียวไปเลย
  • file_name : อันนี้สำหรับเปลี่ยนชื่อไฟล์ หากต้องการเปลี่ยนชื่อตอน upload นะครับ
  • Overwrite : ค่านี้สำหรับ ระบุว่าหากชื่อไฟล์ ซ้ำกัน เหมือนกัน จะให้ Save ทับไปเลยไหม
  • max_size : ค่านี้สำหรับ กำหนดขนาดของไฟล์ หน่วยเป็น KB ซึ่งอันที่จริง ต้องดูใน php.ini ด้วยนะครับ
  • max_width : ค่านี้ก็ สำหรับความกว้าง ที่จะให้ upload ได้
  • max_height : มีค่ากว้างแล้ว ก็ต้องมีค่าความสูง
  •  max_filename : ค่านี้จะเอาไว้กำหนดความยาว ของชื่อไฟล์ ที่จะ upload เข้ามาครับ ไม่เคยใช้เหมือนกัน ยาวเทาไหร่ ก็รับหมดนะ
  • encrypt_name : อันนี้สำหรับ เข้ารหัสชื่อไฟล์ใหม่ ไม่ได้ใช้เหมือนกัน ปรกติผมใช้ วันเวลาที่ upload เข้ามา เก็บเป็นชื่อไฟล์มากกว่า
  • remove_spaces : อันนี้แนะนำว่าให้ใช้ เพราะเวลาเจอช่องว่าง ติดมาบนชื่อไฟล์จะทำการเปลี่ยนเป็น _  หรือเครื่องหมาย underscore ให้เลย

พอรู้จักกับ ข้อมูลในการ Config กันไปบ้างแล้ว ต่อมาจะแนะนำให้รู้จักกับ Function ที่ใช้งานสำหรับการ upload ซึ่งมีด้วยกันอยู่ 3 function หลักๆครับ

  • do_upload() : ตัวนี้สำคัญเลย ทำความรู้จักกับเค้าไว้ หน้าที่ของเค้าคือ ทำการตรวจสอบค่า config และข้อมูลของ file ที่เราทำการ upload ขึ้นมา หากตรงตามข้อกำหนด ที่เราระบุไว้ มันจะทำการ ย้ายรูปหรือไฟล์ ไปตาม path ที่เราตั้งค่า แล้วถ้าทำสำเร็จ มันจะคืนค่ากลับมาเป็น True ถ้าไม่สำเร็จมันจะคืนมาเป็น False เท่านั้นแหละ
  • display_error() : เนื่องจากว่า เจ้า function do_upload() เวลาทำงานไม่สำเร็จ ดันไม่ยอม บอกคนอื่นเค้า ว่าทำอะไร พลาดไปตรงไหน อะไรไม่ถูกต้อง เลยจำเป็นต้องให้ display_error เป็นตัวกระจายข่าวแทน
  • data() : อันนี้จะแสดงข้อมูล ที่เป็นรายละเอียดของไฟล์ ที่เราทำการ upload ขึ้นมานั้นแหละ เช่นชื่อไฟล์ ขนาดไฟล์ นามสกุลไฟล์
    Codeigniter Explanation

    Explanation

     

แค่นี้ก็น่าจะครบถ้วนนะครับ มาเริ่มดูการเขียน Upload กันเลยแล้วกัน โดยจะเริ่มด้วย Form ของฝั่ง HTML ครับ

<?php
echo form_open_multipart('welcome/saveimg');
?>
<input type="file" name="featured" id="featured" />
<input type="submit" value="upload">
</form>

ผมสร้าง form ง่ายๆขึ้นบนไฟล์ที่ชื่อ welcome_message.php ที่ได้มาหลังจากติดตั้ง Codeigniter บน view นะครับ ส่วนของ controller ก็แค่เรียก view ขึ้นมา

public function index()
{
$this->load->view('welcome_message');
}

เอาละ จากนั้นก็มาถึง method ที่เราจะส่งค่าจาก form เข้ามา นั้นก็คือ saveimg นั้นเอง อันนี้ผมเขียนไว้กับ controller เดียวกันเลย

public function saveimg()
{
$config['upload_path'] = 'assets/images/';
$config['allowed_types'] = 'gif|jpg|jpeg|png';
$config['max_size'] = '1024';
$config['max_width'] = '1024';
$config['max_height'] = '1024';
$config['remove_spaces'] = TRUE;
}

อันนี้เป็นส่วนของการ Set ค่าตามที่ด้านบนบอกเอาไว้นะครับ ในส่วนของ upload_path คือ folder ที่เราจะเก็บรูป ทีนี้ เราจะต้องทำการเรียก library upload ขึ้นมาใช้งานแล้ว ใส่ต่อจากบรรทัดเมื่อกี้เลย

$this->load->library("upload",$config);

จากนั้น เรามาใช้ function do_upload() กันดู โดยผมจะใช้วิธีดัก If Else  หากข้อมูลไม่ผ่าน ก็จะให้ แสดงข้อมูลจาก Function display_error() แต่ถ้าผ่านก็แสดงข้อความ และรายละเอียดจาก function data()


if ($this->upload->do_upload('featured')) {
// Files Upload Success
echo "OK Good";
var_dump($this->upload->data('featured'));

} else {
// Files Upload Not Success!!
$errors = $this->upload->display_errors();
echo $errors;

} // End else

ตอนนี้เราก็จะได้ Function สำหรับการ Upload กันแล้ว ลองมา upload ดูกันเลยดีกว่า

Basic Upload

Basic Upload

OK ก็ Upload เบื้องต้นได้แล้ว ทีนี้มันยังไม่หมด หากเราต้องการทีจะทำการ Upload มากกว่า 1 ไฟล์ ในครั้งเดียวกัน จะทำอย่างไร ทำได้ไหม อันนี้ก็ไม่ยากเย็นอะไรเลย ถ้าเราทำความเข้าใจกับ การ Upload แบบ 1 ไฟล์ได้ดีแล้ว ต่อไปเรามาดูแบบหลายไฟล์กันต่อครับ

ถ้าเรามีไฟล์อยู่ หลายไฟล์ ใน 1 form จะทำการ upload ขึ้นมาอย่างไรพร้อมกัน ทำได้ด้วยการใช้ foreach ในการวนลูปเข้ามาช่วยครับ แต่ก่อนอื่น ขอแนะนำให้รู้จักกับ $_FILES เพื่อนเก่าจาก Pure PHP นั้นเอง คือ ภาษา PHP นั้นเค้าเตรียมเจ้านี้ ไว้ให้เราอ่านข้อมูล ในลักษณะของ file ที่ถูกส่ง แนบมาจาก form ที่เป็นแบบ multiple part นั้นเอง

ในตัวแปรอย่าง $_FILES จะเก็บค่าต่างๆของ input ที่เป็นแบบ file ส่งมากับ form โดยหลักๆจะมี ชื่อของ input มาในรูป Array ระดับแรก แล้วก็ตามด้วย properties ของรูป ในชั้นต่อไป เช่น name เก็บชื่อไฟล์, type เก็บนามสกุลไฟล์, tmp_name เก็บไฟล์ในระบบ temp แล้วก็จะมี error กับ size ปิดท้าย

ผมลองปรับ Form ใหม่ให้รับค่าได้ 3 ช่อง โดยจะใช้ชื่อว่า featured, idcard, profile เพื่อเก็บไฟล์ 3 ไฟล์ที่จะ upload ขึ้นมา

form upload multiple

form upload multiple

จากนั้นใน Controller ผมจะลอง dump ค่าที่ถูกส่งมากลับ form ให้ดูก่อนสักรอบ

public function savemultiimg()
{
var_dump($_FILES);
}

แล้วลองมา Upload รูปเข้ามาก่อนครับ

dump files

dump files

จะเห็นครบทั้ง 3 ไฟล์เลยนะครับ รายละเอียดต่างๆ

ทีนี้เราจะมาทำการ Upload กันจริงๆแล้ว โดยเริ่มจาก ใส่ค่า Config ก่อน จากนั้นก็ไปเรียก upload library แล้ว Step ต่อมาก็ ทำการวน loop เจ้า $_FILES ซะ แล้วเอาชื่อของ input ไปไว้สำหรับ มาทำเป็น Key เพื่อใช้กับ function ที่จะทำการตรวจสอบอย่าง do_upload() แล้วก็เอา if มาดักว่าวนจนหมดไฟล์แล้วรึยังนะครับ แบบนี้เลย


foreach ($_FILES as $key => $value) {

if (!empty($value['tmp_name']) && $value['size'] > 0) {

if ($this->upload->do_upload($key)) {
// Files Upload Success
echo "OK Good";
var_dump($this->upload->data('name'));
echo "<br>";
} else {
$errors = $this->upload->display_errors();
echo $errors;
} // End else
} // End if
} // End foreach

เรียบร้อย เดี๋ยวเรามาลองดูกัน ว่ามันประสบผลสำเร็จไหม

upload mulitple ci

upload mulitple ci

เรียบร้อยเป็นการ Upload ที่ไม่ยากเย็นอะไรเลย ใช่ไหมครับ ci มีตัวช่วย ไว้ให้เราเยอะแบบนี้ เราเลยทำงานสะดวก บวกเข้าไปกับ พื้นฐานของ PHP ที่ถ้าเข้าใจเป็นอย่างดี ก็น่าจะช่วยได้เยอะเลยนะครับ ใครที่สนใจ Series CI อยู่ก็ยังมีอัพเดทกันตามมาให้เรื่อยๆนะครับ

Link: Upload File

ใครที่อยากได้เว็บไซต์หรือเว็บแอพลิเคชั่น หรือร้านขายของออนไลน์คุณภาพดี ราคาเหมาะสม หรืออยากเรียน Course ไหนก็ติดต่อเข้ามาพูดคุย สอบถามกันได้นะครับ

Line ID: teerapuh
Mail : teerapuch [@] hotmail.com