[解決済み] 様々なブラウザで、クライアント側のjavascriptでファイルの内容を読み取る。
質問
ブラウザを通してクライアントマシン上のファイルの内容を読み取るための、スクリプトのみのソリューションを提供しようとしています。
私は、Firefox と Internet Explorer で動作するソリューションを持っています。 きれいなものではありませんが、現時点ではいろいろと試しているに過ぎません。
function getFileContents() {
var fileForUpload = document.forms[0].fileForUpload;
var fileName = fileForUpload.value;
if (fileForUpload.files) {
var fileContents = fileForUpload.files.item(0).getAsBinary();
document.forms[0].fileContents.innerHTML = fileContents;
} else {
// try the IE method
var fileContents = ieReadFile(fileName);
document.forms[0].fileContents.innerHTML = fileContents;
}
}
function ieReadFile(filename)
{
try
{
var fso = new ActiveXObject("Scripting.FileSystemObject");
var fh = fso.OpenTextFile(filename, 1);
var contents = fh.ReadAll();
fh.Close();
return contents;
}
catch (Exception)
{
return "Cannot open file :(";
}
}
を呼び出すことができます。
getFileContents()
を呼び出すと、その内容を
fileContents
のテキストエリアに書き込まれます。
他のブラウザでこれを行う方法はありますか?
今のところSafariとChromeが一番気になりますが、他のブラウザでの提案もお待ちしています。
編集する。 という質問に対して、"なぜそうしたいのか?
基本的に、私はファイルの内容をクライアント側でワンタイムパスワードと一緒にハッシュ化し、この情報を検証として送り返すことができるようにしたいのです。
どのように解決するのですか?
File APIに関する情報を追加するために編集しました。
最初にこの回答を書いてから
ファイル API
が標準として提案され
はほとんどのブラウザで実装されています。
(のサポートが追加された IE 10 の時点では)。
FileReader
API が追加されましたが、まだ
File
API)です。この API は古い Mozilla API よりも少し複雑で、ファイルの非同期読み取り、バイナリファイルのより良いサポート、異なるテキストエンコーディングのデコードをサポートするように設計されています。そこには
Mozilla Developer Network でいくつかのドキュメントが利用可能です。
にもドキュメントがありますし、オンラインでも様々な例があります。以下のように使用します。
var file = document.getElementById("fileForUpload").files[0];
if (file) {
var reader = new FileReader();
reader.readAsText(file, "UTF-8");
reader.onload = function (evt) {
document.getElementById("fileContents").innerHTML = evt.target.result;
}
reader.onerror = function (evt) {
document.getElementById("fileContents").innerHTML = "error reading file";
}
}
オリジナルの回答
WebKit(したがって、SafariとChrome)でこれを行う方法はないようです。唯一のキーは
ファイル
オブジェクトが持つ唯一のキーは
fileName
と
fileSize
. によると
コミットメッセージ
によると、File と FileList のサポートは以下のものに触発されています。
Mozilla の File オブジェクト
に触発されたものですが、機能のサブセットのみをサポートしているように見えます。
もしこれを変更したいのであれば、いつでも パッチを送る を WebKit プロジェクトへ送ることができます。もうひとつの可能性は、Mozilla API を提案して HTML 5 に含めることを提案することです。 WHATWG メーリングリストは、おそらくそれを行うのに最も適した場所です。そうすれば、少なくとも数年後には、これを行うためのクロスブラウザの方法が存在する可能性が高くなります。もちろん、HTML 5 に含めるためのパッチまたは提案を提出することは、そのアイデアを守るための作業を意味しますが、Firefox がすでにそれを実装しているという事実は、そこから始めるための何かを与えてくれます。
関連
-
Vueのイベント処理とイベントモディファイアの解説
-
JSクリックイベント - Uncaught TypeError: プロパティ 'onclick' に null を設定できません。
-
[解決済み] JavaScriptで "use strict "は何をするのか、その根拠は?
-
[解決済み] あるJavaScriptファイルを他のJavaScriptファイルにインクルードするにはどうすればよいですか?
-
[解決済み] JavaScriptでオブジェクトをディープクローンする最も効率的な方法は何ですか?
-
[解決済み] とは何ですか! (not not)演算子とは何ですか?
-
[解決済み] JavaScriptで現在のURLを取得する?
-
[解決済み] JavaScriptで現在の日付を取得するには?
-
[解決済み] ファイルの内容からJavaの文字列を作成するにはどうすればよいですか?
-
[解決済み】JavaScript版sleep()とは?)
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
JavaScriptの関数この指摘の問題を説明
-
vue for 登録ページ効果 vue for sms 認証コードログイン
-
Javascript Bootstrapのグリッドシステム、ナビゲーションバー、ローテーションの説明
-
vueのプロジェクトでモックを使用する方法を知っていますか?
-
Vueのイベント処理とイベントモディファイアの解説
-
[解決済み】SyntaxError: JSONの位置1に予期しないトークンoがある。
-
[解決済み】「X-Frame-Options」を「SAMEORIGIN」に設定したため、フレームでの表示を拒否された。
-
[解決済み】TypeErrorの解決方法。未定義またはヌルをオブジェクトに変換できない
-
[解決済み】ReactJSでエラー発生 Uncaught TypeError: Super expression は null か関数でなければならず、undefined ではありません。
-
[解決済み】「.addEventListener is not a function」なぜこのエラーが発生するのか?