在React.js应用程序上从firebase获取和显示图像

npm install firebase

import firebase from 'firebase/app';
import 'firebase/storage';

const firebaseConfig = {
  // 在Firebase控制台中获取的配置信息
};

firebase.initializeApp(firebaseConfig);

export const storage = firebase.storage();

import React, { useEffect, useState } from 'react';
import { storage } from './firebase';

const ImageComponent = () => {
  const [imageUrl, setImageUrl] = useState('');

  useEffect(() => {
    const getImageUrl = async () => {
      try {
        const imageRef = storage.ref('images/image.jpg'); // 图像在Firebase存储中的路径
        const url = await imageRef.getDownloadURL();
        setImageUrl(url);
      } catch (error) {
        console.log(error);
      }
    };

    getImageUrl();
  }, []);

  return (
    <div>
      {imageUrl && <img src={imageUrl} alt="Image" />}
    </div>
  );
};

export default ImageComponent;