Q&A
回答ありがとうございます。
FileAPIを今勉強していて、これを使って画像のサムネイルを表示することができました。
1つお聞きしたいのですが、
JavaScriptから勝手なファイルを読み出す方法はありません。とはどういうことでしょうか？
ローカルフォルダの画像は勝手なファイルに当たるのでしょうか？
FileAPIを利用して画像のサムネイルを表示するのは非推奨なのでしょうか？
現在HTML,Javascript（ｊQuery）を使って画像アップロードアプリを作っています。
<input type="file">を使って画像をローカルフォルダから取得し、
その画像を画面に表示したいと思っています。
JavaScriptやjQueryを使ってやるのかなと思って調べているのですが、
そのやり方になかなか行き着きません。
もしわかる方や参考サイトでもいいので知っていらっしゃる方がいらっしゃいましたら教えていただけるとありがたいです。
回答5件
0
https://blueimp.github.io/jQuery-File-Upload/
にあるデモを研究しみては如何でしょう？
このデモでは、ファイルを選択すると、縮小画像が表示されます。
投稿2016/04/23 06:37
総合スコア22328
0
<input type="file">でユーザーが選んだ画像については、JavaScriptのFile APIを使って読み出すことができます（実装例）。
セキュリティ上、（通常のWebページの場合）JavaScriptから勝手なファイルを読み出す方法はありません。
投稿2016/04/23 04:35
総合スコア146571
0
基本的に、画像などのコンテンツはサーバーに一度アップロードしてから、そのURLを返してもらって始めて表示が可能になります。
http://qiita.com/BRS_matsuoka/items/ba79a2f500a10ddc0923
File APIを使うとローカル(ブラウザを起動しているPC)のファイルシステムにアクセスできるらしいですが、セキュリティー的にまずいのでブラウザによっては対応していなかったり、特別な設定をしないと有効にならないため一般的ではありません。
http://ascii.jp/elem/000/000/559/559105/
投稿2016/04/22 23:48
総合スコア1939
0
ベストアンサー
WEBサイトの場合、画像を表示するということは
『サーバーにあるファイルを表示する』ことになるので
<input type="file">で画像を表示する場合、以下のような
処理が必要になるとおもいます。
１．ブラウザ側で<input type="file">で画像を指定する
２．ブラウザ側で画像をアップロードする
３．サーバ側で画像を受信する
４．ブラウザ側で画像を表示する
という流れになります。
以下のサイトが参考になると思います。
http://hakuhin.jp/js/upload.html#UPLOAD_01
http://service.cresco.co.jp/blog/entry/710
投稿2016/04/22 21:47
総合スコア1249
回答ありがとうございます！
ファイルアップロードの基本的な考え方を知ることができました。
ちなみになのですが、2つ目のリンクにFileAPIを利用してサムネイルを表示する方法が載っているのですが、これも非推奨なのでしょうか？
私がやりたいのはまさにこれなのでhtmlとjsだけでできるこのやり方は魅力的なのですが。
0
画像ファイルをjson化して、受け渡しすれば出来るんじゃないですか？
それかajaxで受け渡し。
投稿2016/04/23 11:55
総合スコア335
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/04/24 12:21