firebase ver 8 with React (4) Storage

https://firebase.google.com/docs/reference/js/firebase.storage

storage | JavaScript SDK  |  Firebase

 

firebase가 db라면, storage는 aws s3 버킷 같은 스토리지 서비스이다.

살펴보니 1 계정 = 1 버킷이다.

다른 버킷을 쓰고 싶다면 다른 계정을 만들어서 firestore.storage(app) 꼴로 스토리지 객체를 따로 만들어야 한다. 

쓰다보니 느끼는건데 파베는 꽤나 제한적인듯.

 

firebase.storage() 의 메서드들

 

ref()

https://firebase.google.com/docs/reference/js/firebase.storage.Reference

firebase.storage().ref(); // 내가 사용하는 버킷이 뭐임?

위처럼 reference를 불러와 출력해보면 아래 같은 것들이 뜨는데, 단순히 특정 버킷을 가리키는 것일 뿐이다.

 

bucket 이름은 firebase에서 직접 확인할 수 있다. fir-test-84415.appspot.com이라고 보이는가?

 

 

refFromURL()

https://firebase.google.com/docs/reference/js/firebase.storage.Storage#reffromurl

 

Returns a reference for the given absolute URL. storage에 저장된 파일의 public url을 기반으로 레퍼런스를 반환합니다.

그러니까, absolute URL이 있는 파일을 지워버리거나, 업데이트할 때 용이하겠죠?

 

// 삭제 ㄱㄱ
storageService.refFromURL(fileUrl).delete();

 

 

setMaxOperationRetryTime, setMaxUploadRetryTime

https://firebase.google.com/docs/reference/js/firebase.storage.Storage#setmaxoperationretrytime

 

이 부분은 간단하니 직접 문서를 참고하는게 좋을듯. 애초에 구글이 관리하는데 storage가 실패한다는 생각을 안해봤네요...

 

 

Reference Method

 

child => 버킷의 특정 경로를 가리킴

Returns a reference to a relative path from this reference.

쉽게 말해서 그냥 버킷에 특정 경로를 말합니다. child가 반환하는 reference에 put이니 putString, getMetadata 등 여러 메서드를 활용하여 storage를 조작할 수 있습니다.

fileRefInstance.child("myBusiness/typed.txt"); // myBusiness 폴더에 typed.txt 파일의 경로

 

put, putString

https://firebase.google.com/docs/reference/js/firebase.storage.Reference#put

 

data에 blob을 넣을 건지, string을 넣을 건지만 다르고 사실상 같은 함수입니다. 버킷에 주어진 데이터를 업로드합니다.

UploadTask를 반환하는데, 출력해보면 아래와 같은 내용들을 담고 있습니다. 업로드하고 바로 ref랑 task 출력 쌉가능.

 

delete

https://firebase.google.com/docs/reference/js/firebase.storage.Reference#delete

그냥.. 지우는건데요... 생략.

 

 

list, listAll

https://firebase.google.com/docs/reference/js/firebase.storage.Reference#list

리스트하는 겁니다. 기본 페이지네이션은 1000이라 하네요.

 

 

getDownloadURL

https://firebase.google.com/docs/reference/js/firebase.storage.Reference#getdownloadurl

 

업로드한 파일에 접근할 수 있는 url을 얻습니다. aws s3랑 다른게, bucket/url 로 접근이 안됩니다.

reference에서 getDownloadURL 메서드를 통해 외부에서 접근 가능한 url을 얻을 수 있습니다.

 

일반적으론 파일을 업로드한 다음에 해당 파일에 접근할 수 있는 url을 알고 싶을테죠?

예시를 들어보면 아래와 같습니다.

const uploadTask = await fileRef.putString(attachment, "data_url");
fileUrl = await uploadTask.ref.getDownloadURL();