はてなブックマーク

はじめに S3にファイルアップロードする機能を実装することはよくあると思います。 僕自身Railsをよく使うので、carrierwaveのようなGemを使って実装していたのですが、クライアントサイドから直接S3にファイルアップロードする機能を実装することがあったので、その流れを備忘録として書いていきたいと思います。 ※下記に記載しているコードは実際に実装したコードを少し変えたもので、S3が絡む都合上動作確認はできていませんので、あくまで実装の流れを参考にするようにしてください。 使用する技術 フロントエンド React バックエンド Rails Gem aws-sdk ファイルアップロード先 S3 大まかな流れ バックエンドの実装 1. AWSの設定 2. ファイルアップロード用の署名付きURLを発行する フロントエンドの実装 1. 署名付きURLを取得する 2. ファイルをアップロードす