Beberapa hari terakhir di forum programmer Kaskus lagi rame pertanyaan tentang caranya upload file pakek JSP. Daripada pusing-pusing mendingan gw pake library bawaan apache, yaitu Apache Commons FileUpload.
Aplikasi sederhana ini terdiri dari 1 buah JSP sebagai presentation layer dan 1 Servlet buat handle uploading file-nya. Konsep-nya sederhana, semua file yang keupload akan disimpan didalam folder /image yang terletak 1 folder dengan file index.jsp.
Oke, langsung kita mulai kalo gitu. Ini file index.jsp gw,
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>JSP Page</title> </head> <body> <h1>Hello World!</h1> <form action="upload" method="POST" enctype="multipart/form-data"> Select file : <input type="file" name="fileSelect" /> <br /> <input type="submit" /> </form> </body> </html>
dan ini servlet buat handle upload file ataupun image,
package com.baculsoft.servlet; import java.io.File; import java.io.IOException; import java.io.PrintWriter; import java.util.List; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.apache.commons.fileupload.FileItem; import org.apache.commons.fileupload.disk.DiskFileItemFactory; import org.apache.commons.fileupload.servlet.ServletFileUpload; public class UploadServlet extends HttpServlet { protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); // get your absolute path String uploadTo = getServletContext().getRealPath("/") + "image/"; try { boolean isMultipart = ServletFileUpload.isMultipartContent(request); // no multipart form if (!isMultipart) { out.println("<html>"); out.println("<head>"); out.println("<title>Servlet UploadServlet</title>"); out.println("</head>"); out.println("<body>"); out.println("<h1>No Multipart Files</h1>"); out.println("</body>"); out.println("</html>"); } // multipart form else { // Create a new file upload handler ServletFileUpload upload = new ServletFileUpload(new DiskFileItemFactory()); // parse requests List<FileItem> fileItems = upload.parseRequest(request); // Process the uploaded items for (FileItem fileItem : fileItems) { // a regular form field if (fileItem.isFormField()) { } // upload field else { String fileName = fileItem.getName(); File fileTo = new File(uploadTo + fileName); fileItem.write(fileTo); out.println("<html>"); out.println("<head>"); out.println("<title>Servlet UploadServlet</title>"); out.println("</head>"); out.println("<body>"); out.println("<h1> success write to " + fileTo.getAbsolutePath() + "</h1>"); out.println("</body>"); out.println("</html>"); } } } } catch (Exception ex) { ex.printStackTrace(); } finally { out.close(); } } @Override protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); } @Override protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { processRequest(request, response); } }
abis itu gw register servlet gw di web.xml
<?xml version="1.0" encoding="UTF-8"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> <servlet> <servlet-name>upload</servlet-name> <servlet-class>com.baculsoft.servlet.UploadServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>upload</servlet-name> <url-pattern>/upload</url-pattern> </servlet-mapping> <session-config> <session-timeout> 30 </session-timeout> </session-config> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> </web-app>
ini struktur project gw di Netbeans.
Nah gampang kan 😉
nb.
untuk tutorial lebih lengkapnya bisa dicek disini
mas edwin saya masih bingung untuk web.xml nya ditaruh dmana yah ?
Hi Teguh,
web.xml itu ditaro dibawahnya WEB-INF 🙂
mas web.xmlnya taro dimana ya? taro didalam web-inf ato dimananya? :-S terus kok uploadservletnya masih error banyak? ;-( kendalanya gimana nih? thx. 😀
web.xml dibawahnya web-inf
lalu apa error yg di uploadservlet? coba paste kesini mana tau gw bisa bantu.
mas edwin kok saya ikuti langkah langkah di atas dan saya sudah download lib tambahannya commons file upload nya tapi kok tidak terjadi apa apa yah .. file yang saya pilih ga bisa di upload , tapi di web browsernya tidak muncul kesalahan cuma pas saya submit menampilkan halaman kosong dan saya liahat ke folder image nya tidak ada apa2 .. hmm kira kira kenapa yah?? mohon petunjuknya makasih. arif
hi arif,
kamu deploy lewat netbeans atau via tomcat langsung? Coba cek di consolenya tomcat ada error atau tidak? Biasanya kalo gagal dia akan cetak stackTrace errornya di console. 🙂
saya deploy via netbeans mas,
Kira kira beginilah erornya :
Jul 14, 2011 8:31:53 PM org.apache.catalina.core.StandardWrapperValve invoke
SEVERE: Servlet.service() for servlet upload threw exception
java.lang.ClassNotFoundException: org.apache.commons.io.output.DeferredFileOutputStream
at java.net.URLClassLoader$1.run(URLClassLoader.java:202)
at java.security.AccessController.doPrivileged(Native Method)
at java.net.URLClassLoader.findClass(URLClassLoader.java:190)
at sun.misc.Launcher$ExtClassLoader.findClass(Launcher.java:229)
at java.lang.ClassLoader.loadClass(ClassLoader.java:307)
at java.lang.ClassLoader.loadClass(ClassLoader.java:248)
at org.apache.commons.fileupload.disk.DiskFileItemFactory.createItem(DiskFileItemFactory.java:199)
at org.apache.commons.fileupload.FileUploadBase.parseRequest(FileUploadBase.java:361)
at org.apache.commons.fileupload.servlet.ServletFileUpload.parseRequest(ServletFileUpload.java:126)
at upload.upload.processRequest(upload.java:51)
at upload.upload.doPost(upload.java:93)
at javax.servlet.http.HttpServlet.service(HttpServlet.java:637)
at javax.servlet.http.HttpServlet.service(HttpServlet.java:717)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:290)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:233)
at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:191)
at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:127)
at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:102)
at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:109)
at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:298)
at org.apache.coyote.http11.Http11AprProcessor.process(Http11AprProcessor.java:859)
at org.apache.coyote.http11.Http11AprProtocol$Http11ConnectionHandler.process(Http11AprProtocol.java:579)
at org.apache.tomcat.util.net.AprEndpoint$Worker.run(AprEndpoint.java:1555)
at java.lang.Thread.run(Thread.java:662)
pada eror terdapat :
at upload.upload.processRequest(upload.java:51)
at upload.upload.doPost(upload.java:93)
kelas upload adalah kelas servletnya ,
line 51 menunjuk ke baris program ,
List fileItems = upload.parseRequest(request);
line 93 menunjuk ke baris program ,
processRequest(request, response);
apakah library yang saya pakai kurang yah mas?? mohon petunjuknya. mkasih banyak sudah di respon
hi Arif,
wah berarti kamu harus tempelin library Apache Commons IO
coba kamu cek tutorial gw yang satu lagi
http://edwin.baculsoft.com/2011/01/tutorial-upload-file-dan-isi-form-sederhana-ke-database-dengan-jsp/
disitu gw tempelin lib commons-io-2.0.1.jar
coba tempelin itu dulu, kali aja bisa jalan.
🙂
sip mas udah bisa jalan emang kurang library nya.. mkasih yah mas atas tutrial dan tanggapannya.. (Y) (Y) 🙂
sama-sama arif,
senang bisa bantu loe 🙂
mas edwin,
gw ikutin tutorial diatas kok ketemu error seperti dibawah, tu waktu sumbit munculnya tampilan kosong n image nya g masuk ke folder image.
Error :
java.lang.ClassCastException: org.apache.commons.fileupload.disk.DiskFileItem cannot be cast to org.apache.tomcat.util.http.fileupload.FileItem
at com.sample.UploadServlet.processRequest(UploadServlet.java:60)
at com.sample.UploadServlet.doPost(UploadServlet.java:113)
at javax.servlet.http.HttpServlet.service(HttpServlet.java:637)
at javax.servlet.http.HttpServlet.service(HttpServlet.java:717)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:290)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at org.netbeans.modules.web.monitor.server.MonitorFilter.doFilter(MonitorFilter.java:390)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:233)
at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:191)
at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:128)
at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:102)
at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:109)
at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:286)
at org.apache.coyote.http11.Http11Processor.process(Http11Processor.java:845)
at org.apache.coyote.http11.Http11Protocol$Http11ConnectionHandler.process(Http11Protocol.java:583)
at org.apache.tomcat.util.net.JIoEndpoint$Worker.run(JIoEndpoint.java:447)
at java.lang.Thread.run(Thread.java:619)
Terima Kasih sebelumnya.. 😀
Hi Cover,
coba diatas class loe kan ada tulisan
import org.apache.tomcat.util.http.fileupload.FileItem
, itu loe remove aja, ganti jadiimport org.apache.commons.fileupload.FileItem;
. Kayaknya loe salah import class bro, jadinya engga jalan. Nama class-nya sama (FileItem), tapi lokasi dan fungsinya beda.mas edwin,,
mau tanya,,
ane coba file upload pake spring ama jsp,,
diservletnya ane uda daftarin. seperti ini
UploadController
com.icon.ukp4.mobile.server.controller.UploadController
UploadController
/UploadController
akan tetapi,,,saat ane execusi,, itu dia gagal upload dikarenakan pada proses
List items = upload.parseRequest(request);
nah pada items saat ane cetak dia mengahasilkan []
gw uda coba cari tau kesana kemari, tapi belum dapet dapet juga,,hehe…
mohon bantuannya mas edwin
tks
hi yoga,
Kalo List fileItems isinya kosong, kemungkinan si request engga bisa menangkap apa yg loe kirim. Coba kamu deploynya pakek tomcat atau lewat netbeans? bisa di cek ada error apa di console? biasanya kalo error dia akan cetak errornya di console.
Btw, tulisan gw yg ini http://edwin.baculsoft.com/2011/01/tutorial-upload-file-dan-isi-form-sederhana-ke-database-dengan-jsp/ kayaknya lebih lengkap, coba kamu pelajarin dulu.
🙂
ane coba ikutin saran ente n ane coba tulisan yang ini.
kena exception: java.io.FileNotFoundException: H:\samplesource 2\FileUpload\build\web\image\PLTU 1 Pacitan – 01.jpg (The system cannot find the path specified)
untuk library nya yang ane pake uda ane masukin semua..
dan folder image jg uda ane tambahin di bawah webpage…
huff…. bingung ane kenapa si request ga nangkep yang ane kirim yah …
ane uda coba googling sana kemari,, ga nemu2…hiks 🙁
oh iya,, soalnya kalo ane implementasikan sama GXT-js ga ada masalah,,
tapi karen di sisi view nya ane mau ganti pake jsp.
timbul masalah seperti ini..huff..
eh salah bukan ganti tapi gw implementasikan ke jsp. ehehe…jadi ane bikin 2,,
hi Yoga, java.io.FileNotFoundException: H:\samplesource 2\FileUpload\build\web\image\PLTU 1 Pacitan – 01.jpg itu terjadi karena aplikasi engga bisa menemukan file PLTU 1 Pacitan – 01.jpg. Itu errornya ada dimana? Coba paste penggalan source code dan stacktrace exceptionnya secara lengkap kesini. Mana tau gw bisa bantu 🙂
nah permasalahan baru muncul lagi mas, hehe..
ini bikin tambah saya lebih bingung lagi.
saya coba bikin dan jalan kan pake netbeans, semuanya ok, normal n berjalan,,
begitu saya jalan kan di eclipse, boommm….
request ga nyampe ke controller.
padahal semua setingan uda ane sama in,
oh yaah disini ane pake spring mvc,
yang bikin bingung kenapa di netbeans jalan di eclipse kagak… :((
ada ide n masukan ga mas?
hi Yoga, coba eclipsenya di refresh, clean lalu build lagi. Emang kadang suka rada oon, ga langsung detect ada perubahan di source code.
mas edwin,,
mau tanya dunk,,
kalo pake jsp, kita mau setTextField hasil return dari database bisa ga?
kalo ada contoh nya, terima kasih banget..hehe…
thanx
bisa bro, ada 2 pendekatan.
Cara jelek = loe langsung query aja di jspnya.
Cara bagus = bikin konsep mvc, querynya di servlet lalu lempar ke jsp.
hallo mas saya lagi nih, hehe,
mas saya mengalami masalah serupa dengan mas yoga kira kira begini:
type Exception report
message
description The server encountered an internal error () that prevented it from fulfilling this request.
exception
org.apache.jasper.JasperException: An exception occurred processing JSP page /uploadfile.jsp at line 28
25: }else {
26: String fileName = fileItem.getName();
27: File fileTo = new File(uploadTo + fileName);
28: fileItem.write(fileTo);
29:
30:
31: }
Stacktrace:
org.apache.jasper.servlet.JspServletWrapper.handleJspException(JspServletWrapper.java:510)
org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:407)
org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:313)
org.apache.jasper.servlet.JspServlet.service(JspServlet.java:260)
javax.servlet.http.HttpServlet.service(HttpServlet.java:717)
root cause
java.io.FileNotFoundException: C:\Documents and Settings\arif\My Documents\NetBeansProjects\upload\build\web\Gambar\gaplek.JPG (The system cannot find the path specified)
java.io.FileOutputStream.open(Native Method)
java.io.FileOutputStream.(FileOutputStream.java:194)
java.io.FileOutputStream.(FileOutputStream.java:145)
org.apache.commons.fileupload.disk.DiskFileItem.write(DiskFileItem.java:449)
org.apache.jsp.uploadfile_jsp._jspService(uploadfile_jsp.java:88)
org.apache.jasper.runtime.HttpJspBase.service(HttpJspBase.java:70)
javax.servlet.http.HttpServlet.service(HttpServlet.java:717)
org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:377)
org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:313)
org.apache.jasper.servlet.JspServlet.service(JspServlet.java:260)
javax.servlet.http.HttpServlet.service(HttpServlet.java:717)
note The full stack trace of the root cause is available in the Apache Tomcat/6.0.26 logs.
bagian ini:
java.io.FileNotFoundException: C:\Documents and Settings\arif\My Documents\NetBeansProjects\upload\build\web\Gambar\gaplek.JPG (The system cannot find the path specified)
jadi kayak ga mau membaca direktori tempat upload di sisi server,
lib commons io nya baik baik aja ga ada maslah..
tapi path untuk upload kok kebaca
C:\Documents and Settings\arif\My Documents\NetBeansProjects\ padahal itu kan directory client..
apa yah msalahnya ..?? mungkin mas edwin bisa bantu..
hmm ternyata butuh restart tomcat …. wah jadi malu saya.. 🙂
tapi malah timbul masalah baru….
jadi saya pakai ide netbeans .. file yang saya uload tadi bisa ke upload tapi kok malah larinya ke project/build/web/Gambar
nah kok jadi saat saya ambil ga mau di tampilkan untuk upload saya gunakan
File savedFile = new File(getServletContext().getRealPath(“/Gambar/”), fullFile.getName());
sedangkan untuk nampilkannya:
out.println(““);
gambar nya kok malah di folder build sedangkan di folder web nya tempat aslinya project saya gambar nya kosong mlompong.. 🙁
untuk nampilinnya saya pakai :
out.println(“”);
nah gini,
folder build itu lokasi hasil buildnya Netbeans
jadi semua yg udah kebuild masuk kesana.
btw coba source loe paste ke pastebin(dot)com , lalu taro disini link hasil paste-nya. Jadi gw bisa lihat sekilas code loe gimana. Atau email ke gw edwin[at]baculsoft[dot]com
makasih atas tanggapannya mas, hehe maaf ngerepotin,
ini code untuk handler upload nya:
http://pastebin.com/p3UNgnzc
ini untuk code view gambarnya:
http://pastebin.com/gFEB5DtV
maaf mas udah terselesaikan saya yang salah ternyata kesalahan kecil tapi sangat basic, file nama gambarnya ternyata belum saya rename, jadi file gambar yang saya upload masih sama dengan nama aslinya padahal di database saya tambahin variable waktu upload di belakang nya.. maaf tpi btw gara gara scriptnya mas ini saya bisa upload gambar saya .. makasih sekali lagi
salam,
arif
😀 🙂
hahahaa, kesalahan sederhana tapi bikin panik yah. Gw sering tuh kayak gitu 😀
yup betul sekali mas… di pikir serius eh ternyata.. bener bener harus teliti .. apa lagi kalau coding kita salah cuma kurang titik atau koma..hahaha
tks, kalo register servlet di web.xml sebenernya perlu ga si?
tergantung bro
sebenernya servlet versi baru bisa pakek annotations, namun sayangnya belum semua appserver support servlet 3.
Saya mau tanya,
saya sudah mengikuti code nya seperti diatas,
tetapi setelah upload file, yg tampil hanya tampilan kosong, dan file tersebut tidak ter upload.
Bagaimana yah mengatasi nya?
Mohon bantuan nya.
Terima kasih 🙂
Hi May,
ada exceptionnya engga?
Exception pun tidak ada. Tidak muncul apapun 🙁
aneh, coba paste sourcecode-nya ke pastebin.
mana tau ada exception tapi di catch engga di print stacktrace-nya
kalo mau ganti directories gimana ya ? ga ngerti akses gambarnya kalo masih di build
Hi Pandi,
kamu bisa pake absolute path tapi belum tentu bisa kepanggil dari dalam webapps.
Mas, problem saya sama seperti May. Mohon penjelasannya
hi Ajim
ada errornya engga?
klo misalkan ada, coba paste kesini errornya.
HTTP Status 404 – /IniResepkuApaResepmu/upload
type Status report
message /IniResepkuApaResepmu/upload
description The requested resource (/IniResepkuApaResepmu/upload) is not available.
kalo kaya gitu kenapa ya kak? mohon bantuannya
//Welda Aprilia HTTP Status 404
coba dicek lagi path folder untuk upload, folder tidak terbaca/tidak ada.
//Edwin
Kalo saya tampilannya blank mas dan ngga ada exception apapun yang muncul, kira2 kenapa ya?mohon bantuannya, makasih
Hi Patriot Muslim,
coba di cek, berhasil upload engga?
mungkin perlu loe tambahin, misalkan ketika berhasil upload, dia otomatis redirect ke halaman lain.
mau tanya dong, kenapa gak keluar exception/error ya padahal gak masuk ke halaman yang boolean multipart itu?
aku udah pake yang library dari Oreillly hasil nya sama. kalo pake yang library Oreilly udah bisa ngeluarin pesan gambar telah disimpan tapi kok difolder image nya gak ada ya ?? bingung mas, mohon tutor nya :))
coba paste sourcecode loe lalu taro di github,
mana tau ada masalah di codingan loe.
agak susah kalo hanya nebak2 dan ga lihat sourcecode-nya
mas edwin, kalo caranya untuk retrieve nya lagi ke halaman jsp gimana caranya? terimakasih.
halo Hamdan,
bisa aja, kamu simpen kan nama filenya di db lalu tinggal kamu query
kasih absolute path dari url browser aja.
gan,mau tanya ??
ya tanya apa ya gan?
mas edwin,saya upload file common apache nya kok gak bisa ya??
malahan program saya jadi error..gimana solusinya mas?
errornya apa?
coba paste kesini isi errornya
ini kenapa ya gan pertama saya taru di jsp gagal teru yang ke dua taru di serlet juga gagal
error di glassfishnya :
type Exception report
messageInternal Server Error
descriptionThe server encountered an internal error that prevented it from fulfilling this request.
exception
javax.servlet.ServletException: Error instantiating servlet class com.tolearnjava.owl.servlet.upload
root cause
java.lang.NoClassDefFoundError: org/apache/commons/fileupload/FileItemFactory
root cause
java.lang.ClassNotFoundException: org.apache.commons.fileupload.FileItemFactory