HTML filepicker multi - รับไฟล์ที่ใช้งานอยู่

ปัญหาต่อไปนี้เกิดขึ้นโดยใช้ Firefox v73 บน Window 7:

ในรหัสของฉันฉันใช้ตัวเลือกหลายไฟล์ใน html เพื่ออัปโหลดได้ถึง 100 ไฟล์แนว:

<input type="file" id="files" name="files" multiple>

ไฟล์จะถูกส่งไปยัง REST-API ซึ่งดำเนินการในภายหลัง เมื่อฉันเลือกไฟล์เดียว (ใน file-explorer) ซึ่งใช้งานอยู่ในปัจจุบันฉันได้รับข้อความแสดงข้อผิดพลาด (อาจเป็นหน้าต่าง) ซึ่งบอกฉันว่าไฟล์ไม่สามารถเลือกได้เพราะมันใช้งานอยู่ หากฉันพยายามเลือกไฟล์หลายไฟล์ซึ่งมีไฟล์ที่ใช้งานอย่างน้อยหนึ่งไฟล์ฉันไม่มีข้อผิดพลาดเกิดขึ้น แต่การอัปโหลดดูเหมือนว่าจะหยุดเมื่อถึงการใช้ไฟล์ถึงและรอให้ไฟล์นั้นเปิดตัว สิ่งนี้นำไปสู่การร้องขอเพื่อรอการหมดเวลา (ซึ่งเป็น 1 นาทีในกรณีของฉัน)

มีตัวเลือกในการตรวจจับปัญหา (ในการใช้ไฟล์) ก่อนที่จะพยายามอัปโหลดไฟล์หรือไม่

PS: ฉันได้ลองทำเช่นเดียวกันใน Chrome แล้วจะส่งคืนข้อผิดพลาดก่อนที่จะส่งคำขอไปยัง REST-API

ฟังดูเหมือนปัญหาของระบบปฏิบัติการ
มีบางอย่างกำลังล็อคไฟล์ของคุณจากการเข้าถึงและจำเป็นต้องแก้ไขในด้านของคุณ

ฉันสงสัยว่ามันจะเป็นปัญหาทั่วไปและค่อนข้างยากในการสร้างโซลูชันโดยไม่สามารถพบปัญหาเดียวกัน แต่สิ่งหนึ่งที่คุณลองได้คืออ่านไฟล์ของคุณก่อนส่ง สามารถทำได้ค่อนข้างสะดวกด้วยBlob.prototype.arrayBufferวิธีการซึ่งสามารถเติมได้

เพื่อหลีกเลี่ยง I / O จำนวนมากคุณสามารถลองอ่านได้เพียงส่วนเล็ก ๆ ด้วยBlob.prototype.slice() วิธีการ

const input = document.getElementById('inp');
const btn = document.getElementById('btn');

btn.onclick = async(evt) => {
  testAllFilesAvailability(input.files)
    .then(() => console.log('all good'))
    .catch(() => console.log('some are unavailable'));
}

function testAllFilesAvailability(files) {
  return Promise.all(
    [...files].map(file =>
      file.slice(0, Math.min(file.size, 4)) // don't load the whole file
      .arrayBuffer() // Blob.prototype.arrayBuffer may require a polyfill
    )
  );
}

<pre>
1. Select some files from the input
2. Change one of this files name on your hard-drive or even delete it
3. Press the button
</pre>

<input type="file" multiple id="inp">
<button id="btn">Test Availability</button>

ในการเลือกหลายไฟล์ทำไมคุณไม่ใช้ https://github.com/blueimp/jQuery-File-Upload