storage
スポンサーリンク

Firebaseに画像を保存する場合、Storageというところに保存することになります。

例えばユーザーのプロフィール画像や投稿された画像を保存する際などに使われることが多いです。

Storageへ画像を保存

私が画像をStorageに保存した時のコードです。

 

ちょっと長いですが一つずつ説明していきます。

 

ストレージサーバのURLを取得

let storage = Storage.storage().reference(forURL: "あなた固有のURL")

これを取得しないと保存ができない(はず)なので、取得しましょう。

やり方はまず、自身のプロジェクトのfirebaseのコンソール画面のStorageタブを開きます。

firebaseのコンソール画面のStorageタブ

画像の中央に〜.appspot.comというURLがあります。これを""で包んで該当箇所に記述しましょう。

 

パスを指定する変数を定義

let imageRef = storage.child("profileImage").child("\(user.uid).jpeg")

画像のありか(ストレージの場所)を示すパス(あなた固有のURL/フォルダの名前/{user.uid}.jpeg)を指定する変数を定義しています。

"profileImage"はフォルダの名前です。これは自分で好きな名前をつけてください。上のコンソール画面の画像でもprofileImageというフォルダが作られているのが確認できます。

"\(user.uid).jpeg"は画像の「.jpeg」以前にAuthの.uidを入れるようにしています。

ここも自分の好きなように応用してください。

profileImageコンソール画面のフォルダをクリックすると、保存した画像が一覧で見れます。

ここの「.jpeg」以前の部分が私の場合は.uidになるということです。

 

保存したい画像のデータを変数として持つ

var ProfileImageData: Data = Data()

のちに画像を圧縮したりstorageに画像を送信する際にはData型である必要がある(多分)のでここでそれ用の変数を定義しておきます。

私の場合はユーザーのプロフィール画像を保存したかったのでvar ProfileImageDataとしましたが、ここも皆さんの好きにして良いです。

 

画像を圧縮

ProfileImageData = (profileImageView.image?.jpegData(compressionQuality: 0.01))!

画像のサイズが大きすぎるとアプリの挙動が遅くなったりすることがあるので圧縮(リサイズ)してから画像を保存しましょう。

compressionQuality: 0.01ここの数字でどれくらいのサイスにするか指定できます。

 

storageに画像を送信

imageRef.putData(ProfileImageData, metadata: nil) { (metaData, error) in }

imageRefで画像の保存先のパスを指定し、保存したい画像のデータが入ったProfileImageDataをstorageに送信することで画像が保存できます。保存が成功すればmetaData、失敗すればerrorに値が入ります。

 

Storageの画像を取得

Swift-code

コードを文字で見る

 

これはFirebaseUIを使ったやり方です。podファイルに「pod 'FirebaseUI/Storage'」を追加する必要があります。

if let user = Auth.auth().currentUser {
let storageref1 = Storage.storage().reference(forURL: "gs://ogiri-d1811.appspot.com").child("profileImage").child("\(user.uid).jpeg")
}

ここでstorageref1に取得したい画像のパスを入れます。

私の場合は「Authのuid.jpeg」になるようになっているので.child("\(user.uid).jpeg")になっています。

 

profileImageView.sd_setImage(with: storageref1)

あとはImageViewに.sd_setImage(with:取得したい画像のパス)で画像の取得はOKです。

Swift(iOS)が学べるオンラインスクール ランキング
CodeCamp
CodeCamp
7〜24時まで授業可能で働きながらでも学べる!!
料金
講師の質
コースの種類
転職サポート
ポイント1エンジニア経験2年以上のベテラン講師によるオンライン授業
講師は全員が現役のエンジニアで、他のスクールによく見られるアルバイト講師ではありません。マンツーマン指導で自分のレベルにあったカリキュラムが組め、満足度も高いです。また、自社開発企業への転職指導にも定評があります。

ポイント2無料レッスン体験&無料受講相談で事前に話が聞ける
事前にレッスンを体験して授業の雰囲気や学習ペースを確認できます。またエンジニア転職を目指す方にはどのコースが向いているかなどが聞けるカウンセリング(受講相談)も無料。エンジニアの生の声が聞けるので自分が働き出した時のことをイメージできます。

TechAcademy

授業型ではなく自習型なので自分のペースで学べる
料金
講師の質
コースの種類
転職サポート
ポイント1自習スタイルでチャット質問は何回でも無料
自分の分からないところを質問するスタイルなのでわかるところはサクッと、わからないところはじっくりと、無駄なく学べます。チャットの質問が無料なので、料金を気にせず何回でも聞けます。また、メンターがつくのでカウンセリングで学習の進捗やモチベーションの管理もしてくれます。
ポイント21週間の無料体験と無料カウンセリング、安心の返金制度も
無料体験の期間は1週間もあり、納得してから契約できるので安心です。事前の無料カウンセリングでは、その人にあったアドバイス等をもらうことができるので気軽に活用しよう。転職保障コースの場合、転職できなかったら全額返金!!
侍エンジニア塾
プログラミングスクールの老舗NO.1
料金
講師の質
コースの種類
転職サポート
ポイント1歴史があるからノウハウも豊富
日本で初めてオンラインのマンツーマンレッスン指導を導入した実績十分のスクール。講師も現役エンジニアでメンタリングもあるため転職のサポートも手厚く、面接対策や自己PRのフィードバックまで対応してくれます。

ポイント2転職成功率94.1%、挫折率8%
コースによっては転職成功で受講料が0円に!!  絶対にエンジニアになりたいという意思があれば超低額で転職できます。事前の無料体験で相談も可能なため、まずは話だけ聞いてみるのもあり。

おすすめの記事