はじめに

おはようございます。こんにちは。こんばんは。
Watatakuです。
今回の書いていく内容なんですけれども、タイトルから分かる通り仕様が変わっていました。
v8までを使用している方は以前の書き方で大丈夫なのですが、これから新規でfirebaseのプロジェクトを始めるときに書き方が変わりますというお話です。
その中でも今回はstorageをやっていきます。
storageはcloud storageと呼ばれ、Firebaseが提供している機能の一つで、写真や動画など、ユーザーが作成したコンテンツを保管、提供する必要のあるアプリ デベロッパー向けに構築されています。

以前はQiitaの方に書かせて頂いたのは仕様が変わる前の記事になっているので、仕様変更前と後の見比べに合わせてご覧ください。
https://qiita.com/watataku8911/items/7292a04590aad5b4dd19

画像をアップロードする

import { initializeApp } from "firebase/app";
import { getStorage, ref, uploadBytes  } from "firebase/firestore";

const firebaseConfig = {
  apiKey: " process.env.API_KEY",
  authDomain: "process.env.AUTH_DOMAIN",
  projectId: "process.env.PROJECT_ID",
  storageBucket: "process.env.STORAGE_BUCKET",
  messagingSenderId: "process.env.MESSAGING_SENDER_ID",
  appId: "process.env.APP_ID",
  measurementId: "process.env.MEASUREMENT_ID",
};
const app = initializeApp(firebaseConfig);
const storage = getStorage(app);

// ファイルへの参照を作る。
const　imageRef = ref(storage, 'hogehoge.jpg');

// 'file' は Blob または File API から取得される。
uploadBytes(storageRef, file).then((snapshot) => {
  console.log('アップロードができました');
}).catch(() => {
  console.log('アップロードができませんでした');
});

「ファイルへの参照を作る」に関しては下記のように記述するとフォルダとファイルを作れるようになります。

const　imageRef = ref(storage, 'bowbow/hogehoge.jpg');

保存した画像の保存先URLを取得する

保存した画像の保存先URLを取得するメソッドはgetDownloadURL()を使用します。

import { initializeApp } from "firebase/app";
import { getStorage, ref, getDownloadURL } from "firebase/firestore";

const firebaseConfig = {
  apiKey: " process.env.API_KEY",
  authDomain: "process.env.AUTH_DOMAIN",
  projectId: "process.env.PROJECT_ID",
  storageBucket: "process.env.STORAGE_BUCKET",
  messagingSenderId: "process.env.MESSAGING_SENDER_ID",
  appId: "process.env.APP_ID",
  measurementId: "process.env.MEASUREMENT_ID",
};
const app = initializeApp(firebaseConfig);
const storage = getStorage(app);

const　imageRef = ref(storage, 'hogehoge.jpg');
getDownloadURL(imageRef).then((downloadURL) => {
  console.log(downloadURL);
}).catch(() => {
  console.log("ダウンロードURLが取得せきませんでした");
});

この取得した、downloadURLをfirestoreなどに保存してやってください。

https://firebase.google.com/docs/storage/web/start?hl=ja