Firebase 存储：获取文件相对路径的安全方法？（存储 HTML 文件）答案

【问题标题】：Firebase Storage: safe way to get relative path of a file? (Storing HTML file)Firebase 存储：获取文件相对路径的安全方法？（存储 HTML 文件）
【发布时间】：2019-07-26 20:03:30
【问题描述】：

您好 StackOverflow 和 Firebase 社区！

我正在尝试实现 Firebase 可能不具备的功能：我想在 Firebase 存储中存储 HTML 文件夹（在我的例子中是横幅广告）。

我的问题是：如何保持我的 HTML 文件到相关 JS 和图像文件的相对路径。

所以这些文件可以很容易地找到彼此：

/path/to/my/folder/index.html

/path/to/my/folder/main.js

/path/to/my/folder/picture.jpg

<html>
...
<script src="main.js">
...
</html>

document.onload = function() {
    myImage.src = 'picture.jpg'
}

如果我将所有文件都存储在 Firebase 存储上，并使用它们的 DownloadURL 访问它们，这些相对 URL 将不起作用，看起来像 https://firebasestorage.googleapis.com/v0/b/my-project.appspot.com/o/my_folder_300x250%2Findex.html?alt=media&token=12a123a1-1234-1a1a-1234-a1ab123456a1，

我可以通过打开 Firebase 的安全规则使文件无需令牌即可访问，但由于 URL 参数和文件夹路径被转义，相对路径仍然损坏。

我还设法通过公开 Google Cloud Storage 存储分区，使其在另一个项目中发挥作用。我可以使用如下 URL 访问文件并保留相对路径：https://my-project.appspot.com.storage.googleapis.com/path/to/my/folder/my_folder_300x250/index.html。这很好用，但有我想防止的主要安全漏洞，比如列出存储桶中的所有文件????

我尝试将横幅保存为 zip 文件，在前端解压缩它们，然后使用 FileSystem API 在浏览器中重新创建文件夹结构。但我仅限于 Chrome。

我也可以尝试替换我的 HTML、JS 和 CSS 文件中的所有 URL，但这并不是一个好的解决方案。

【问题讨论】：

标签： firebase google-cloud-storage firebase-storage firebase-security banner

【解决方案1】：

我找到了一个非常简单的解决方案：

在 Google Cloud Console 中，我创建了一个具有 get 访问权限但没有列表访问权限的新角色，并将其应用于 allUsers，具有以下权限。

resourcemanager.projects.get

storage.objects.get

这将暂时解决我的问题，我将继续使用 https://my-project.appspot.com.storage.googleapis.com/path/to/my/folder/my_folder_300x250/index.html 之类的链接访问数据，而不是使用 firebase 的 downloadURL()。

【讨论】：

【解决方案2】：

Firebase Storage 是围绕 Cloud Storage 构建的，它实际上没有目录，而是一个平面命名空间。目录是通过存储对象命名约定来模拟的：名称可以包含/ 字符，并且在对象名称的开头放置“目录”路径会使该对象看起来位于该“目录”中。看 How Subdirectories Work.

因此，您唯一的解决方案（如果您想独立存储文件）是处理所有引用，使“路径”成为绝对路径并相应地命名文件。正如您所观察到的，您可能还需要考虑所有 URL 查询参数。

【讨论】：