- 締切済み
Javascriptでファイルを読み込むには
ブラウザで開いたHTML上で動くJavascriptでローカルドライブ上の多数のファイルの内容を読みたいと思います。どのような方法が考えられますか。また、その中でお薦めはどれですか。 Windows10を考えていますが、できればWindows7でも可能な方法だと有り難いです。インターネット上のサービスの利用は考えず、LAN内で完結するようにします。パス・ファイル名については既知のものだけなので調べる必要はありません。 当面必要ないのですが、 ・読み取りのみでファイル名の取得も必要な場合 ・書き込みが必要な場合 それぞれについても回答がいただけるならぜひお願いします。
- みんなの回答 (3)
- 専門家の回答
みんなの回答
- superside0
- ベストアンサー率64% (461/711)
セキュリティーの観点から、ブラウザ上で実行されるJavaScriptからは ローカルの任意のファイルを自由にアクセスすることはできません。 そんなことができてしまうと、個人の書類や写真やメール送受信データなどの 個人情報を簡単に盗み出すことができてしまいますので。 ただし、HTML5のFile APIで、利用者が指定したファイルに限定して ローカルのファイルにアクセスすることが可能です。 (多数のファイルを一括でドラッグ&ドロップで指定することもできます) 多数のファイルというのが、パスが固定であるなら 利用者にそのパスの全ファイルを一括でドラッグ&ドロップしてもらって、 JavaScript側で必要なファイルのみ読むようにプログラムする方法もあろうかと。 (ご参考) https://www.html5rocks.com/ja/tutorials/file/dndfiles// もしくは、 ・ローカルのファイルを 利用の都度 zip等でまとめてもらって サーバーにアップロードしてもらうとか ・LAN内ならば、サーバー側からクライアント機のファイルが読めるように Windowsのファイル共有をしてもらうとか ・該当のファイルは、ローカルに保存しないでリモート保存する運用にするとか 等 して、JavaScriptでなくサーバー側のプログラムで読んで 結果を、HTMLに埋めるか、JavaScritのAjaxで戻すとかって形になるかと。
- asciiz
- ベストアンサー率70% (6803/9674)
JavaScriptには基本的に、ファイル入出力機能がありません。 ローカルでWebサーバ(httpサービス)を稼働させれば、URLにてファイルを参照することは可能です。(でもWeb公開ディレクトリ以下のみ) そしてCGIの助けを借りて、任意の内容を書き込み権限のあるディレクトリに任意のファイル名で保存する、なんてサービスを作ることも可能です。 …ですがHTML5より FileSystem API というものが用意されました。 これを用いて、JavaScriptから直接ローカルボリュームに対するファイルの読み書きが可能になります。 >FileSystem API について知る - HTML5 Rocks >https://www.html5rocks.com/ja/tutorials/file/filesystem// 「FileSystem API」で検索すると他にもいろんな解説やサンプルが出てくると思うので見てみてください。 ただ、「ローカルストレージ」っていう言葉が、HDDやSSD等の話ではなく、ブラウザ内部のデータ保存域のことを指していることがあります(そちらの仕組みの方が早く出来たので)。 JavaScriptはブラウザ上で動く言語であるため、そっちの話が混じってくることもあります。解説を検索・読みこむ際には気にかけておきましょう。
お礼
回答ありがとうございます。調べてみます。
- ballville
- ベストアンサー率47% (233/487)
LAN内にhttpサーバを建てて、ブラウザでアクセスすると、 結局Web上のHTMLと見なされてローカルドライブにアクセスすることはできません。 fileタグでユーザに指定させる方法も、ファイルがあまりに多数になると非現実的でしょう。 LAN内にHTML、JS、CSSなどを置いておき、ブラウザからfile://プロトコルでアクセスさせるのが手っ取り早いと思います。 Windows限定のようなので、いっそのこと、htmlでなくhtaにしてしまうのも手です。HTAのショートカットをユーザのデスクトップに置いておけば、ダブルクリック一発で起動できます。
お礼
回答ありがとうございます。調べてみます。
お礼
回答ありがとうございます。調べてみます。
補足
本当は検証結果を載せてアドバイスをもらいたかったのですが、質問の締め切りまでに時間がとれる見込みがないため補足欄ですが全ての回答に対しまとめてお礼をして締め切らせていただきます。ありがとうございました。 当初Same origin policy回避の為、Firefoxの昔のバージョンを使う・Chrome系ブラウザで--allow-file-access-from-filesオプションを使うなどを考えていましたが常用のブラウザと同時に運用できるようセットアップするのがやや面倒ということで尻込みしていました。いろいろな方法を知ることができ助かりました。以前ダウンロードしたsHTTPdがあるので、それ経由で取得する方法から試してみようと思います。