HTML 파일 선택기 멀티-사용중인 파일 가져 오기


12

Window 7에서 Firefox v73을 사용하면 다음 문제가 발생했습니다.

내 코드에서 html의 다중 파일 선택기를 사용하여 최대 100 개의 파일을 병렬로 업로드합니다.

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

파일은 나중에 처리하는 REST-API로 전송됩니다. 현재 사용중인 단일 파일 (파일 탐색기에서)을 선택하면 파일이 사용 중이므로 선택할 수 없다는 오류 메시지 (아마도 창에 의해)가 표시됩니다. 사용중인 하나 이상의 파일이 포함 된 여러 파일을 선택하려고하면 오류가 발생하지 않지만 사용중인 파일에 도달하고 파일이 릴리스 될 때까지 업로드가 중지 된 것으로 보입니다. 이로 인해 타임 아웃 대기 요청이 발생합니다 (제 경우에는 1 분).

파일을 업로드하기 전에 문제 (사용중인 파일)를 포착 할 수있는 옵션이 있습니까?

추신 : Chrome에서 동일하게 시도했으며 REST-API에 요청을 보내기 전에 오류를 반환합니다.


아약스 전화를 보여줄 수 있습니까?
이슬람 Elshobokshy

답변:


3

그것은 OS 문제처럼 들립니다.
무엇인가가 파일에 액세스하지 못하도록 막고 있으며 이것은 수정이 필요합니다.

일반적인 문제가 될지 의심 스럽지만 동일한 문제가 발생하지 않고 솔루션을 구축하는 것은 매우 어렵지만 파일을 보내기 전에 파일 을 읽는 것이 좋습니다 . 이것은 Blob.prototype.arrayBufferpolyfilled 할 수있는 방법으로 매우 편리하게 수행 할 수 있습니다.

많은 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>


솔루션에 대한 감사 Kaiido. +50 평판이 있습니다. 생명의 은인!
Kevin H.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.