Sử dụng bộ sưu tập để sắp xếp ngăn nắp các trang
Lưu và phân loại nội dung dựa trên lựa chọn ưu tiên của bạn.
Tệp của bạn được lưu trữ trong một vùng chứa Cloud Storage. Các tệp trong nhóm này được trình bày theo cấu trúc phân cấp, giống như hệ thống tệp trên ổ đĩa cứng cục bộ hoặc dữ liệu trong Firebase Realtime Database.
Bằng cách tạo một tệp tham chiếu, ứng dụng của bạn sẽ có quyền truy cập vào tệp đó. Sau đó, bạn có thể dùng các giá trị tham chiếu này để tải dữ liệu lên hoặc xuống, nhận hoặc cập nhật siêu dữ liệu hoặc xoá tệp. Tham chiếu có thể trỏ đến một tệp cụ thể hoặc đến một nút cấp cao hơn trong hệ phân cấp.
Nếu bạn đã sử dụng Firebase Realtime Database, thì những đường dẫn này sẽ rất quen thuộc với bạn. Tuy nhiên, dữ liệu tệp của bạn được lưu trữ trong Cloud Storage chứ không được lưu trữ trong Realtime Database.
Tạo tệp đối chiếu
Để tải lên hoặc tải xuống tệp, xoá tệp hoặc nhận hoặc cập nhật siêu dữ liệu, bạn phải tạo một tham chiếu đến tệp mà bạn muốn thao tác. Bạn có thể coi tệp tham chiếu là một con trỏ đến một tệp trên đám mây. Các tham chiếu có dung lượng nhỏ, vì vậy bạn có thể tạo bao nhiêu tham chiếu tuỳ ý và có thể dùng lại các tham chiếu này cho nhiều thao tác.
Để tạo một tham chiếu, hãy lấy một phiên bản của dịch vụ Lưu trữ bằng cách sử dụng getStorage() rồi gọi ref() với dịch vụ làm đối số.
Tham chiếu này trỏ đến gốc của vùng chứa Cloud Storage.
Web
import{getStorage,ref}from"firebase/storage";// Get a reference to the storage service, which is used to create references in your storage bucketconststorage=getStorage();// Create a storage reference from our storage serviceconststorageRef=ref(storage);
// Get a reference to the storage service, which is used to create references in your storage bucketvarstorage=firebase.storage();// Create a storage reference from our storage servicevarstorageRef=storage.ref();
Bạn có thể tạo một tham chiếu đến một vị trí thấp hơn trong cây, chẳng hạn như 'images/space.jpg' bằng cách truyền đường dẫn này làm đối số thứ hai khi gọi ref().
Web
import{getStorage,ref}from"firebase/storage";conststorage=getStorage();// Create a child referenceconstimagesRef=ref(storage,'images');// imagesRef now points to 'images'// Child references can also take paths delimited by '/'constspaceRef=ref(storage,'images/space.jpg');// spaceRef now points to "images/space.jpg"// imagesRef still points to "images"
// Create a child referencevarimagesRef=storageRef.child('images');// imagesRef now points to 'images'// Child references can also take paths delimited by '/'varspaceRef=storageRef.child('images/space.jpg');// spaceRef now points to "images/space.jpg"// imagesRef still points to "images"
Bạn cũng có thể dùng các thuộc tính parent và root để di chuyển lên hệ thống phân cấp tệp. parent di chuyển lên một cấp, còn root di chuyển lên đầu.
Web
import{getStorage,ref}from"firebase/storage";conststorage=getStorage();constspaceRef=ref(storage,'images/space.jpg');// Parent allows us to move to the parent of a referenceconstimagesRef=spaceRef.parent;// imagesRef now points to 'images'// Root allows us to move all the way back to the top of our bucketconstrootRef=spaceRef.root;// rootRef now points to the root
// Parent allows us to move to the parent of a referencevarimagesRef=spaceRef.parent;// imagesRef now points to 'images'// Root allows us to move all the way back to the top of our bucketvarrootRef=spaceRef.root;// rootRef now points to the root
child(), parent và root có thể được liên kết với nhau nhiều lần, vì mỗi lần đều trả về một giá trị tham chiếu. Trường hợp ngoại lệ là parent của root, tức là null.
Web
import{getStorage,ref}from"firebase/storage";conststorage=getStorage();constspaceRef=ref(storage,'images/space.jpg');// References can be chained together multiple timesconstearthRef=ref(spaceRef.parent,'earth.jpg');// earthRef points to 'images/earth.jpg'// nullRef is null, since the parent of root is nullconstnullRef=spaceRef.root.parent;
// References can be chained together multiple timesvarearthRef=spaceRef.parent.child('earth.jpg');// earthRef points to 'images/earth.jpg'// nullRef is null, since the parent of root is nullvarnullRef=spaceRef.root.parent;
Bạn có thể kiểm tra các tài liệu tham khảo để hiểu rõ hơn về những tệp mà chúng trỏ đến bằng cách sử dụng các thuộc tính fullPath, name và bucket. Các thuộc tính này sẽ lấy đường dẫn đầy đủ của tệp, tên của tệp và vùng chứa lưu trữ tệp.
Web
import{getStorage,ref}from"firebase/storage";conststorage=getStorage();constspaceRef=ref(storage,'images/space.jpg');// Reference's path is: 'images/space.jpg'// This is analogous to a file path on diskspaceRef.fullPath;// Reference's name is the last segment of the full path: 'space.jpg'// This is analogous to the file namespaceRef.name;// Reference's bucket is the name of the storage bucket where files are storedspaceRef.bucket;
// Reference's path is: 'images/space.jpg'// This is analogous to a file path on diskspaceRef.fullPath;// Reference's name is the last segment of the full path: 'space.jpg'// This is analogous to the file namespaceRef.name;// Reference's bucket is the name of the storage bucket where files are storedspaceRef.bucket;
Đường dẫn và tên tham chiếu có thể chứa bất kỳ chuỗi ký tự Unicode hợp lệ nào, nhưng có một số hạn chế, bao gồm:
Tổng độ dài của reference.fullPath phải từ 1 đến 1024 byte khi được mã hoá UTF-8.
Không có ký tự Trả về vị trí đầu dòng hoặc Ký tự ngắt dòng.
Tránh dùng #, [, ], * hoặc ? vì những hàm này không hoạt động hiệu quả với các công cụ khác như Firebase Realtime Database hoặc gsutil.
Ví dụ đầy đủ
Web
import{getStorage,ref}from"firebase/storage";conststorage=getStorage();// Points to the root referenceconststorageRef=ref(storage);// Points to 'images'constimagesRef=ref(storageRef,'images');// Points to 'images/space.jpg'// Note that you can use variables to create child valuesconstfileName='space.jpg';constspaceRef=ref(imagesRef,fileName);// File path is 'images/space.jpg'constpath=spaceRef.fullPath;// File name is 'space.jpg'constname=spaceRef.name;// Points to 'images'constimagesRefAgain=spaceRef.parent;
// Points to the root referencevarstorageRef=firebase.storage().ref();// Points to 'images'varimagesRef=storageRef.child('images');// Points to 'images/space.jpg'// Note that you can use variables to create child valuesvarfileName='space.jpg';varspaceRef=imagesRef.child(fileName);// File path is 'images/space.jpg'varpath=spaceRef.fullPath;// File name is 'space.jpg'varname=spaceRef.name;// Points to 'images'varimagesRef=spaceRef.parent;
[[["Dễ hiểu","easyToUnderstand","thumb-up"],["Giúp tôi giải quyết được vấn đề","solvedMyProblem","thumb-up"],["Khác","otherUp","thumb-up"]],[["Thiếu thông tin tôi cần","missingTheInformationINeed","thumb-down"],["Quá phức tạp/quá nhiều bước","tooComplicatedTooManySteps","thumb-down"],["Đã lỗi thời","outOfDate","thumb-down"],["Vấn đề về bản dịch","translationIssue","thumb-down"],["Vấn đề về mẫu/mã","samplesCodeIssue","thumb-down"],["Khác","otherDown","thumb-down"]],["Cập nhật lần gần đây nhất: 2025-09-05 UTC."],[],[],null,["\u003cbr /\u003e\n\nYour files are stored in a\n[Cloud Storage](//cloud.google.com/storage) bucket. The\nfiles in this bucket are presented in a hierarchical structure, just like the\nfile system on your local hard disk, or the data in the Firebase Realtime Database.\nBy creating a reference to a file, your app gains access to it. These references\ncan then be used to upload or download data, get or update metadata or delete\nthe file. A reference can either point to a specific file or to a higher level\nnode in the hierarchy.\n\nIf you've used the [Firebase Realtime Database](/docs/database), these paths should\nseem very familiar to you. However, your file data is stored in\nCloud Storage, **not** in the Realtime Database.\n\nCreate a Reference\n\nIn order to upload or download files, delete files, or get or update metadata,\nyou must create a reference to the file you want to operate on. A reference\ncan be thought of as a pointer to a file in the cloud. References are\nlightweight, so you can create as many as you need, and they are also reusable for\nmultiple operations.\n\nTo create a reference, get an instance of the Storage service using\n`getStorage()` then call `ref()` with the service as an argument.\nThis reference points to the root of your Cloud Storage bucket. \n\nWeb \n\n```javascript\nimport { getStorage, ref } from \"firebase/storage\";\n\n// Get a reference to the storage service, which is used to create references in your storage bucket\nconst storage = getStorage();\n\n// Create a storage reference from our storage service\nconst storageRef = ref(storage);https://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/snippets/storage-next/create-reference/storage_create_ref.js#L8-L14\n```\n\nWeb \n\n```javascript\n// Get a reference to the storage service, which is used to create references in your storage bucket\nvar storage = firebase.storage();\n\n// Create a storage reference from our storage service\nvar storageRef = storage.ref();https://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/storage/create-reference.js#L6-L10\n```\n\nYou can create a reference to a location lower in the tree,\nsay `'images/space.jpg'` by passing in this path as a second argument when\ncalling `ref()`. \n\nWeb \n\n```javascript\nimport { getStorage, ref } from \"firebase/storage\";\n\nconst storage = getStorage();\n\n// Create a child reference\nconst imagesRef = ref(storage, 'images');\n// imagesRef now points to 'images'\n\n// Child references can also take paths delimited by '/'\nconst spaceRef = ref(storage, 'images/space.jpg');\n// spaceRef now points to \"images/space.jpg\"\n// imagesRef still points to \"images\" \nhttps://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/snippets/storage-next/create-reference/storage_create_ref_child.js#L8-L19\n```\n\nWeb \n\n```javascript\n// Create a child reference\nvar imagesRef = storageRef.child('images');\n// imagesRef now points to 'images'\n\n// Child references can also take paths delimited by '/'\nvar spaceRef = storageRef.child('images/space.jpg');\n// spaceRef now points to \"images/space.jpg\"\n// imagesRef still points to \"images\" \nhttps://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/storage/create-reference.js#L18-L25\n```\n\nNavigate with References\n\nYou can also use the `parent` and `root` properties to navigate up the\nfile hierarchy. `parent` navigates up one level,\nwhile `root` navigates all the way to the top. \n\nWeb \n\n```javascript\nimport { getStorage, ref } from \"firebase/storage\";\n\nconst storage = getStorage();\nconst spaceRef = ref(storage, 'images/space.jpg');\n\n// Parent allows us to move to the parent of a reference\nconst imagesRef = spaceRef.parent;\n// imagesRef now points to 'images'\n\n// Root allows us to move all the way back to the top of our bucket\nconst rootRef = spaceRef.root;\n// rootRef now points to the root \nhttps://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/snippets/storage-next/create-reference/storage_navigate_ref.js#L8-L19\n```\n\nWeb \n\n```javascript\n// Parent allows us to move to the parent of a reference\nvar imagesRef = spaceRef.parent;\n// imagesRef now points to 'images'\n\n// Root allows us to move all the way back to the top of our bucket\nvar rootRef = spaceRef.root;\n// rootRef now points to the root \nhttps://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/storage/create-reference.js#L33-L39\n```\n\n`child()`, `parent`, and `root` can be chained together multiple times, as\neach returns a reference. The exception is the `parent` of `root`, which\nis `null`. \n\nWeb \n\n```javascript\nimport { getStorage, ref } from \"firebase/storage\";\n\nconst storage = getStorage();\nconst spaceRef = ref(storage, 'images/space.jpg');\n\n// References can be chained together multiple times\nconst earthRef = ref(spaceRef.parent, 'earth.jpg');\n// earthRef points to 'images/earth.jpg'\n\n// nullRef is null, since the parent of root is null\nconst nullRef = spaceRef.root.parent;https://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/snippets/storage-next/create-reference/storage_navigate_ref_chain.js#L8-L18\n```\n\nWeb \n\n```javascript\n// References can be chained together multiple times\nvar earthRef = spaceRef.parent.child('earth.jpg');\n// earthRef points to 'images/earth.jpg'\n\n// nullRef is null, since the parent of root is null\nvar nullRef = spaceRef.root.parent;https://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/storage/create-reference.js#L47-L52\n```\n\nReference Properties\n\nYou can inspect references to better understand the files they point to\nusing the `fullPath`, `name`, and `bucket` properties. These properties\nget the full path of the file, the name of the file,\nand the bucket the file is stored in. \n\nWeb \n\n```javascript\nimport { getStorage, ref } from \"firebase/storage\";\n\nconst storage = getStorage();\nconst spaceRef = ref(storage, 'images/space.jpg');\n\n// Reference's path is: 'images/space.jpg'\n// This is analogous to a file path on disk\nspaceRef.fullPath;\n\n// Reference's name is the last segment of the full path: 'space.jpg'\n// This is analogous to the file name\nspaceRef.name;\n\n// Reference's bucket is the name of the storage bucket where files are stored\nspaceRef.bucket;https://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/snippets/storage-next/create-reference/storage_ref_properties.js#L8-L22\n```\n\nWeb \n\n```javascript\n// Reference's path is: 'images/space.jpg'\n// This is analogous to a file path on disk\nspaceRef.fullPath;\n\n// Reference's name is the last segment of the full path: 'space.jpg'\n// This is analogous to the file name\nspaceRef.name;\n\n// Reference's bucket is the name of the storage bucket where files are stored\nspaceRef.bucket;https://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/storage/create-reference.js#L60-L69\n```\n\nLimitations on References\n\nReference paths and names can contain any sequence of valid Unicode characters,\nbut certain restrictions are imposed including:\n\n1. Total length of `reference.fullPath` must be between 1 and 1024 bytes when UTF-8 encoded.\n2. No Carriage Return or Line Feed characters.\n3. Avoid using `#`, `[`, `]`, `*`, or `?`, as these do not work well with other tools such as the [Firebase Realtime Database](/docs/database) or [gsutil](https://cloud.google.com/storage/docs/gsutil).\n\nFull Example \n\nWeb \n\n```javascript\nimport { getStorage, ref } from \"firebase/storage\";\n\nconst storage = getStorage();\n\n// Points to the root reference\nconst storageRef = ref(storage);\n\n// Points to 'images'\nconst imagesRef = ref(storageRef, 'images');\n\n// Points to 'images/space.jpg'\n// Note that you can use variables to create child values\nconst fileName = 'space.jpg';\nconst spaceRef = ref(imagesRef, fileName);\n\n// File path is 'images/space.jpg'\nconst path = spaceRef.fullPath;\n\n// File name is 'space.jpg'\nconst name = spaceRef.name;\n\n// Points to 'images'\nconst imagesRefAgain = spaceRef.parent;https://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/snippets/storage-next/create-reference/storage_ref_full_example.js#L8-L30\n```\n\nWeb \n\n```javascript\n// Points to the root reference\nvar storageRef = firebase.storage().ref();\n\n// Points to 'images'\nvar imagesRef = storageRef.child('images');\n\n// Points to 'images/space.jpg'\n// Note that you can use variables to create child values\nvar fileName = 'space.jpg';\nvar spaceRef = imagesRef.child(fileName);\n\n// File path is 'images/space.jpg'\nvar path = spaceRef.fullPath;\n\n// File name is 'space.jpg'\nvar name = spaceRef.name;\n\n// Points to 'images'\nvar imagesRef = spaceRef.parent;https://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/storage/create-reference.js#L75-L93\n```\n\nNext, let's learn how to\n[upload files](/docs/storage/web/upload-files) to\nCloud Storage."]]