HTMLファイルピッカーマルチ-使用中のファイルを取得


12

Window 7でFirefox v73を使用すると、次の問題が発生しました。

私のコードでは、html内のマルチファイルピッカーを使用して、最大100ファイルの視差をアップロードします。

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

ファイルはREST-APIに送信され、後で処理されます。現在使用中の(ファイルエクスプローラーで)単一のファイルを選択すると、使用中のファイルを選択できないというエラーメッセージ(おそらくウィンドウ別)が表示されます。使用中の1つ以上のファイルを含む複数のファイルを選択しようとすると、エラーは発生しませんが、使用中のファイルに到達してファイルが解放されるのを待機すると、アップロードが停止したように見えます。これにより、タイムアウト(私の場合は1分)を待つように要求されます。

ファイルをアップロードする前に、(使用中のファイルで)問題を検出するオプションはありますか?

PS:同じことをChromeで試しましたが、REST-APIにリクエストを送信する前にエラーが返されます。


あなたのajax呼び出しを示すことができますか?
イスラムElshobokshy

回答:


3

OSの問題のようです。
何かがファイルへのアクセスをロックしているため、修正が必要です。

これが一般的な問題になることはないと思います。同じ問題を経験することなくソリューションを構築することは非常に困難ですが、試す前に、ファイルを送信する前にファイルを読むことをお勧めします。これは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>


解決のために海道に感謝します。+50の評判があります。命の恩人!
ケビンH.

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.