הצגה של רשימת קבצים באמצעות Cloud Storage באינטרנט

‫Cloud Storage for Firebase מאפשרת לכם להציג ברשימה את התוכן של הקטגוריה Cloud Storage. ערכות ה-SDK מחזירות גם את הפריטים וגם את הקידומות של האובייקטים בהפניה Cloud Storage הנוכחית.

בפרויקטים שמשתמשים ב-List API נדרשת גרסה 2 של כללים Cloud Storage for Firebase. אם יש לכם פרויקט Firebase קיים, פועלים לפי השלבים שמפורטים במדריך לכללי אבטחה.

‫list() משתמש ב-Google Cloud Storage List API. ב-Cloud Storage for Firebase, אנחנו משתמשים ב-/ כמפריד, שמאפשר לנו לדמות סמנטיקה של מערכת קבצים. כדי לאפשר מעבר יעיל בין דליים גדולים והיררכיים של Cloud Storage, ה-API של List מחזיר קידומות ופריטים בנפרד. לדוגמה, אם מעלים קובץ אחד /images/uid/file1,

• הפונקציה root.child('images').listAll() תחזיר את הערך /images/uid כקידומת.
• ‫root.child('images/uid').listAll() תחזיר את הקובץ כפריט.

‫Cloud Storage for Firebase SDK לא מחזיר נתיבי אובייקטים שמכילים שני תווי / עוקבים או מסתיימים בתו /.. לדוגמה, נניח שיש לכם קטגוריה עם האובייקטים הבאים:

• correctPrefix/happyItem
• wrongPrefix//sadItem
• lonelyItem/

פעולות הרשימה על פריטים בדלי הזה יניבו את התוצאות הבאות:

• פעולת הרשימה ברמת הבסיס מחזירה את ההפניות אל correctPrefix,‏ wrongPrefix ו-lonelyItem בתור prefixes.
• פעולת הרשימה ב-correctPrefix/ מחזירה את ההפניות אל correctPrefix/happyItem בתור items.
• פעולת הרשימה ב-wrongPrefix/ לא מחזירה הפניות כי wrongPrefix//sadItem מכיל שני / רצופים.
• פעולת הרשימה ב-lonelyItem/ לא מחזירה הפניות כי האובייקט lonelyItem/ מסתיים ב-/.

הצגת רשימה של כל הקבצים

אפשר להשתמש ב-listAll כדי לאחזר את כל התוצאות של ספרייה. השיטה הזו מתאימה במיוחד לספריות קטנות, כי כל התוצאות נשמרות בזיכרון. בנוסף, יכול להיות שהפעולה לא תחזיר תמונת מצב עקבית אם אובייקטים יתווספו או יוסרו במהלך התהליך.

אם הרשימה גדולה, כדאי להשתמש בשיטה list() עם חלוקה לדפים, כי listAll() שומרת את כל התוצאות בזיכרון.

בדוגמה הבאה אפשר לראות איך משתמשים ב-listAll.

import { getStorage, ref, listAll } from "firebase/storage";

const storage = getStorage();

// Create a reference under which you want to list
const listRef = ref(storage, 'files/uid');

// Find all the prefixes and items.
listAll(listRef)
  .then((res) => {
    res.prefixes.forEach((folderRef) => {
      // All the prefixes under listRef.
      // You may call listAll() recursively on them.
    });
    res.items.forEach((itemRef) => {
      // All the items under listRef.
    });
  }).catch((error) => {
    // Uh-oh, an error occurred!
  });
storage_list_all.js

// Create a reference under which you want to list
var listRef = storageRef.child('files/uid');

// Find all the prefixes and items.
listRef.listAll()
  .then((res) => {
    res.prefixes.forEach((folderRef) => {
      // All the prefixes under listRef.
      // You may call listAll() recursively on them.
    });
    res.items.forEach((itemRef) => {
      // All the items under listRef.
    });
  }).catch((error) => {
    // Uh-oh, an error occurred!
  });
list-files.js

חלוקת תוצאות הרשימה לדפים

ב-API‏ list() יש מגבלה על מספר התוצאות שהוא מחזיר. list() מספקת צפייה עקבית בדף וחושפת pageToken שמאפשר שליטה על המועד לאחזור תוצאות נוספות.

הערך pageToken מקודד את הנתיב והגרסה של הפריט האחרון שהוחזר בתוצאה הקודמת. בבקשה הבאה באמצעות pageToken, מוצגים פריטים שמופיעים אחרי pageToken.

בדוגמה הבאה מוצג אופן השימוש ב-async/await כדי להציג תוצאה עם מספור עמודים.

import { getStorage, ref, list } from "firebase/storage";

async function pageTokenExample(){
  // Create a reference under which you want to list
  const storage = getStorage();
  const listRef = ref(storage, 'files/uid');

  // Fetch the first page of 100.
  const firstPage = await list(listRef, { maxResults: 100 });

  // Use the result.
  // processItems(firstPage.items)
  // processPrefixes(firstPage.prefixes)

  // Fetch the second page if there are more elements.
  if (firstPage.nextPageToken) {
    const secondPage = await list(listRef, {
      maxResults: 100,
      pageToken: firstPage.nextPageToken,
    });
    // processItems(secondPage.items)
    // processPrefixes(secondPage.prefixes)
  }
}
storage_list_paginate.js

async function pageTokenExample(){
  // Create a reference under which you want to list
  var listRef = storageRef.child('files/uid');

  // Fetch the first page of 100.
  var firstPage = await listRef.list({ maxResults: 100});

  // Use the result.
  // processItems(firstPage.items)
  // processPrefixes(firstPage.prefixes)

  // Fetch the second page if there are more elements.
  if (firstPage.nextPageToken) {
    var secondPage = await listRef.list({
      maxResults: 100,
      pageToken: firstPage.nextPageToken,
    });
    // processItems(secondPage.items)
    // processPrefixes(secondPage.prefixes)
  }
}
list-files.js

טיפול בשגיאות

הפונקציות list() ו-listAll() מחזירות Promise שנדחה אם לא שדרגתם את כללי האבטחה לגרסה 2. אם מופיעה השגיאה הבאה, צריך לשדרג את כללי האבטחה:

Listing objects in a bucket is disallowed for rules_version = "1".
Please update storage security rules to rules_version = "2" to use list.

שגיאות אפשריות אחרות עשויות להצביע על כך שלמשתמש אין את ההרשאה הנכונה. מידע נוסף על שגיאות זמין במאמר בנושא טיפול בשגיאות.