役立ち系こんたくと当サイトの記事を別媒体に流用する際は必ず問い合わせページからご連絡下さいホーム「役立ち情報」だよりCarrierwaveで保存したファイルをReactでダウンロードする方法2022年11月29日SHAREツイートシェアはてブLINEPocketやっはろー♪へっぽこだよ。前回の記事の続きです。前回やったところは解説してないので、わからない人は出直してきてね。ReactからRails経由でS3へファイルをアップロードする方法RailsからURLを受け取る以下のコードをコピペしてください。);}コードサンドボックス:サンプル↑でどんな感じか確認できます。}})ここでRailsにアクセスします。idにはファイルIDが格納されています。ファイルは複数保存されているはずなので、状況によってsetFileIdでIDを変更してください。今回はあくまでサンプルなので初期値の0のまま進めていきます。paramsにidを入れてrailsに渡します。window.open(response.data.download_url);}↑はRailsでファイルのURLを取得したあとの処理です。window.openで強制的にブラウザのタブを開かせます。S3に保存されたファイルだと、Carrierwaveが出力したURLのままで大丈夫ですが、ローカルだとhttp://localhost:3000をつけないといけないため注意が必要です。}endCarrierwaveが紐付いたカラムは.urlという形でダウンロードするためのURLを呼び出せます。本番とローカルのダウンロードURLの形式が違うため、envに開発環境のtrue/falseを格納します。window.open(response.data.download_url);}が反応してwindow.openを使ってダウンロードに必要なURLを強制的に開きます。前回の記事と今回の記事をすべてやった方はファイルをAWSやローカルにアップロードしてダウンロードできたのではないでしょうか。なにか不足してるものがあったらコメント欄までください。以上、へっぽこでした。※万一記事に関わる個人・団体の方で記事の削除依頼がある場合、本サイトのお問い合わせから連絡ください。内容を確認させていただきます。コメントをキャンセルメールアドレスが公開されることはありません。コメント名前メールサイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。date*日本語が含まれない投稿は無視されますのでご注意ください。人の気持ちがよくわかりません。友達や同僚からはサイコパスって言われます。