nodejs จัดการการอัปโหลดไฟล์
ใน Express4, req.files undefined ; คนที่ใช้มากที่สุดในตอนนี้อาจ formidable คุณรู้ว่ามันมีเหตุการณ์ progress ดังนั้นคุณจึงมีความสุขมาก แถบความคืบหน้าของ IE รุ่นล่างเป็นโอกาส โอเคลองดู:
แบบฟอร์ม. on ('ข้อผิดพลาด', ฟังก์ชั่น (err) {console.log (err);}) .on ('ยกเลิก', function () {console.log ('ยกเลิก');}) .on ('ความคืบหน้า', ฟังก์ชั่น n = parseint (parsefloat (bytesreceived/bytesexpected) .tofixed (2)*100);ใช่คุณดีใจที่เห็นว่าคอนโซลพิมพ์ค่าสตริงของค่าความคืบหน้าตามที่คาดไว้ จากนั้นไปไกลกว่า;
แบบฟอร์ม. on ('ความคืบหน้า', ฟังก์ชั่น (bytesreceived, bytesexpected) {var n = parseint (parsefloat (bytesreceived/bytesexpected) .tofixed (2)*100); res.write ('<script> วิธี call คือการแสดงค่าความคืบหน้าในหน้า; น่าเสียดายที่คุณสามารถเห็นได้เพียง 100%สุดท้ายเท่านั้นและคุณไม่สามารถเห็นค่าความคืบหน้าโดยละเอียดที่อัปโหลดโดยละเอียด สำรวจอีกครั้ง ...
ถัดไปให้เปลี่ยนความคิดลองบันทึกค่าความคืบหน้าไปยัง session และเพิ่มคำขอเพิ่มเติมเพื่อสำรวจค่าความคืบหน้า โอ้มันไม่เลว! เพื่อให้แน่ใจว่าค่าความคืบหน้าที่คุณร้องขอคือค่าความคืบหน้าที่คุณอัปโหลดในครั้งนี้แทนที่จะเป็นค่าความคืบหน้าของการอัปโหลดอื่น ๆ คุณต้องตกลงค่า token ในคำขอที่อัปโหลดและในคำขอเพิ่มเติม ตอนนี้คำถามอื่นคือวิธีรับ token นี้เมื่อร้องขอ เนื่องจากการร้องขอของการอัปโหลดไฟล์อยู่ใน Request Payload req.body จึงไม่สามารถรับค่าที่นำมาใช้และฉันไม่ต้องการแยกกลุ่มนี้แน่นอนว่าฉันไม่สามารถแยกวิเคราะห์ได้เช่นกัน เป็นการดีที่สุดที่จะใส่ไว้ใน url ปัญหาคือบางครั้งคุณต้องรีเฟรชสองครั้งเพื่อรีเฟรช token ซึ่งไม่ดี! เป็นทางเลือกสุดท้ายฉันจะใส่มันไว้ใน cookie !
var cookies = function () {var cks = req.headers.cookie.split (';'), obj = {}; สำหรับ (var i = 0; i <cks.length; i ++) {obj [cks [i] .split ('=') [0]. แทนที่ (// s+/ig, '')] = Unsescape (cks [i] .split ('=') [1]); } return obj; - var queryToken = คุกกี้. __ token__; แบบฟอร์ม. on ('ความคืบหน้า', ฟังก์ชั่น (bytesreceived, bytesexpected) {var n = parseint (parsefloat (form.bytesreceived/form.bytesexpected) .tofixed (2)*100); if (req.session req.session ['file'+queryToken] = {โทเค็น: queryToken, เปอร์เซ็นต์: n}};สำหรับ IE789 ฉันมาสำรวจความคิดเห็นของค่าความคืบหน้า ฉันยกโทษให้ฉัน แต่หัวใจของฉันเจ็บ
var getData = function () {$ .post ('/uploader', {getFileInfo: 1, uploadtoken: utils.cookie.getCookie ('__ token__')}). จากนั้น (data) {console.log (data); การโทร (pros.percent); } getData (); วิธี call คือการแสดงค่าความคืบหน้าในหน้า; น่าเสียดายที่คุณสามารถเห็นได้เพียง 100%สุดท้ายเท่านั้นและคุณไม่สามารถเห็นค่าความคืบหน้าโดยละเอียดที่อัปโหลดโดยละเอียด สำรวจอีกครั้ง ...
โอเคฉันตกลงไปอีกครั้ง แต่ฉันก็ยังรู้สึกว่ามีบางอย่างผิดปกติไม่มีปัญหากับการสำรวจอาแจ็กซ์ ปัญหาคือ session จะต้องรอจนกว่าการอัปโหลดจะเสร็จสมบูรณ์ก่อนที่จะมีค่าดังนั้นฉันจะเห็นได้เพียง 100%เท่านั้นและฉันไม่เห็นค่าความคืบหน้าโดยละเอียด ฉันคิดได้ไหมว่ากำลังดำเนินการ res.write ก่อนหน้านี้และ req.session นี้ถูกระงับ แต่จะบันทึกผลลัพธ์ของการดำเนินการแต่ละครั้งจนกว่า progress จะถูกปล่อยออกมาดังนั้นฉันจึงเห็นได้ 100%เท่านั้น ฉันไม่ได้อยู่ในอารมณ์ที่จะอ่านซอร์สโค้ด formidable แน่นอนว่าฉันไม่เข้าใจดังนั้นฉันจึงคิดอย่างแรก!
เนื่องจากการเลือกตั้ง ajax นั้นใช้ได้จึงไม่ใช่เรื่องง่ายที่จะบันทึกลงใน session ถ้ามันไม่ได้ผลให้ลองใช้ใน global มันจะไม่สามารถสิ่งที่มีค่าลงในวัตถุระดับโลกและมันจะแขวนไว้ หากมีการเปลี่ยนแปลงเล็กน้อยมันจะถูกนำไปสู่ global :
แบบฟอร์ม. on ('ความคืบหน้า', ฟังก์ชั่น (bytesreceived, bytesexpected) {var n = parseint (parsefloat (form.bytesreceived/form.bytesexpected) .tofixed (2)*100); ถ้า (global ['ไฟล์' global ['file'+queryToken] = {โทเค็น: queryToken, เปอร์เซ็นต์: n}};สำรวจต่อไป
สวยนั่นคือทั้งหมด! สิ่งที่ฉันเห็นใน Chrome นั้นเหมือนกับความคืบหน้าของ HTML5 แต่มันจะรู้สึกติดอยู่เล็กน้อยใน IE789 แต่คุณยังสามารถเห็นค่าความคืบหน้าโดยละเอียด ท้ายที่สุดเบราว์เซอร์เก่าไม่ดีคุณก็รู้ และทุกครั้งที่คุณอัปโหลดคุณจะนำคุณค่าไปสู่ global ดังนั้นคุณต้องทำความสะอาดอย่างเหมาะสม หลังจากอัปโหลดไฟล์แล้วคุณสามารถถ่ายโอนไปยังไดเรกทอรีที่ระบุ global['file'+queryToken]=null ;
อย่างไรก็ตามการเลือกตั้งหมายถึงการร้องขอหลายอย่างต่อหลังจากที่อื่นและอาจมีปัญหาที่นี่; หากคุณไม่ จำกัด ค่าความคืบหน้าจะถูกร้องขอทุกครั้ง 500ms แถบความคืบหน้าของ IE789 ได้รับการแก้ไขเช่นนี้และตกลงที่จะทิ้งแฟลช แม้ว่าการสำรวจนี้จะเข้ากันได้กับเบราว์เซอร์ทั้งหมด แต่ก็ยังคงเป็นคำขอจำนวนมาก มาตัดสินกันดีกว่า HTML5 นอก IE789!
ที่จริงถ้าคุณวัดมันมีค่ามากกว่าที่คุ้มค่ากว่าหนึ่งเดียวกับการอัปโหลดแฟลชหนึ่งครั้งหรือคำขอพิเศษ? ยกโทษให้ฉันที่ไม่เข้าใจแฟลชฉันจะไม่พูดอะไรมาก อย่างไรก็ตามฉันไม่ต้องการเพิ่มไฟล์พิเศษในหน้า
สรุป
ยังมีรายละเอียดมากมายเกี่ยวกับส่วนประกอบอัปโหลดไฟล์ ตอนแรกฉันต้องการสร้างไฟล์ JS แต่ต่อมาฉันคิดว่าเพื่อให้สามารถนำกลับมาใช้ใหม่ได้มากขึ้นมันจะดีกว่าถ้าจะทำเป็นหน้าอิสระ หากคุณต้องการอัปโหลดเพียงแค่ iframe มันซึ่งดีกว่าการสร้างไฟล์ JS อย่างแน่นอน ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้ ฉันหวังว่ามันจะช่วยคุณในการเรียนหรือที่ทำงานของคุณ หากคุณมีคำถามใด ๆ คุณสามารถฝากข้อความไว้เพื่อสื่อสาร