การอัพโหลดและดาวน์โหลดไฟล์ JSP
⚡ สรุปอย่างชาญฉลาด
การอัปโหลดและดาวน์โหลดไฟล์ใน JSP เป็นการดำเนินการรับและส่งข้อมูลหลักที่ช่วยให้เว็บแอปพลิเคชันรับไฟล์จากผู้ใช้และส่งไฟล์กลับไปยังผู้ใช้ได้ เอกสารนี้จะอธิบายขั้นตอนทั้งสองโดยใช้ฟอร์มแอ็กชัน JSP, Apache Commons FileUpload และคลาสเซิร์ฟเล็ต พร้อมโค้ดตัวอย่างที่ใช้งานได้จริง
การอัพโหลดไฟล์ JSP
- เราสามารถอัพโหลดไฟล์ใด ๆ โดยใช้ JSP
- อาจเป็นไฟล์ข้อความ ไฟล์ไบนารี ไฟล์รูปภาพ หรือเอกสารอื่นๆ
- ในกรณีที่อัปโหลดไฟล์ จะมีการใช้วิธี POST เท่านั้น ไม่ใช่วิธี GET
- ควรตั้งค่าแอตทริบิวต์ Enctype เป็น multipart/form-data
ตัวอย่าง: การใช้การกระทำ
ในตัวอย่างนี้ เรากำลังอัปโหลดไฟล์โดยใช้อ็อบเจ็กต์ IO
Action_file.jsp
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <!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=ISO-8859-1"> <title>Guru File</title> </head> <body> <a>Guru File Upload:</a> Select file: <br /> <form action="action_file_upload.jsp" method="post" enctype="multipart/form-data"> <input type="file" name="file" size="50" /> <br /> <input type="submit" value="Upload File" /> </form> </body> </html>
Action_file_upload.jsp
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <%@ page import="java.io.*,java.util.*, javax.servlet.*" %> <%@ page import="javax.servlet.http.*" %> <%@ page import="org.apache.commons.fileupload.*" %> <%@ page import="org.apache.commons.fileupload.disk.*" %> <%@ page import="org.apache.commons.fileupload.servlet.*" %> <%@ page import="org.apache.commons.io.output.*" %> <!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=ISO-8859-1"> <title>Guru File Upload</title> </head> <body> <% File file ; int maxFileSize = 5000 * 1024; int maxMemSize = 5000 * 1024; String filePath = "E:/guru99/data"; String contentType = request.getContentType(); if ((contentType.indexOf("multipart/form-data") >= 0)) { DiskFileItemFactory factory = new DiskFileItemFactory(); factory.setSizeThreshold(maxMemSize); factory.setRepository(new File("c:\\temp")); ServletFileUpload upload = new ServletFileUpload(factory); upload.setSizeMax( maxFileSize ); try{ List fileItems = upload.parseRequest(request); Iterator i = fileItems.iterator(); out.println("<html>"); out.println("<body>"); while ( i.hasNext () ) { FileItem fi = (FileItem)i.next(); if ( !fi.isFormField () ) { String fieldName = fi.getFieldName(); String fileName = fi.getName(); boolean isInMemory = fi.isInMemory(); long sizeInBytes = fi.getSize(); file = new File( filePath + "yourFileName") ; fi.write( file ) ; out.println("Uploaded Filename: " + filePath + fileName + "<br>"); } } out.println("</body>"); out.println("</html>"); }catch(Exception ex) { System.out.println(ex); } }else{ out.println("<html>"); out.println("<body>"); out.println("<p>No file uploaded</p>"); out.println("</body>"); out.println("</html>"); } %> </body> </html>
คำอธิบายของรหัส:
Action_file.jsp
Code บรรทัดที่ 12-18: ในที่นี้เรากำลังสร้างฟอร์มที่มีช่องสำหรับป้อนไฟล์ ซึ่งจะใช้ในการอัปโหลดไฟล์ไปยังเซิร์ฟเวอร์ และการดำเนินการจะถูกส่งต่อไปยังไฟล์ action_file_upload.jsp
Action_file_upload.jsp
Code 20 แนว: ในที่นี้เรากำลังระบุพาธของไฟล์ไปยังพาธที่เฉพาะเจาะจง
Code บรรทัดที่ 23-38: ในขั้นตอนนี้ เราจะตรวจสอบว่าประเภทเนื้อหาเป็นแบบ multipart/form-data หรือไม่ ถ้าใช่ เนื้อหาจะเป็นประเภทไฟล์ และจะถูกอ่าน หลังจากอ่านไฟล์แล้ว ข้อมูลจะถูกเขียนลงในไฟล์ชั่วคราว จากนั้นไฟล์ชั่วคราวจะถูกแปลงเป็นไฟล์หลัก
เมื่อคุณรันโค้ดข้างต้น คุณจะได้ผลลัพธ์ต่อไปนี้:
Output:
เรากำลังอัปโหลดไฟล์โดยใช้ตัวเลือกปุ่มเลือกไฟล์ และปุ่มอัปโหลดไฟล์จะอัปโหลดไฟล์ไปยังเซิร์ฟเวอร์ตามเส้นทางที่ระบุไว้
ตัวอย่าง: การใช้การดำเนินการ JSP
ในตัวอย่างนี้ เราจะอัปโหลดไฟล์โดยใช้การทำงานของ JSP เราจะใช้ฟอร์มที่มีปุ่ม "อัปโหลด" และเมื่อคุณคลิกที่ปุ่มอัปโหลด ไฟล์จะถูกอัปโหลด
กำลังอัพโหลด_1.jsp
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <!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=ISO-8859-1"> <title>Guru Uploading File</title> </head> <body> File: <br /> <form action="guru_upload" method="post" enctype="multipart/form-data"> <input type="file" name="guru_file" size="50" /> <br /> <input type="submit" value="Upload" /> </form> </body> </html>
คำอธิบายของรหัส:
Code บรรทัดที่ 11-12: ในที่นี้เรากำลังใช้ฟอร์มที่มีแอ็กชันบนเซิร์ฟเล็ต guru_upload ซึ่งจะส่งข้อมูลผ่านเมธอด POST นอกจากนี้ คุณสมบัติ enctype ยังระบุวิธีการเข้ารหัสและส่งข้อมูลฟอร์มไปยังเซิร์ฟเวอร์ ซึ่งใช้เฉพาะกับเมธอด POST เท่านั้น ในที่นี้เราตั้งค่าเป็น multipart/form-data ซึ่งใช้สำหรับไฟล์ (เนื่องจากข้อมูลจะมีขนาดใหญ่)
Code 13 แนว: ในที่นี้ เรากำหนดองค์ประกอบ guru_file โดยระบุประเภทเป็นไฟล์และกำหนดขนาดเป็น 50
Code 15 แนว: นี่คือปุ่มส่งข้อมูลที่มีชื่อว่า “อัปโหลด” ซึ่งจะเรียกใช้เซิร์ฟเล็ตประมวลผลคำขอ และไฟล์จะถูกอ่านและเขียนลงในเซิร์ฟเล็ตนั้น
Guru_upload.java
package demotest; import java.io.File; import java.io.IOException; 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 guru_upload extends HttpServlet { private static final long serialVersionUID = 1L; public guru_upload() { super(); // TODO Auto-generated constructor stub } protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { if(ServletFileUpload.isMultipartContent(request)){ try { List <FileItem> multiparts = new ServletFileUpload(new DiskFileItemFactory()).parseRequest(request); for(FileItem item : multiparts){ if(!item.isFormField()){ String name = new File(item.getName()).getName(); item.write( new File("c:/guru/upload" + File.separator + name)); } } //File uploaded successfully request.setAttribute("gurumessage", "File Uploaded Successfully"); } catch (Exception ex) { request.setAttribute("gurumessage", "File Upload Failed due to " + ex); } }else{ request.setAttribute("gurumessage","No File found"); } request.getRequestDispatcher("/result.jsp").forward(request, response); } }
คำอธิบายของรหัส:
Code บรรทัดที่ 12-14: ในส่วนนี้ เราจะต้องนำเข้าไลบรารี org.apache.commons เข้าไปในการตั้งค่าโค้ด และเราจะต้องนำเข้าคลาส fileupload จากไลบรารี org.apache.commons ด้วย
Code 23 แนว: ต่อไปนี้คือเมธอด doPost() ซึ่งจะถูกเรียกใช้เมื่อเราส่งเมธอด POST ใน JSP โดยเมธอดนี้จะรับอ็อบเจ็กต์ request และ response เป็นพารามิเตอร์
Code 26 แนว: ในที่นี้เรากำลังสร้างอ็อบเจ็กต์ของคลาส ServletFileUpload จากแพ็กเกจ fileUpload ของไลบรารี org.apache.commons ซึ่งจะตรวจสอบว่ามีอ็อบเจ็กต์ไฟล์ใด ๆ ใน JSP หรือไม่ หากพบ อ็อบเจ็กต์ไฟล์เหล่านั้นจะถูกดึงมาจากคำขอ
Code บรรทัดที่ 27-32: เราจะวนลูปตรวจสอบจำนวนไฟล์โดยการตรวจสอบจำนวนรายการไฟล์ที่มีอยู่ในอ็อบเจ็กต์ multiparts ซึ่งเป็นอ็อบเจ็กต์รายการ (ถ้าเราอัปโหลดไฟล์มากกว่าหนึ่งไฟล์) และบันทึกไฟล์นั้นลงในโฟลเดอร์ c:/guru/upload โดยใช้ชื่อไฟล์ที่กำหนดไว้ เราจะเขียนไฟล์โดยใช้วิธี write ของอ็อบเจ็กต์ไฟล์ลงในโฟลเดอร์ที่กล่าวถึง
Code 34 แนว: หากไม่มีข้อยกเว้นใดๆ เราจะกำหนดแอตทริบิวต์ในคำขอเป็น gurumessage โดยมีค่าเป็น “อัปโหลดไฟล์สำเร็จแล้ว”
Code บรรทัดที่ 35-36: หากเกิดข้อผิดพลาด เราจะแสดงข้อความว่า “การอัปโหลดไฟล์ล้มเหลว”
Code 40 แนว: หากไม่พบไฟล์ ระบบจะแสดงข้อความว่า “ไม่พบไฟล์”
Code 42 แนว: ส่งต่อคำขอโดยใช้ object requestdispatcher ไปยัง result.jsp พร้อมด้วย object request และ response
ผลลัพธ์.jsp
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <!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=ISO-8859-1"> <title>Guru Result</title> </head> <body> <% String msg = (String)request.getAttribute("message"); out.println(msg); %> </body> </html>
คำอธิบายของรหัส:
Code 10 แนว: ในที่นี้ เรากำลังดึงแอตทริบิวต์จากอ็อบเจ็กต์คำขอที่มีค่าเป็น gurumessage มาเก็บไว้ในอ็อบเจ็กต์สตริง
Code 11 แนว: ที่นี่เรากำลังพิมพ์ข้อความนั้น
เมื่อเรารันโค้ดข้างต้น เราจะได้ผลลัพธ์ดังต่อไปนี้:
Output:
เราจะได้รับแบบฟอร์มที่มีช่องให้เลือกไฟล์จากไดเร็กทอรี เมื่อเลือกไฟล์แล้ว เราต้องคลิกที่ปุ่มอัปโหลด
เมื่อคลิกปุ่มอัปโหลดแล้ว เราจะได้รับข้อความว่าไฟล์ถูกอัปโหลดสำเร็จแล้ว
จากแผนภาพด้านล่าง เราจะเห็นว่าไฟล์ได้ถูกอัปโหลดไปยังโฟลเดอร์ c:/guru/upload แล้ว
ดาวน์โหลดไฟล์ JSP
ในตัวอย่างนี้ เราจะดาวน์โหลดไฟล์จากไดเร็กทอรีโดยคลิกที่ปุ่ม
กำลังดาวน์โหลด_1.jsp
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <!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=ISO-8859-1"> <title>Downloading Guru Example</title> </head> <body> Guru Downloading File<a href="guru_download">Download here!!!</a> </body> </html>
คำอธิบายของรหัส:
Code 10 แนว: ในที่นี้เราได้ให้ลิงก์สำหรับดาวน์โหลดไฟล์จากโฟลเดอร์ c:/guru/upload โดยใช้เซิร์ฟเล็ต guru_download
Guru_download.java
package demotest; import java.io.FileInputStream; import java.io.IOException; import java.io.PrintWriter; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; /** * Servlet implementation class guru_download */ public class guru_download extends HttpServlet { private static final long serialVersionUID = 1L; protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html"); PrintWriter out = response.getWriter(); String gurufile = "test.txt"; String gurupath = "c:/guru/upload/"; response.setContentType("APPLICATION/OCTET-STREAM"); response.setHeader("Content-Disposition", "attachment; filename=\"" + gurufile + "\""); FileInputStream fileInputStream = new FileInputStream(gurupath + gurufile); int i; while ((i = fileInputStream.read()) != -1) { out.write(i); } fileInputStream.close(); out.close(); } /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response) */ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub } }
คำอธิบายของรหัส:
Code บรรทัดที่ 3-5: ในที่นี้เรากำลังนำเข้า FileInputStream, IOException และ PrintWriter จากแพ็กเกจ java.io
Code 15 แนว: เรากำลังกำหนด guru_download เซิร์ฟเล็ต ซึ่งขยาย HttpServlet
Code 18 แนว: เนื่องจากเราได้กำหนด href ไว้แล้ว ซึ่งจะถูกล้อมรอบด้วย URLดังนั้น เมธอด GET จะถูกประมวลผล (เมธอด doGet จะถูกเรียกในเซิร์ฟเล็ต) ซึ่งรวมถึงอ็อบเจ็กต์คำขอและคำตอบด้วย
Code บรรทัดที่ 19-20: เรากำลังกำหนดประเภทเนื้อหาในอ็อบเจ็กต์การตอบกลับ และดึงอ็อบเจ็กต์ผู้เขียนจากคำตอบนั้นด้วย
Code บรรทัดที่ 21-22: กำหนดตัวแปรชื่อ gurufile โดยมีค่าเป็น test.txt และกำหนด gurupath เป็น c:/guru/upload/
Code บรรทัดที่ 23-25: เรากำหนดประเภทเนื้อหาโดยใช้ object response และใช้เมธอด setHeader ซึ่งจะกำหนดส่วนหัวลงใน object response โดยใช้ชื่อไฟล์ที่อัปโหลดมา
Code บรรทัดที่ 27-28: เรากำลังสร้าง FileInputStream ซึ่งเราจะเพิ่ม gurupath+gurufile เข้าไป
Code บรรทัดที่ 31-33: ที่นี่เราได้นำเอา ในขณะที่วนซ้ำ ซึ่งจะทำงานไปเรื่อยๆ จนกว่าจะอ่านไฟล์เสร็จ ดังนั้นเราจึงกำหนดเงื่อนไขเป็น != -1 ในเงื่อนไขนี้ เรากำลังเขียนข้อมูลโดยใช้ object printwriter out
เมื่อคุณรันโค้ดข้างต้น คุณจะได้รับผลลัพธ์ดังต่อไปนี้:
Output:
เราต้องคลิกที่ไฟล์ downloading_1.jsp แล้วเราจะได้รับไฮเปอร์ลิงก์ที่มีข้อความว่า “ดาวน์โหลดที่นี่” เมื่อคุณคลิกที่ไฮเปอร์ลิงก์นี้ ไฟล์จะถูกดาวน์โหลดเข้าสู่ระบบ






