从Firebase存储下载文件无法正常工作

Question

在我的Angular应用程序中，我正在尝试检索保存在Firebase存储中的文件。

为此，我编写了以下代码：

    var storage = firebase.storage();
    var fileRef = storage.ref(`${this.idOfCurrentUser}/personalData.card`);

    var blob = null;

    console.log("THIS LINE DOES GET PRINTED");
    fileRef.getDownloadURL().then(function(url) {

        console.log("THIS LINE NEVER GETS PRINTED");
        var xhr = new XMLHttpRequest();
        xhr.responseType = 'blob';
        xhr.onload = function(event) {
            blob = xhr.response;  
        };
        xhr.open('GET', url);
        xhr.send();

    }).then(function() {
        //some more code
    }).catch(function(error) {
        console.log(error);
    });

这段代码遵循 Firebase 的文档（https://firebase.google.com/docs/storage/web/download-files），但它却无法工作。

具体而言，程序在以下行停滞：

fileRef.getDownloadURL().then(function(url) {

控制台没有错误信息，但是轮子一直在转动，整个应用程序变得无法使用。

请问有人知道从Firebase Storage检索文件的有效方法吗？

---

更新：

根据Joseph Webber的建议，我将代码的前几行更改为以下内容：

    var storage = firebase.storage();
    var id = this.idOfCurrentUser;
    var fileRef = storage.ref(`${id}/personalData.card`);

然而，问题依旧存在。

---

更新2：

根据Joseph Webber的另一个建议，我也尝试了以下操作：

var fileRef = storage.child(`${id}/personalData.card`);

然而，这会出现以下错误信息：

"Property 'child' does not exist on type 'Storage'"

---

UPDATE3:

also tried this:

var fileRef = storage.ref(this.idOfCurrentUser + "/personalData.card");

...也没有什么区别

---

附：存储规则如下：

- steady_progress

---

你的存储规则是什么样子的？ - Joseph Webber

see P.S. to my post - steady_progress

如果不使用模板字面量，它是否有效？storage.ref(this.idOfCurrentUser + '/personalData.card') 你确定路径正确（id与uid）并且文件存在吗？ - Joseph Webber

应该可以，因为这些字符都不受目录名称的限制。为了确保起见，请尝试在firestore中创建一个没有特殊字符命名的测试目录和文件，并在新的firestore引用中硬编码路径。如果这样还是不行，建议检查一下firebase环境变量以确保路径正确。 - Joseph Webber

让我们在聊天中继续这个讨论。 - Joseph Webber

Answer 1

从你的模板字符串中删除this.

var fileRef = storage.ref(`${idOfCurrentUser}/personalData.card`);

编辑

尝试将storage.ref更改为storage.child。

var fileRef = storage.child(`${id}/personalData.card`);

- Joseph Webber

---

谢谢您的评论...不过很遗憾，这并没有什么区别（请参见我的帖子更新）。 - steady_progress

谢谢您的建议 - 但它仍然不起作用...请查看UPDATE2。 - steady_progress

Answer 2

好的，我现在解决了。问题与另一个并行执行的函数中的无限循环有关。

- steady_progress

---

也许你可以要求退还你的赏金 :) - J. Doe