Các bản tin khác

Bài viết đáng chú ý

PHP Framework những điều nên và không nên

Khái quát về PHP Framework

Học PHP như thế nào khi bạn chưa biết lập trình?

Tự học lập trình PHP dễ hay khó ?

Web 2.0 - Khái niệm và bản chất của chúng như thế nào ?

Lập Trình PHP Căn Bản

Bài 18: Xây dựng ứng dụng tạo trang upload nhiều hình ảnh

Ở những bài trước, chúng ta đã có dịp nghiên cứu từng ứng dụng nhỏ bởi việc kết hợp PHP và Mysql. Trong bài này, chúng ta sẽ tiếp tục tìm hiểu phương pháp xây dựng một trang upload nhiều hình ảnh như thế nào. Và lưu chúng vào cơ sở dữ liệu ra sao trong lập trình php.

Mô hình này là rất cần thiết đối với các hệ thống. Bởi qua đó người sử dụng có thể thao tác và upload những hình ảnh đi kèm với hệ thống của họ như tin tức, sản phẩm,…

Đầu tiên, ta tiến hành xây dựng cơ sở dữ liệu với bảng images như sau (xem lại bài 9: cơ bản về ngôn ngữ sql và mysql).

Như vậy, tôi có bảng images với 3 cột thuộc tính là img_id dùng để lưu khóa của từng hình, img_url dùng để lưu đường dẫn vào hệ thống, img_name dùng để lưu tên hình ảnh.

Ứng dụng của chúng ta cũng rất cần sự tùy biến và dễ sử dụng. Sao cho người dùng có thể hoàn toàn thao tác. Ví dụ: nếu có 2 hình, họ chỉ muốn tạo ra 2 chế độ chọn file thì sẽ chỉ khai báo là 2. Và ngược lại nếu là n hình, họ sẽ tạo được n file lựa chọn. Để làm được điều này, trước tiên ta cần tạo 1 form nhỏ cho phép người dùng nhập vào số lượng file mà họ muốn thao tác. Vậy tôi khởi tạo file có tên upload.php với mã lệnh form như sau:

Sau khi người dùng nhấn nút accept thì cũng là lúc chúng ta tạo ra số field upload theo yêu cầu của họ. Vậy, ta có code xử lý bên dưới như sau: (xem lại bài 4: xử lý giá trị trên form).

Đoạn code này sử dụng vòng lặp for với điều kiện là biến $i sẽ nhỏ hơn số file mà họ nhập vào. Đồng thời, để việc upload thành công tại form ta cũng cần thêm đoạn code :

enctype='multipart/form-data'.

Số lượng field sẽ lặp theo yêu cầu của người dùng. Do vậy. tại name của thể input, ta sẽ sử dụng mảng để lưu thông tin. Sử dụng name='img[]', có nghĩa là mỗi lần lặp và mỗi lần người dùng chọn file thì mảng img sẽ thêm 1 khóa tương ứng. (xem lại bài 6: tổng quan về mảng về các hàm hỗ trợ)

Và cuối cùng là nút submit thực thi công việc upload và gọi tới trang doupload.php?file=$num (chỉ rõ số file cụ thể do người dùng nhập tại trang doupload).

Bài 18: Xây dựng ứng dụng tạo trang upload nhiều hình ảnh trong PHP

Vậy toàn bộ code của trang upload này sẽ như sau:

Tại trang thực hiện nhiệm vụ doupload.php ta cần kiểm tra xem, người dùng có nhấn nút upload từ trang bên kia hay không ?. Nếu có ta sẽ xử lý công đoạn upload ấy, nếu không ta cần thông báo lỗi cho người dùng và yêu cầu họ chọn file.

Như vậy, khi người dùng nhấn upload, ta sẽ lấy được tham số là biến $num từ liên kết $_GET[‘file'] mà ta đã thiết lập trên phần form action của file upload ở trang trước.

Biến $num này dùng để thực thi việc upload và tuần tự lấy các thông tin của file.

Để upload file từ máy lên hệ thống ta cần sử dụng hàm:

move_uploaded_file(tên_file_tạm,đường dẫn tới hệ thống).

Có thể diễn giải nôm na công việc của hàm này như sau: Ngay sau khi người dùng nhấn upload, hệ thống sẽ tạo ra 5 tham số ứng với từng file. Cụ thể là tên tạm (tmp_name), tên gốc (name), kích thước (size), định dạng mime (type) và lỗi (error) nếu có. Và khác với kiểu nhập liệu thông thường, khi chúng ta sử dụng <input type=file name=ten> thì lúc này sẽ phát sinh một biến môi trường mới là $_FILES[‘ten'] và dĩ nhiên nó sẽ đi kèm với 5 tham số cụ thể ở trên.

Ví dụ: $_FILES[‘ten'][‘name'] //Lấy ra tên gốc của file.

Vậy ứng với cú pháp upload ở trên ta sẽ có:

move_uploaded_file($_FILES['img']['tmp_name'],"data/".$_FILES['img']['name']);

Cú pháp này sẽ tự động upload hình ảnh lên thư mục data trên hệ thống. Vậy ta cần phải tạo thư mục data ngang cấp với 2 file upload và doupload. Nếu là host thật, bạn cần CHMOD thư mục là 777 (cho phép thư mục có toàn quyền) thì mới thực thi upload file được.

Trong tình huống của chúng ta, vì là upload một lúc nhiều file, nên lúc này ta phải sử dụng tham số mảng tại trang upload ta đã khởi tạo.

Vậy ứng với biến $num ta nhận từ upload ở trên ta sẽ triển khai code đơn giản như sau:

Với biến $i là số lượng tăng lên theo vòng lặp. Vì mảng luôn bắt đầu bởi khóa là 0 nên ta cần phải thiết lập khởi tạo biến $i với giá trị là 0. Biến $url và $name là đường dẫn hình ảnh và tên gốc của tấm hình được sử dụng để lưu vào CSDL.

Kế tới, ta cần lưu thông tin hình ảnh tương ứng vào cơ sở dữ liệu. Để làm được điều này, ta cần kết nối CSDL với cú pháp sau: (xem lại bài 10: kết hợp php & mysql trong ứng dụng website).

Như vậy mỗi khi upload thành công một hình ảnh, ta phải thêm hình ảnh đó vào CSDL như sau:

Sau khi thêm vào CSDL ta cần hiển thị thông tin và hình ảnh vừa upload để cho người dùng biết họ đã upload thành công.

Khi đó ta sử dụng một biến $site để lưu đường dẫn gốc hiển thị trên textbox.

Vậy hoàn chỉnh code cho file doupload.php này như sau:

Download toàn bộ mã nguồn của bài này tại đây.

Mọi sự góp ý, cũng như thắc mắc của các bạn dành cho bài viết vui lòng sử dụng tính năng thảo luận tại diễn đàn. Hoặc thông qua việc liên hệ của hệ thống website. Mong sẽ nhận được nhiều ý kiến đóng góp từ các bạn.

(Bùi Quốc Huy)
28140

Bạn vẫn chưa hiểu rõ vấn đề ?. Bạn vẫn còn nhiều điều thắc mắc ?. Bạn gặp lỗi khi thực hành mã lệnh trên ?. Hãy tham gia diễn đàn QHOnline.Info để nhận được sự giúp đỡ từ phía cộng đồng nhanh nhất. Đồng thời tải những tài liệu giá trị tại diễn đàn. Việc đăng ký là hoàn toàn miễn phí, hãy đăng ký ngay để chúng tôi giúp đỡ bạn nhé.

Ghi rõ nguồn từ website QHOnline.Info - Khi bạn phát hành lại thông tin từ website này

Phạm Trung (20:53 25/02/2010)

Em đã áp dụng nó và thấy cũng được tuy nhiên còn một số vấn đề như file cho vào ko phải là file ảnh thì vẫn ok. Nữa là nếu bỏ trống một đường dẫn thì trong csdl cũng vẫn xuất hiện 1 trường với giá trị null. Điều này làm ảnh hưởng khi truy xuất dữ liệu ra web. Xin admin bổ sung thêm được ko? Thanks

duy khánh (14:59 01/04/2010)

Bài viết hay quá thầy Huy ơi, nhưng em muốn là khi upload lên host rồi sẽ tự động rename file đó dãy random (vd: tintuc_34948.jpg) dc không thầy.

van (21:53 05/06/2010)

em dùng wamp server, cũng làm y như vầy nhưng nó báo lỗi là "Warning: move_uploaded_file(data/logo.jpg) [function.move-uploaded-file]: failed to open stream" . Mong thầy và mọi người chỉ giúp. Thanksssss!

van (22:06 05/06/2010)

ah, em xin lỗi mọi người vì đã hỏi câu vớ vẩn hồi nãy, em phát hiện ra lỗi sai rồi, là do em chưa tạo thư mục data, hihi. Thanks thầy vì bài viết rất hay.

Nguyennga (22:40 10/06/2010)

Toi muon hien thị anh moi nhat o chinh giua, con cac anh nho o day nho phia duoi thi phai lam nhu the nao?

thaodt_bn (15:16 26/12/2010)

hay qua...

Khuat' Van Nha^m (20:11 19/01/2011)

Anh cho em hoi? la` sao em "upload" ma` anh? no' kho^ng hie^.n le^n va^y?. :-?

võ duy hùng (13:13 21/02/2011)

sao từ trước tới giờ không có ai làm website kiểm tra nick skyper,kiểm tra nick trong game online như gunbound,gunny,gviet vvvvvvvvvvvvvvvvvvvậy

thaodt (01:40 02/03/2011)

mọi người và admin cho mình hỏi tại sao khi up ảnh lên ảnh lại không đc hiển thị chỉ giúp mình là tại sao ko??

quynh (11:19 02/04/2011)

em tải về rồi copy vào wamp cho chạy thử thi nó báo không kết nối được cơ sở dữ liệu[ Warning: mysql_connect() [function.mysql-connect]: Access denied for user 'root'@'localhost' (using password: YES) in C:wampwwwimagesdoupload.php on line 13
can't connect your database].em có sửa lại code kết nối, kể cả làm lại cơ sở dữ liệu
nhưng vẫn không được.bó tay thôi

nguyen van hung (01:52 26/04/2011)

anh viet rat gon,chi tiet va re hieu.em lam dc roi cam on anh admin

Mr PhieuLang (09:48 28/05/2011)

@quynh: wamp báo lỗi như vậy là do bạn khai báo sai, cụ thể như sau:
$conn=mysql_connect("localhost","root","root") or die("can't connect your database");

bạn phải để trống dòng pass của mysql:
$conn=mysql_connect("localhost","root","") or die("can't connect your database");
như vậy là chạy được ngay.

TrungMR (12:52 10/07/2011)

Bài Viết hay thật đó,công phu nữa , tks ^^!

Trang (20:53 12/07/2011)

Cám ơn anh đã post bài này .hay lắm

Nguyễn Thị Thu Thúy (23:42 20/09/2011)

thầy huy ơi khi em chạy bài của thày và 1 bài khác của em thì up được ảnh vào đúng thư mục, nhưng trong mysql database của em lại không lưu thêm dữ liệu mới nào. Em đã thử chạy câu lệnh insert ngay trong mysql thì cũng không chạy. Nhưng nếu như em bỏ dấu . ở 1.gif đi thì lại chạy tốt(em thử bỏ khi chạy câu lệnh ở trong sql ấy, còn file php thì hiện giờ vẫn không lưu được dữ liệu có dấu .). Bây giờ em phải làm thế nào ạ? Mong thầy giúp đỡ. Em cảm ơn nhiều.

phamhong (16:00 26/09/2011)

Thưa thầy ! Em muốn khi chọn được file hình ảnh thì hiển thị ảnh lên trang upload luôn. Như thế có được không ạ ! Em cảm ơn thầy.

phamhong (16:00 26/09/2011)

Thưa thầy ! Em muốn khi chọn được file hình ảnh thì hiển thị ảnh lên trang upload luôn. Như thế có được không ạ ! Em cảm ơn thầy.

gialai_pro (10:05 27/09/2011)

Cái này a chỉ cho ảnh vào thư muc để lấy ra theo đường dẫn.Anh có code chuyển đổi file ảnh thành kiểu binary vào cơ sở dữ liệu rồi hiển thị ra web ko??

Lê Thị NGọc (16:24 29/09/2011)

Bài hay nhưng hoc sinh không chịu học thì cũng bằng không mà thôi.

DongTX (01:15 01/10/2011)

có thể làm trang úp tất cả các file khác nữa ko

Longvh (00:06 08/10/2011)

upload video thi` sao cac ban???

long (12:10 09/10/2011)

sao khong co ai tra loi zay ?????????//

Kenny (14:19 09/10/2011)

Chào bạn, long

Upload video thì cũng vậy thôi bạn. Quan trọng là bạn phải kiểm tra định dạng và dung lượng upload file. Vì trên các hệ thống mặc định sẽ chỉ cho bạn upload file với dung lượng nhỏ hơn hoặc bằng 2MB.

Trong trường hợp bạn muốn upload file có dung lượng lớn hơn 2MB thì bạn phải tinh chỉnh trong file cấu hình php.ini.

Thực tế thì để upload phim, việc sử dụng upload dạng web là không khả thi bạn ạ. Vì phim nặng từ vài chục MB cho đến vài GB, nên cách tốt nhất là sử dụng phần mềm FTP để upload, sau đó đưa link vào trang web là tốt nhất.

caotuonglong (15:37 17/11/2011)

hay.hi vong ban sa giup cong dong dan tin hoc hieu sau hon ve php ,

mantran (13:18 25/11/2011)

kenly cho em hỏi làm sao để đưa file hình lưu trong mysql hiển thị lên trang web được zậy
CỤ THỂ NHƯ: hiển thị lên 1>>>
table có:- hình
-Tên hình
-gia...........
Em đang rất cần !!!! chỉ em vói>>> Em xin cảm ơn trước nha

Trần Ngọc Long (08:26 28/11/2011)

Cám ơn rất nhiều những người đã chia sẽ kiến thức của mình cho mọi người!
Có vấn để khi upload là thông thường thư mục upload được làm tuyệt đối ví dụ: /upload/video, nhưng bây giờ muốn tạo một đường dẫn tuyệt đối cho người sử dụng chọn thư mục upload thì làm cách nào? tức là người sử dụng có thể tạo, thay đổi thư mục upload. Trân trọng!

anh phuong (22:50 15/12/2011)

chao anh!
em da test tren localhost thi dc!
tren host thi no bao the nay

Warning: move_uploaded_file(data/15_16_aa2.jpg) [function.move-uploaded-file]: failed to open stream: Permission denied in /www/clanteam.com/a/n/h/anhbuon/htdocs/doupload.php on line 12

Warning: move_uploaded_file() [function.move-uploaded-file]: Unable to move '/www/clanteam.com/a/n/h/anhbuon/htdocs/phpHygILz' to 'data/15_16_aa2.jpg' in /www/clanteam.com/a/n/h/anhbuon/htdocs/doupload.php on line 12
Upload Thanh cong file 15_16_aa2.jpg

Images URL: