問題タブ [fileapi]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
6242 参照

javascript - HTML5 File APIは、ファイルが存在するかどうかを簡単にチェックします

一時ファイルAPIストア(HTML5)を持っていますが、ファイルが存在するかどうかを確認できません。それをチェックする簡単な方法はありますか?実際にファイルを読んで調べる必要がありますか?

周りを検索しても具体的なものは何もありません

同期チェックがいいでしょうこれは可能ですか?

0 投票する
2 に答える
3516 参照

html - Google Chrome で HTML5 ファイル API を使用しようとすると FileError が発生する

Chrome でファイル システム API を使用してファイルを作成しようとしていました。最初に、次のように PERSISTENT ストレージを試しました

最初は問題なく動作していました。しかし、同じコードを試してみると、次のエラーが表示されます

次に、次のようにTEMPORARYファイルストレージを試しました

これにより、セキュリティ エラーを意味するコード 2 の FileError が返されます。誰でもこれらの問題について私を助けてもらえますか?

0 投票する
3 に答える
4869 参照

html - 詳細は webkitStorageInfo.queryUsageAndQuota() から取得できます

webkitStorageInfo.queryUsageAndQuota() は、HTML5 ファイル システム API を使用して、ファイル システムに保存されているファイルの使用統計を調べるために使用されます。この関数に提供されるコールバックで取得できる詳細を教えてください。

0 投票する
1 に答える
1290 参照

jquery - jQueryUI Sortable + HTML5 ファイル API の例?

jQueryUI:Sortable:display-grid を HTML5 ファイル API と組み合わせて、複数のローカル画像を同時にブラウザーにドロップし、それらすべてを表示グリッドに表示する良い例を知っている人はいますか?

参照:
http://jqueryui.com/demos/sortable/#display-grid
http://html5demos.com/file-api
ユーザーが HTML5 ファイル API を使用してボタンを押したときにローカル ファイルを読み取るにはどうすればよいですか?

0 投票する
2 に答える
543 参照

javascript - jQuery/HTML5 FileAPI:ドラッグイベントがトリガーされていないように見えるのはなぜですか?

imageContainer div にファイルをドラッグしても何も起こらないのはなぜですか? コンソールには何も表示されず、ページにも何も表示されません。

0 投票する
1 に答える
691 参照

jquery - jquery-html5-アップロードの問題(ボタンクリック時にファイルをアップロード)

このプラグインを使用してボタンクリックでファイルをアップロードする適切な方法を取得できません。

https://github.com/mihaild/jquery-html5-upload

ドキュメントには次のように書かれています。

オプション

イベント

プラグインで使用される「change」を除くすべてのイベントには、プレフィックス「html5_upload。」が付いています。

プラグインが使用するイベント

このイベントマニュアルのハンドラーを設定することはお勧めしません。

開始選択したファイルのアップロードを開始

cancelOne現在アップロード中のファイルのアップロードをキャンセルします

cancelAll現在のアップロードをキャンセルします

destroyプラグイン作業の痕跡を削除します

https://github.com/mihaild/jquery-html5-upload#options

そんなことができるようになりたいです。

ありがとうございました。

0 投票する
1 に答える
460 参照

javascript - ユーザーがファイルを変更しても、FileAPI がファイル サイズを更新しない (Webkit 以外のブラウザー)

最初に例を挙げて問題を説明すると思いますが、

jsfiddle: http://jsfiddle.net/e2UfM/15/ (FF 12 および Chrome 18.0.1025.168 でテスト済み)

使用法:

  • ローカル マシンからテキスト ファイルを読み込みます。
  • 「ファイルの読み込み」を押します。
  • 「ファイルサイズを表示」を押します-サイズに注意してください。
  • テキスト ファイルを変更して、ローカル マシンに保存します。
  • 「ファイルサイズを表示」をもう一度押します。Webkit ブラウザー (Chrome) ではファイル サイズがどのように変化するかに注意してください。ただし、Firefox ではファイル サイズが更新されませんでした。

Webkit 以外のブラウザーは、ユーザーが選択したローカル ファイルに変更を加えたときにサイズ属性を更新しませんが、たとえば Chrome は更新します。どちらのブラウザもファイルの内容を更新します。

この状況でChromeが行うのと同様に、Firefoxにファイルサイズを更新させる方法はありますか?


簡単な現実世界の例:

ユーザーがフォームには大きすぎるファイルを選択し、送信ボタンを押すと、ファイルが大きすぎるという通知を受け取ります (アラート、「サイズ」バー (以下を参照) などを介して)

彼らはファイルをローカルで変更し、もう一度送信を押します。

Chrome では、ファイル サイズが更新されます。ユーザーが送信ボタンをもう一度押すと、更新されたサイズがもう一度検証され、アップロードが許可されます。Firefox では、ファイル サイズが変更される前に、ユーザーはフォーム上でファイルを再選択する必要があります。

Firefox の部分的な回避策 - @ZER0 の回答


実際の例 (詳細):

ファイル API の目的の 1 つは、サーバーにアップロードする前にクライアント側でファイル サイズを確認することです。

フォームに 2MB のアップロード制限があり、ユーザーが 1MB のファイルを選択するシナリオを考えてみましょう。Firefox と Chrome の両方で、ファイル サイズが 2MB 未満であることを確認し、フォームに追加します。また、選択したファイルのサイズと、ファイル サイズの制限を満たしているかどうかを示すきちんとしたバーがあるとします。

ユーザーが選択した 1MB のファイルです。

しかし、ユーザーは、フォームを送信する前にそのファイルの内容をローカルで少し変更し、サイズを 2MB を超えることにしました。

Google Chrome では、クライアント側でこれを適切に処理できます。ユーザーがフォームを送信したときにファイル サイズを再度確認し、サーバーに送信する前に実際に 1 MB 未満であることを確認できます。しかし、Chrome では、ユーザーがフォームを送信する前であっても、小さなバーの画像を動的に更新して、ローカルで変更を加えることができます。

現在、ファイルは 2MB を超えています。

この「バー」(またはアラートなどの即時通知のその他のフォーム) は、ユーザーが大きなフォームに入力する場合に役立ちます。フォームを送信するときだけでなく、ファイルが大きすぎるときにすぐにユーザーに知らせて、そのときに修正できるようにしたいと思います。

Firefox ではファイルサイズが更新されないため、2MB のファイルを 1MB のままだと思って喜んでアップロードします。サーバー側のロジックを使用してファイル サイズを再確認しますが、サーバーへのトリップを節約したいと考えています。


バグに遭遇した方法:

上記の例は、ファイル API でスライス機能を使用するのではなく、おそらくフォームでファイルをアップロードする方が多いため、より多くの人に関連するように配置されています。これは、私が問題に直面している具体的な方法です。

私のフォームでは、ユーザーがファイルを選択し、送信を押すと、最後の 10,000 バイトのみが画面に表示され、textareaそれが本当に必要なファイルであることを確認します。

50,000サイズがバイトのファイルを考えてみましょう。ユーザーがフォームでそれを選択すると、Chrome と Firefox の両方でバイトが に表示40,000 - 50,000されますtextarea

ここで、ユーザーはファイルにいくつかのコンテンツを追加し、同じファイルを70,000バイトにバンプします!

Google Chrome はtextarea、 bytes を含むように を適切に更新します60,000-70,000。Firefox では、サイズが一定のままであるため、範囲内のバイトのみが表示されます40,000-50,000


編集: jsfiddle を更新して、FF が更新されたファイルの内容を引き続き読み取ることができることを示しました。ファイルサイズがそれらの新しいコンテンツで変わらないというだけです。

編集: https://bugzilla.mozilla.org/show_bug.cgi?id=756503 (バグレポート)

編集: @Eduárd Moldován のコメントと @ZER0 の回答に応じて、例が追加および更新されました。ありがとう!

0 投票する
1 に答える
163 参照

html - HTML5 - ファイルがアクセス可能であることを検出する方法

私のアプリでは、HTML5 ファイル API を使用してサーバーにファイルをアップロードしていますが、別のプロセスで使用されているためにファイルにアクセスできない状況に遭遇しています。これにより、実際には、firefox と chrome で 2 つの異なるエラー状態が発生します。html5 を使用してファイルにアクセスできないかどうかを検出する方法はありますか?

0 投票する
1 に答える
2973 参照

javascript - javascriptまたはJqueryを使用してIEブラウザのファイルサイズを取得するには?

IE ブラウザに ActiveXObject を使用しましたが、機能しません。js で他のブラウザのファイル サイズを取得しましたが、IE ブラウザのファイル サイズを取得できません。これには次のコードを使用しました:-

IEブラウザのファイルサイズを取得するのを手伝ってくれる人はいますか? 私はすべてのアイデアを検討しましたが、IE ブラウザーのファイルサイズを取得できませんでした。これのアイデアまたはコードを提供してください...

0 投票する
3 に答える
37612 参照

javascript - IE 8/9 での FormData のフォールバック

FormDataは IE 8/9 には存在しませんが、それらのブラウザーでその機能が必要です。これに対する素晴らしいフォールバックはありますか?

json データを送信しようとしますが、ファイルをサーバーに渡す必要があります。このファイルをformData最新のブラウザに追加して、XHRリクエストを送信するだけです。FormDataIE 8/9 には存在しないため、これは明らかに失敗します。

おそらく代替手段は、jsで偽のフォームオブジェクトを作成し、それにデータを追加することですか?