問題タブ [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.
javascript - Gecko/WebKit での複数アップロード: アップロード前にリストからの削除を許可
要素で許可されている新しい multiple="multiple" 属性を使用しようとしています。これまでのところ、これは最近の Gecko および WebKit ブラウザーでサポートされています。私は Firefox 3.6 と Chrome 5.0 でテストしています。
問題なく使用でき、ファイルのリストを表示できます(これをガイダンスとして使用しました)。ただし、かなり苛立たしいことに、ユーザーがファイルを追加した後、このリストからファイルを削除することはできないようです。唯一の方法は、[参照...] ボタンをクリックして新しいファイル セットを選択することです。
これは<input>
、仕様に記載されているように、要素によって提供される FileList オブジェクトが読み取り専用であるためです (リンクできません - W3C の Web サイトで FileAPI TR を参照してください)。
もちろん、「削除された」アイテムのリストを保持し、とにかくすべてをアップロードしてから「削除された」アイテムを無視するなどの回避策があります。これは少し汚れており、多くのファイルが「削除」されると、アップロードが容認できないほど遅くなる可能性があります。
誰かが他の回避策を知っていますか、またはこれに対処するためのより良いアイデアを持っていますか? 目的は、「複数」属性を使用できるようにし、ユーザーがアップロード前にリストからファイルを削除できるようにすることです。
html - 最新のブラウザーでサムネイルのクライアント側を生成するにはどうすればよいですか?
FileAPIで使用するサムネイルを生成するエレガントな方法を探しています。現在、画像を表すDataURLを取得しています。問題は、画像が非常に大きい場合、移動して再レンダリングするよりも CPU を集中的に使用することです。これを回避するには、2 つのオプションがあります。
- クライアントでサムネイルを生成する
- サーバーでサムネイルを生成し、サムネイルをクライアント (AJAX) に送り返します。
HTML5
私たちはcanvas
要素を持っていますか?写真からサムネイルを生成するためにそれを使用する方法を知っている人はいますか? 完璧である必要はありません。サンプリングの品質は許容範囲です。jQuery
私のためにこれを行うプラグインはありますか?大きな画像のクライアント側での使用を高速化する他の方法はありますか?
私は を使用してHTML5
おり、Firefox 3.6+
: 以外のものをサポートする必要はありFirefox 3.6+
ません。IE 6.0
javascript - IE9 Developer Preview (ビルド 4、v1.9.7.9.16.6000) はファイル API をサポートしていますか?
最新の IE9 Developer Preview (Build 4、v1.9.7.9.16.6000) はファイル API をサポートしていますか? 私が参照しているファイル API は次のとおりです。http://www.w3.org/TR/file-upload/
Caniuse.comはサポートが不明であると述べており、Wikipediaはサポートされていないと述べていますが、それが参照している Trident のバージョンを特定していません。
残念ながら、現時点では、Vista または 7 を搭載した Windows マシンでテストすることはできません..
javascript - ファイル API: スライス メソッドをサポートするブラウザーは?
slice
メソッドの現在のサポートは何ですか?
javascript - Javascript FileAPI:ディレクトリを反復しますか?
Firefox 3.6では、(ドラッグアンドドロップAPIを使用して)ディレクトリをいくつかの要素にドロップし、FileAPIを使用してそれらのファイルを処理できます。それはディレクトリでどのように機能しますか?
Mac OS X Finderは、いくつかのディレクトリをファイル(.app、.tmbundle、.abbu、…)として表示します。ほとんどの場合、これは素晴らしいことです。File-APIおよびDND-APIを介してブラウザと対話する場合は、そうではありません。エンドユーザーは、実際のファイルとmy-addressbook-backup.abbuのような種類のファイルを区別できません。
したがって、JavascriptUIはディレクトリ構造を識別できる必要があります。構造をトラバースできない場合は、それに応じてユーザーに通知する必要があります。
どちらをどのように達成できるかについてのアイデアはありますか?
編集:
JSがディレクトリをトラバースできるようにするときに発生する(潜在的な)問題を確認できます。私はディレクトリトラバーサル自体を要求していません(ただし、できることをバインドすることはできません)。私はFoo.appがファイルとして扱われている(Finder.appを通してユーザーに見られるように)が、実際にはディレクトリである(Terminal.appで見たときに見られるように)ことについて話している。
File APIは現在、トラバースメカニズムを提供していません。したがって、addressbook-dump.abbu内のより深いネストされたファイルにはアクセスできません。これを可能にすることについて何か考えはありますか?
それ以外の場合は、OSXユーザーにアドレスブックファイルのアーカイブ(ZIPなど)を作成し、そのzipを「アップロード」するように指示する必要があります(実際にはJSで読み取ることができます)。これは回避策ですが、解決策ではありません。
javascript - ファイル API: ファイル参照 (オブジェクト) またはファイル コンテンツ全体 (文字列) を返しますか?
plupload (plupload.html5.js) には、次のコードが表示されます。
そして、そのブロブが文字列になることができるのだろうか? ソースからわかるように、ブロブ変数には、ユーザーが選択したファイルへのファイル参照が含まれている必要があります (含まれている必要があると思います)。したがって、次のように表現されます。
コメントから、ファイルへの参照ではなく、ファイルの内容全体を返す可能性があることがわかります。どうして?
わからないことがありますか?
html - Google Chrome Base64 メソッドはファイル API からのバイナリ データを処理できますか?
Base64 に btoa と atob を使用していますが、バイナリ データでは atob メソッドが機能しません。ただのテキスト。どうすればこれを解決できますか?
msg.bit.file.data は base64 でエンコードされたファイルです。
javascript - Chrome 8でファイルを書くことはできますか?
Chromeで公開されている新しいFileAPI(現時点ではクロスブラウザーのサポートには関係ありません)を使用すると、ファイル入力を介して開いたファイルに書き戻すことができるのではないかと思います。
私が達成しようとしていることの例をここで見ることができます:http ://www.grehz.com/ide 。
サーバーサイドスクリプトを使用してファイルを動的に作成し、ユーザーがファイルを通常どおりにダウンロードできるようにすることができます。この純粋なクライアント側を実現する方法があることを願っています。ファイル入力で開いたファイルに書き込めるところを読んだことがあります。FileWriterクラスへの参照を渡すのを見たことがありますが、この例を見つけることができませんでした。
しかし、これが不可能であったとしても、私はまったく驚かないでしょう(これにはセキュリティ上の問題があるようです)。ガイダンスやリソースを探しているだけです。
アップデート:
私はここで読んでいました:http://dev.w3.org/2009/dap/file-system/file-writer.html
Chromeで遊んでいたので、FileSaverとFileWriterは実装されていないようですが、BlobBuilderは実装されています。BBオブジェクトでgetBlob()を呼び出すことができますが、FileSaverまたはFileWriterなしでそれを保存する方法はありますか?
UPDATE2:
この問題はChromiumプロジェクトで見つかりました:http ://code.google.com/p/chromium/issues/detail?id = 65615&q = FileSaver&colspec = ID%20Stars%20Pri%20Area%20Feature%20Type%20Status%20Summary%20Modified %20Owner%20Mstone%20OS
したがって、まだどのバージョンにも実装されていないことは明らかです(ただし、FileWriterについては言及されていません-FileWriterはFileSaverに依存していると思いますが)。
それから離れて、私はサーバー側のソリューションを検討しています。ユーザーが[保存]をクリックすると、テキストエリアのコンテンツがスクリプトに投稿され、スクリプトがページに書き込み、プレーンテキストまたはユーザーがダウンロードするのに適したmimeタイプとして返送されます。他に何か提案はありますか?このソリューションは「名前を付けて保存」には適していますが、汎用の保存ボタンとしては少し扱いにくいです。
html - HTML5 ファイル API - 可用性と機能
私は File API についていくつか読んだところですが、ほとんどすべての主要なブラウザーがいつそれをサポートするのか、またはすでにサポートしているのか疑問に思っています。
Firefox 3.6 以降 Chrome 8.0 以降
? オペラ、IE ?
これは、plupload や sfwupload などのフラッシュ ベースのアップローダの後継/代替となるものですか? この場合の長所と短所は何ですか?
入力ストリームが FileReader によって読み取られるときに、ファイルシステムからのネイティブ ファイル ロードと同じ一貫性を持つように、ブロブ (バイト ストリーム) / ファイルを確実に処理できますか? エンコーディングの問題などを意味します。
ユーザーがファイルを送信した後、javascript で制限なく自由に使用できますか? たとえば、ファイルを変数に保存し、後で XHR 経由で送信しますか?
仕様書はすべて読みましたが、経験のある方の意見を聞きたいです。複雑なユーザー インターフェイスを実装しようとしていますが、ファイル API を使用すると、サーバー側で行う作業が大幅に少なくなります...
しかし、それを使用する必要があるかどうかはわかりません。オペラ、IE ?