使用下載 url 和 Cloud Functions 從 Firebase 存儲中刪除文件

Question

我的 Firestore 數據庫中有一組配置文件和一個名為“profilePicture”的字段，其值為 downloadUrl。

我使用雲功能並嘗試了很長時間來弄清楚如何在刪除配置文件時刪除配置文件。

我知道如何在刪除配置文件時創建觸發器並獲取配置文件圖片 downloadUrl，但是如何僅使用 downloadUrl 從存儲中刪除文件？

Answer 1

refFromURL(url) 存儲文檔提供了一種可以在Storage實例上使用的方法refFromURL(url) 。 它指出url參數可以是：

形式的 URL：

1) 一個 gs:// URL，例如 gs://bucket/files/image.png

2) 從對象元數據中獲取的下載 URL。

基於上面的 (2)，似乎 HTTP URL 也應該有效。 但是，存儲路徑字符串可能是更好的做法，因為 Firebase 可以輪換 HTTP URL 上的令牌。

Answer 2

對於admin.storage.Storage不是從 url 獲取參考以進行存儲的內置方法

但是你可以從 URL 中提取文件路徑，通過刪除baseUrl並在 URL 上做一些代碼替換

我為此任務創建方法以接受來自存儲項目的 url 和返回路徑

function getPathStorageFromUrl(url:String){

    const baseUrl = "https://firebasestorage.googleapis.com/v0/b/project-80505.appspot.com/o/";

    let imagePath:string = url.replace(baseUrl,"");

    const indexOfEndPath = imagePath.indexOf("?");

    imagePath = imagePath.substring(0,indexOfEndPath);
    
     imagePath = imagePath.replace("%2F","/");
    
 
    return imagePath;
}

注意：您必須為每個項目替換baseUrl ，您可以通過打開存儲中的任何圖像來找到它，然后從瀏覽器中的 URL 中從最后一個斜杠 '/' 的開始到結尾復制它

例如：

Some image link on my storage : 
https://firebasestorage.googleapis.com/v0/b/project-80505.appspot.com/o/RequestsScreenshot%2F-M6CA-2bG2aP_WwOF-dR__1i5056O335?alt=media&token=d000fab7

the base URL will be 
https://firebasestorage.googleapis.com/v0/b/project-80505.appspot.com/o/ 

現在在獲取路徑調用文件后將其從存儲中刪除

const storage = admin.storage();

const imagePath:string = getPathStorageFromUrl(obj.imageUrl);

storage.bucket().file(imagePath).delete().catch((err) => console.error(err));

注意：沒有解釋 URL 格式的文檔，這意味着 Firebase 團隊可能覺得有一天需要更改它，這意味着如果格式更改，將來可能無法使用。

Answer 3

在 Angular 中，我使用它通過 downloadURL 從 Cloud Firestore 中刪除文件

constructor(private storage: AngularFireStorage) {}

onDeleteAttachment(downloadURL: string) {
  this.storage.storage.refFromURL(downloadURL).delete();
}

Answer 4

我的理解是Cloud Storage的 節點 SDK無法將 HTTP URL 轉換為存儲桶中的文件路徑。 相反，您應該將文件路徑與下載 URL 一起存儲在文檔中。 這將使構建一個 File 對象成為可能，該對象可用於在需要時刪除圖像。

Answer 5

Mahmoud 的答案需要稍加修改 .. 它可以工作 .. 他正在錯誤地進行替換，如果您的存儲中有嵌套目錄或間隔文件名，則可能無法正常工作

 getPathStorageFromUrl(url:String){ const baseUrl = "https://firebasestorage.googleapis.com/v0/b/project-80505.appspot.com/o/"; let imagePath:string = url.replace(baseUrl,""); const indexOfEndPath = imagePath.indexOf("?"); imagePath = imagePath.substring(0,indexOfEndPath); imagePath = imagePath.replace(/%2F/g,"/"); imagePath = imagePath.replace(/%20/g," "); return imagePath; }

Answer 6

confing.js

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

const firebaseConfig = {
            apiKey: "XXXX",
            authDomain: "XXXXX.firebaseapp.com",
            databaseURL: "https://XXXX-app-web.firebaseio.com",
            projectId: "XXXX",
            storageBucket: "XXXX-app-web.appspot.com",
            messagingSenderId: "XXXXXX",
            appId: "1:XXX:web:XXXX",
            measurementId: "G-XXXX"
};
firebase.initializeApp(firebaseConfig);
export const firestore = firebase.firestore();
export const storageRef = firebase.storage();

export default firebase;

按鈕.js

import React from 'react';
import {firestore,storageRef} from './Config';

function removeFile(id,downloadUrl) {
  const storageRefa = storageRef.refFromURL(downloadUrl);

  storageRefa.delete().then(() => {
    firestore.collection("All_Files").doc(id).delete().then((response) => {
      console.log('delete response', response)
    }).catch((error) => {
      console.log('delete error', error)
    })
  }).catch((error) => {
    console.log('delete error', error)
  });
}
export default function MediaCard(props) {
  return (
    <>
           <Button
              onClick={() =>{
                removeFile(props.ID,props.downloadUrl)
              }}
              variant="contained"
              color="secondary"
          >
            Delete
          </Button>
    </>
  );
}