파이어베이스 이미지 가져오기 ( Storage )

이미지를 가져오려면 먼저SDK(friebaseconfig 넣어준다)를 가져오면 된다(프로젝트 -> 프로젝트 개요 톱니(오른쪽 상단) -> 프로젝트 설정 )

import { initializeApp } from "firebase/app";
import { getStorage } from "firebase/storage";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
  storageBucket: ''
};
이미지를 가져오려면 먼저SDK(friebaseconfig 넣어준다)를 가져오면 된다(프로젝트 -> 프로젝트 개요 톱니(오른쪽 상단) -> 프로젝트 설정 )

// Initialize Firebase
const app = initializeApp(firebaseConfig);


// Initialize Cloud Storage and get a reference to the service
const storage = getStorage(app);


const imageRef = ref(storage, `your storage url`); // 자신이 가져오려는 storage의 경로를 지정해준다
 listAll(imageRef).then((result) => {
                result.items.forEach((itemRef) => {
                    getDownloadURL(itemRef)
                        .then((url) => {
                            console.log('File URL:', url);
                        })
                        .catch((error) => {
                            console.error('Error getting download URL:', error);
                        });
                });
            })
            .catch((error) => {
                console.error('Error listing files:', error);
            });
            
  //listAll로 우리가 적어준 디렉토리 경로안에 있는 모든 사진의 url 하나씩 출력해주는 코드다.

 

import { initializeApp } from "firebase/app";
import { getStorage } from "firebase/storage";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
  storageBucket: ''
};
이미지를 가져오려면 먼저SDK(friebaseconfig 넣어준다)를 가져오면 된다(프로젝트 -> 프로젝트 개요 톱니(오른쪽 상단) -> 프로젝트 설정 )

// Initialize Firebase
const app = initializeApp(firebaseConfig);


// Initialize Cloud Storage and get a reference to the service
const storage = getStorage(app);


const imageRef = ref(storage, `your storage url`); // 자신이 가져오려는 storage의 경로를 지정해준다
   getDownloadURL(imageRef)
      .then((url) => {
        setImageUrl(url);
      })
      .catch((error) => {
        console.error('Error getting download URL:', error);
      });
  //이 코드는 그 경로에 있는 사진 하나만 가져오는 코드이다(사진 하나의 경로만 가져온다 아마도..?)