質問: ### 前提・実現したいこと Ruby on Railsでアプリを作成しています。 teratailの質問する際の入力補助ボタンのように、フォームにマークダウンを入力する際に 画像を挿入する機能を実装したいと思っています。 通常の画像アップロードの方法(Form_forでfile_fieldを使う方法)はRailsチュートリアルやいろいろな サイトでやり方を見かけるのですが、taratailのような画像のファイルパスを取得して、 更新時に画像も一緒にアップロードするようなやり方は見たことがないです。 僕の想定では、このような動作をしているのかなと思っています。 1. ピクチャーボタンを押す。 2. ファイル選択画面が起動し、ユーザーがファイルを選択する。 3. 選択されたファイルを一旦キャッシュ?ローカルに保存し、そのファイル名をinputフィールドに文字列として挿入。 4. Submitボタンが押された時に、ローカルに保存されていた画像の情報がサーバーに保存される。 この上記の手順の3、4のあたりの処理をどのように書けばいいかが分からない状態です。 もし上記のやり方あるいはヒント、あるいは便利なgemなどご存知の方がいらっしゃいましたら教えていただけますでしょうか。よろしくお願いします。 ### ピクチャーボタンを押すと挿入されるこの機能です。 ![この機能を実装したいです。](https://teratail-v2.storage.googleapis.com/uploads/contributed_images/e14a83d9dc541eae78249c92035cc19e.jpeg) ### 補足情報(言語/FW/ツール等のバージョンなど) ruby 2.3.0 rails 4.2.4
回答: 初めまして これは予想でしかありませんが、 質問者様がおっしゃっている手順の3.4が違うかもしれません 1.ピクチャーボタンを押す。 2.ファイル選択画面が起動し、ユーザーがファイルを選択する。 3.選択されたファイルを一旦キャッシュ?ローカルに保存し、そのファイル名をinputフィールドに文字列として挿入。 4.Submitボタンが押された時に、ローカルに保存されていた画像の情報がサーバーに保存される。 3に関してですが、実際に画像を選択した瞬間にteratail様側のサーバに画像はすでに上がっているように思えます。 実際に http://teratail.com/uploads/contributed_images/67c5bb29839fe3fa2e8f5d5bc991516a.jpeg は僕が画像を選択して挿入後に左側に挿入された画像のurlです。(ネットで適当に取ってきた画像です) なので、画像を選択した瞬間にサーバに上がっているように思えます。 また、quiitaなどもアップした瞬間にサーバに上がっているように思えるので大体そうではないかなぁと。 それで、どこかでそれの帳尻合わせをしていると思います。(使用されていない画像を削除する的な) ちなみに仮にローカルで処理するとしたら結構重くなります。 普通のやり方だと、imageをdata uri変換してプレビューしたりしますが重すぎてやばいです。。。 gemに関しては詳しくないので割愛します! 頑張ってください!