เบื้องต้นเกี่ยวกับ plupload
Plupload ได้รับการพัฒนาโดยนักพัฒนาของ Tinymce โดยให้ปลั๊กอินอัปโหลดที่มีให้บริการสูงสำหรับระบบการจัดการเนื้อหาของคุณหรือโปรแกรมการอัปโหลดที่คล้ายกัน ขณะนี้ Plupload แบ่งออกเป็นส่วนประกอบ API หลักและองค์ประกอบคิวอัพโหลด jQuery ซึ่งช่วยให้คุณใช้โดยตรงหรือปรับแต่งด้วยตัวเอง
1. ผลการแสดงผล
รวมรายการอัปโหลดไฟล์และรายการอัปโหลดไฟล์
2. บทนำ
เพื่อให้สั้น SpringMVC MyBatis Maven Maven MySQL ใช้เพื่อตระหนักถึงฟังก์ชั่นการอัปโหลดแบบหลายไฟล์และการดาวน์โหลดใช้รูปแบบของสตรีม
ฉันจะเปิดบล็อกอื่นเพื่อแนะนำหน้าเว็บที่เกี่ยวข้อง
3. เตรียมวัสดุ
การโหลด
งานศิลปะ
นอกจากนี้ยังมีไฟล์ JS ที่เริ่มต้นปลั๊กอิน
สามารถดาวน์โหลดได้โดยตรงจากการเชื่อมต่อการแชร์ของฉัน
ลิงค์: http://pan.baidu.com/s/1c27ctak รหัสผ่าน: btqj
นอกจากนี้ยังมีการดาวน์โหลด jQuery
4. รหัสแผนกต้อนรับส่วนหน้า
แนะนำไฟล์ Styles and JS
<link rel = "stylesheet" href = "ทรัพยากร/css/plupload.css" type = "text/css"> <script src = "ทรัพยากร/js/jQuery.min.js"> </script> <script src = "ทรัพยากร/อัปโหลด/plupload.min.js src = "ทรัพยากร/artdialog4.1.7/artdialog.source.js? skin = blue"> </script> <script src = "resources/js/upload.js"> </script>
รหัส JS
_plupload (binded uuid, เส้นทางอัปโหลดไฟล์); ①เกี่ยวกับ uuid ที่ถูกผูกไว้ให้ฉันยกตัวอย่าง ID ของผู้ใช้ปัจจุบันคือ UUID คุณสามารถเชื่อมโยงรหัสผู้ใช้กับไฟล์ที่คุณอัปโหลด หากคุณสอบถามในอนาคตคุณสามารถสืบค้นไฟล์ทั้งหมดที่อัปโหลดโดยรหัสผู้ใช้ตามรหัสผู้ใช้ ②วิธีนี้ถูกห่อหุ้มและสามารถเห็นได้ใน upload.js ความคิดเห็นในบทความของฉันชัดเจนมากและคุณยังสามารถอ้างถึงเอกสารอย่างเป็นทางการ
$ (function () {3 $ ('#updoadbtn') คลิก (ฟังก์ชั่น () {popupdialog ();}); _plupload ('test', '$ {pageContext.request.contextpath}/uploadfile');});รหัสหน้าปุ่มปุ่มป๊อปอัพ
<a id = "uploadbtn" href = "#"> การอัปโหลดไฟล์ </a> <!-ทริกเกอร์กล่องป๊อปอัพ-> <div id = "uploadContent" style = "แสดง: ไม่มีความสูง: 300px; overflow-x: hidden; overflow-y: auto;"> <div id = "idefile" href = "JavaScript: void (0);"> เลือกไฟล์ </a> </div> <div id = "uploadfilequeue" style = "border: 1px solid #a7c5e2; ความสูง: 228px; width: 350px;"> </div>
5. รหัสพื้นหลัง
ฉันไม่มีวิธีการห่อหุ้มมันดังนั้นฉันจึงสามารถห่อหุ้มด้วยตัวเองเพื่อที่จะเห็นมันอย่างชัดเจน
/ ** * ที่อยู่อัพโหลดไฟล์ * * @param Request * @param Response */ @requestmapping ("uploadfile") การอัปโหลดโมฆะสาธารณะ (คำขอ httpservletRequest, httpservletResponse การตอบสนอง) (commonsmultipartfile) multipartrequest.getFile ("file"); // รับสตริงไฟล์ unid = uuid.randomuuid (). toString (). แทนที่ ("-", "");/* ไฟล์หลัก*/ สตริงต้นฉบับ string.valueof (file.getSize ());/* ขนาดไฟล์*/ path String = null;/* พา ธ การจัดเก็บไฟล์*/ String punid = request.getParameter ("Punid"); / * ไฟล์ที่เกี่ยวข้อง punid * // // บันทึกไฟล์ถ้า (ไฟล์! = null) {ลอง {string basepath = request.getSession (). getServletContext (). getRealPath ("/uploadfile"); SimpledateFormat SDF = ใหม่ SimpleDateFormat ("/yyyy/mm/dd/"); String subpath = sdf.format (วันที่ใหม่ ()); path = basepath + subpath + unid + file.Sparator + OriginalFilEname; // หากโฟลเดอร์ไม่มีอยู่ให้สร้างไฟล์โฟลเดอร์ dir = ไฟล์ใหม่ (พา ธ ); if (! dir.exists ()) {dir.mkdir (); } file.transferto (dir); } catch (exception e) {e.printstacktrace (); }} // การแปลงขนาดไฟล์ยาว kb = 1024; MB ยาว = kb * 1024; ยาว gb = mb * 1024; ขนาดยาว = long.parselong (fliesize); if (size> = gb) {fliesize = string.format ("%. 1f gb", (ลอย) ขนาด / gb); } อื่นถ้า (ขนาด> = mb) {float f = (ลอย) ขนาด / mb; fliesize = string.format (f> 100? "%.0f mb": "%.1f mb", f); } อื่นถ้า (ขนาด> = kb) {float f = (ลอย) ขนาด / kb; fliesize = string.format (f> 100? "%.0f kb": "%.1f kb", f); } else {fliesize = string.format ("%d b", ขนาด); } // จัดเก็บข้อมูลไฟล์ลงในฐานข้อมูล fileupload fileupload = new fileupload (); fileupload.setUnid (unid); fileupload.setoriginalfilename (OriginalFilename); fileupload.setfliesize (fliesize); fileupload.setpath (พา ธ ); fileupload.setpunid (Punid); SimpledateFormat df = new SimpledateFormat ("YYYY-MM-DD HH: MM: SS"); fileupload.setflietime (df.format (วันที่ใหม่ ())); fileuploadservice.insert (fileupload); -นี่คือวิธีการดาวน์โหลดซึ่งคือการใช้สตรีมไฟล์เพื่อดาวน์โหลดตามรหัสไฟล์
@RequestMapping ("ดาวน์โหลดไฟล์") โมฆะสาธารณะดาวน์โหลดโหลดไฟล์ (คำขอ httpservletRequest, การตอบกลับ httpservletResponse) {string unid = request.getParameter ("UNID"); fileupload fileupload = fileuploadservice.selectbyprimarykey (unid); if (fileupload! = null) {ลอง {string filename = สตริงใหม่ (fileupload.getoriginalfilename (). getBytes ("gbk"), "iso-8859-1"); String path = fileupload.getPath (); Response.Setcharacterencoding ("UTF-8"); Response.SetContentType ("แอปพลิเคชัน/octet-stream"); Response.SetheAder ("เนื้อหา-การจัดสรร", "สิ่งที่แนบมา; ชื่อไฟล์ =" + ชื่อไฟล์); Response.Setheader ("ความยาวเนื้อหา", fileupload.getFliesize ()); inputStream inputStream = new FileInputStream (ไฟล์ใหม่ (พา ธ )); OutputStream OS = Response.GetOutputStream (); ไบต์ [] b = ไบต์ใหม่ [2048]; ความยาว int; ในขณะที่ ((length = inputstream.read (b))> 0) {os.write (b, 0, ความยาว); } os.close (); inputstream.close (); } catch (filenotfoundException e) {e.printStackTrace (); } catch (ioexception e) {e.printstacktrace (); -นอกจากนี้ยังมีวิธีการลบ
/ ** * การลบไฟล์ * * @param Request * @param Response */ @ResponseBody @RequestMapping ("delfile") แผนที่สาธารณะ <สตริง, วัตถุ> defile (httpservletRequest Request, httpservletResponse) fileupload fileupload = fileuploadservice.selectbyprimarykey (unid); // ลบธงบูลีนท้องถิ่น = เท็จ; ไฟล์ไฟล์ = ไฟล์ใหม่ (fileupload.getPath ()); if (file.exists ()) {// ถ้าพา ธ เป็นไฟล์และไม่ว่างเปล่าลบธง = file.delete (); } // ลบฐานข้อมูล int result = fileUploadService.deleteByPrimaryKey (UNID); if (ผลลัพธ์> 0) {flag = true; } แผนที่ <string, Object> map = new hashmap <string, object> (); map.put ("ผลลัพธ์", ธง); แผนที่กลับ; -ด้านบนเป็น artdialog+plupload แนะนำให้คุณรู้จักโดยบรรณาธิการ ฉันหวังว่ามันจะเป็นประโยชน์กับคุณ หากคุณมีคำถามใด ๆ โปรดฝากข้อความถึงฉันและบรรณาธิการจะตอบกลับคุณทันเวลา ขอบคุณมากสำหรับการสนับสนุนเว็บไซต์ Wulin.com!