[Firebase] Storage에서 이미지 업로드 및 다운로드하기

첫 번째로 할 일은 pod파일에 'Firebase/Storage'를 추가해줍니다

그리곤 터미널로 가서 해당 폴더로 이동 후 pod install을 해줍니다.

그리곤 뷰컨트롤러로 이동해 import FirebaseStorage 해줍니다.

그리곤 Storage인스턴스를 만들어줍니다. 

그 다음은 파라미터로 UIImage를 받는 업로드하는 메소드 uploadimage를 만들어줍니다.

data 변수를 만들어서 이미지를 jpegData로 바꿔준 뒤

filepath라는 변수를 만들어서 어떤 이름으로 저장 및 주소를 만들건지 정해줍니다.

그리곤 contentType으로 "image/png"로 해준뒤

아까 만들어뒀던 storage인스턴스에 reference().child(filePath).putData를 해주어 데이터를 해당 스토리지에 넣어줍니다.

이렇게 원하는 이미지를 uploadimage에 넣어주면

성공이 뜨고

스토리지로 이동해 확인해 보면 다음과 같이 password라고 Image가 저장되어 있습니다.

자 이렇게 저장된 이미지를 어떻게 다시 다운로드 받느냐 

우선 저장된 파일의 아래 사진 중 저장소 위치를 잘 복사해둡니다.

아래와 같이 UIImageView를 파라미터로 받는 downloadimage 메소드를 만들어줍니다.

그리곤 아까 만들어뒀던 storage 인스턴스의 레퍼런스에 forURL에 아까 저장해뒀던 저장소 위치를 그대로 넣어줍니다.

그리곤 URL을 다운로드 받아 url을 데이터로 변환해준 뒤 데이터를 이미지로 변환해주고 해당 뷰컨트롤러의 이미지뷰에 이미지를 넣어줍니다.

아래와 같이 메소드를 넣어주면

아래와 같이 저장되어 있던 이미지가 다운로드 되어 이미지뷰에 나타납니다!!!

전체코드

 

 

import UIKit
import FirebaseStorage
 
 
class TabbarViewController2: UIViewController {
    let storage = Storage.storage()
    
    @IBOutlet weak var imgview: UIImageView!
    override func viewDidLoad() {
        super.viewDidLoad()
        
        let image = UIImage(named: "passwordOn@3x.png")
        uploadimage(img: image!)
        
 
        downloadimage(imgview: imgview)
        
    }
                
func downloadimage(imgview:UIImageView){
    storage.reference(forURL: "gs://firstios-f6c7c.appspot.com/password").downloadURL { (url, error) in
                       let data = NSData(contentsOf: url!)
                       let image = UIImage(data: data! as Data)
                        imgview.image = image
        }
}
    
    func uploadimage(img :UIImage){
        var data = Data()
        data = img.jpegData(compressionQuality: 0.8)!
        let filePath = "password"
        let metaData = StorageMetadata()
        metaData.contentType = "image/png"
        storage.reference().child(filePath).putData(data,metadata: metaData){
            (metaData,error) in if let error = error{
                print(error.localizedDescription)
                return
            }else{
                print("성공")
                    }
                }
            }
        }

궁금하신 점이나 틀린 부분 있으면 언제든 댓글 달아주세요~