บล็อกนี้แนะนำปัญหาที่คุณพบโดยย่อเมื่ออัปโหลดและดาวน์โหลดรูปภาพภายใต้ Spring Boot ก่อนอื่นคุณต้องสร้างโครงการสปริงบูต
1. รหัสคอนโทรลเลอร์หลัก
แพ็คเกจ com.qwrt.station.websocket.controller; นำเข้า com.alibaba.fastjson.jsonobject; นำเข้า com.qwrt.station.common.util.jsonutil; นำเข้า org.slf4j.logger; นำเข้า org.slf4j.loggerfactory; นำเข้า org.springframework.beans.factory.annotation.value; นำเข้า org.springframework.web.bind.annotation.requestmapping; นำเข้า org.springframework.web.bind.annotation.requestmethod; นำเข้า org.springframework.web.bind.annotation.requestparam; นำเข้า org.springframework.web.bind.annotation.restcontroller; นำเข้า org.springframework.web.multipart.multipartfile; นำเข้า Javax.servlet.http.httpservletRequest; นำเข้า Javax.servlet.http.httpservletResponse; นำเข้า Java.io.*; /*** สร้างโดย Jack เมื่อ 2017/10/30 */ @RestController @RequestMapping ("v1/ uploaddownload") คลาสสาธารณะอัปโหลด DownloadController {ส่วนตัว Logger Logger สุดท้ายคงที่ = loggerFactory.getLogger @value ("$ {uploaddir}") สตริงส่วนตัว uploaddir; @RequestMapping (value = "/uploadImage", method = requestMethod.post) สาธารณะ jsonObject uploadimage (@requestparam (value = "ไฟล์") ไฟล์ multipartFile) โยน runtimeException {ถ้า (file.isempty ()) } // รับชื่อสตริงชื่อไฟล์ชื่อ filename = file.getoriginalfilename (); logger.info ("ชื่อไฟล์ที่อัปโหลดคือ:" + ชื่อไฟล์); // รับไฟล์ suffixName = filename.substring (filename.lastindexof (".")); logger.info ("SuffixName ที่อัปโหลดคือ:" + SuffixName); // พา ธ หลังจากไฟล์อัพโหลดสตริง FilePath = UploadDir; // แก้ปัญหาจีนเส้นทางจีนภายใต้ liunx ปัญหาการแสดงภาพ // filename = uuid.randomuuid () + affixName; ไฟล์ dest = ไฟล์ใหม่ (filePath + ชื่อไฟล์); // ตรวจพบว่าไดเรกทอรีมีอยู่ถ้า (! dest.getParentFile (). มีอยู่ ()) {dest.getParentFile (). mkdirs (); } ลอง {file.transferto (dest); logger.info ("เส้นทางไฟล์หลังจากการอัปโหลดไม่ใช่:" + filepath + ชื่อไฟล์); return jsonutil.getsuccessjsonobject (ชื่อไฟล์); } catch (unlueLstateException e) {e.printStackTrace (); } catch (ioexception e) {e.printstacktrace (); } return jsonutil.getfailjsonObject ("การอัปโหลดไฟล์ล้มเหลว"); } // ไฟล์ดาวน์โหลดรหัสที่เกี่ยวข้อง @RequestMapping (value = "/downloadImage", method = requestMethod.get) การดาวน์โหลดสตริงสาธารณะ (สตริง imageName, httpservletRequest คำขอ httpservletResponse) {// string filename = "123.jpg"; logger.debug ("imagename คือ:"+imagename); String fileUrl = uploaddir+imageName; if (fileUrl! = null) {// ปัจจุบันไฟล์ได้มาจาก web-inf // file // ของโครงการ (ไดเรกทอรีนี้สามารถกำหนดค่าได้ในบรรทัดของรหัสต่อไปนี้) และดาวน์โหลดไปยัง C: // ผู้ใช้ // ดาวน์โหลดซึ่งเป็นไดเรกทอรีดาวน์โหลดเริ่มต้นของเครื่อง/////// ชื่อไฟล์);*/ ไฟล์ไฟล์ = ไฟล์ใหม่ (fileUrl); if (file.exists ()) {response.setContentType ("แอปพลิเคชัน/force-download"); // ตั้งค่าการดาวน์โหลดที่บังคับให้ไม่เปิดการตอบสนอง. Addheader ("เนื้อหา-การจัดสรร", "สิ่งที่แนบมา; filename =" + imageName); FileInputStream FIS = NULL; bufferedInputStream bis = null; ลอง {fis = new FileInputStream (ไฟล์); bis = ใหม่ bufferedInputStream (FIs); OutputStream OS = Response.GetOutputStream (); int i = bis.read (บัฟเฟอร์); ในขณะที่ (i! = -1) {os.write (บัฟเฟอร์, 0, i); i = bis.read (บัฟเฟอร์); } system.out.println ("ความสำเร็จ"); } catch (exception e) {e.printstacktrace (); } ในที่สุด {ถ้า (bis! = null) {ลอง {bis.close (); } catch (ioexception e) {e.printstacktrace (); }} ถ้า (fis! = null) {ลอง {fis.close (); } catch (ioexception e) {e.printstacktrace (); }}}}} return null; -มีสองวิธีในรหัสข้างต้น วิธีการข้างต้นคือวิธีการอัปโหลดรูปภาพและวิธีการต่อไปนี้คือวิธีการดาวน์โหลดรูปภาพ ในการดาวน์โหลดภาพคุณต้องส่งชื่อไฟล์ของภาพ ทดสอบบน iOS, โทรศัพท์ Android, Google Chrome และไม่มีปัญหาในการอัปโหลดและดาวน์โหลด
2. รหัสหลักของ HTML ที่ทดสอบมีดังนี้อัปโหลดและดาวน์โหลดรูปภาพ:
<! doctype html> <html> <head> <meta charset = "utf-8"/> <title> การแชท WebSocket </title> </head> <body> <body> <dlable> อินพุต: </label> <อินพุต id = "id"/> <br/> <button id = "btn" id = "disconnection"> disconnection < /button> <br /> <br /> <form enctype = "multipart /form-data" id = "uploadform"> <input type = "file" name = "uploadfile" id = "upload_file" upload1 onClick = "uploadImage ()"> </form> <!-<อินพุต type = "ไฟล์" onChange = "uploadimGtest ();" id = "uploadimg" name = "uploadimg"/> <button id = "uploadimage" onclick = "uploadimage ();"> อัปโหลด </button>-> </div> <div id = "test"> </div> <hr color = "blanchedalmond" <img src = "http://192.168.9.123:8860/v1/uploaddownload/downloadimage?imagename=123.jpg"/> </div> th: src = "@{stomp.min.js}"> </script>-> <script src = "js/sockjs.min.js"> </script> <script> var webSocketurl = "WS: //192.168.9.123: 8860/WebSocketServer"; var websocket; if ('webSocket' ในหน้าต่าง) {// webSocket = ใหม่ webSocket ("ws: //" + document.location.host + "/websocketServer"); // webSocket = ใหม่ webSocket ("WS: //192.168.9.123: 9092/WebSocketServer"); // webSocket = ใหม่ webSocket ("ws: // localhost: 8860/websocketServer"); WebSocket = ใหม่ WebSocket (WebSocketUrl); } อื่นถ้า ('mozwebsocket' ในหน้าต่าง) {webSocket = ใหม่ mozwebsocket ("ws: //" + document.location.host + "/websocketServer"); } else {webSocket = sockjs ใหม่ ("http: //" + document.location.host + "/sockjs/websocketServer"); } websocket.onopen = ฟังก์ชั่น (evnt) {console.log ("onopen ----", evnt.data); - websocket.onMessage = function (evnt) {//$("#test").html("(<font color = 'red'> " + evnt.data +" </font>) "); console.log ("onmessage ----", evnt.data); //$("#test").html(evnt.data); $ ("#test"). ผนวก ('<div>' + event.data + '</div>'); - websocket.onerror = function (evnt) {console.log ("onerror ----", evnt.data); } webSocket.onclose = function (evnt) {console.log ("onclose ----", evnt.data); } $ ('#btn'). on ('คลิก', function () {ถ้า (websocket.readystate == websocket.open) {var msg = $ ('#id'). val (); // การคำนวณวิธีการ handletextMessage พื้นหลัง); $ ('#disconnection'). on ('คลิก', function () {ถ้า (websocket.readystate == websocket.open) {websocket.close (); //websocket.onclose (); console.log ("ปิดการเชื่อมต่อ websocket สำเร็จ");}}); $ ('#connection'). on ('คลิก', function () {ถ้า (websocket.readystate == websocket.closed) {websocket.open (); //websocket.onclose (); console.log ("เปิดการเชื่อมต่อ websocket สำเร็จ");}}); // ฟังเหตุการณ์ปิดหน้าต่าง เมื่อปิดหน้าต่างให้ปิดการเชื่อมต่อ WebSocket อย่างแข็งขันเพื่อป้องกันไม่ให้หน้าต่างปิดก่อนที่การเชื่อมต่อจะถูกตัดการเชื่อมต่อและฝั่งเซิร์ฟเวอร์จะทำการยกเว้น window.onbeforeunload = function () {websocket.close (); } function uploadimgtest () {} function uploadimage () {// var uploadurl = "http: // localhost: 8860/v1/uploaddownload/uploadimage"; var uploadurl = "http://192.168.9.123:8860/v1/uploaddownload/uploadimage"; var downloadurl = "http://192.168.9.123:8860/v1/uploaddownload/downloadimage" var pic = $ ('#upload_file') [0] .files [0]; var fd = new FormData (); //fd.append('uploadfile ', pic); fd.append ('ไฟล์', pic); $ .ajax ({url: uploadurl, type: "post", // ข้อมูลฟอร์มข้อมูล: fd, แคช: false, contentType: false, processData: false, ความสำเร็จ: ฟังก์ชั่น (data) {console.log ("ข้อมูลคือ: {}", data); = $ ("<img />") img.attr ("src", downurl+"? imagename ="+data.data); } </script> </html>รหัสข้างต้นบางส่วนไม่มีส่วนเกี่ยวข้องกับการอัปโหลดและดาวน์โหลดรูปภาพ ลบออกด้วยตัวเองตามต้องการและดูรหัสหลักสำหรับการอัปโหลดและดาวน์โหลดรูปภาพ คุณต้องแนะนำ jQuery
3. การกำหนดค่าคุณสมบัติการบูตสปริง:
1. แก้ปัญหาการอัปโหลดภาพใหญ่เกินไป:
ฤดูใบไม้ผลิ: HTTP: Multipart: Max-File-Size: 100MB #File การอัปโหลดขนาดสูงสุด-ขนาด: 200MB #MaxImum ขนาดคำขอ
นี่คือสปริงบูตเวอร์ชันใหม่เพื่อแก้ปัญหาการอัปโหลดรูปภาพหรือไฟล์ที่ใหญ่เกินไป นี่ไม่ใช่วิธีที่เจ้านายแก้ไขได้ คุณสามารถตรวจสอบข้อมูลด้วยตัวเอง
2. ตำแหน่งที่อัปโหลดและบันทึกไฟล์กำหนดค่า:
#uploaddir: f:/mystudy/pic/
ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้ ฉันหวังว่ามันจะเป็นประโยชน์ต่อการเรียนรู้ของทุกคนและฉันหวังว่าทุกคนจะสนับสนุน wulin.com มากขึ้น
สวัสดิการเทศกาลโคมไฟ: