reactjs 为什么我的下载按钮没有任何作用？Firebase，React

guykilcj 于 2022-11-29 发布在 React

关注(0)|答案(2)|浏览(174)

我正在使用firebase documentation下载与firestore中的一个文档相关的文件。我实际上是粘贴了代码来实现这一点的，但是当我单击该元素时，控制台上没有显示任何内容。

import { ref, getDownloadURL } from 'firebase/storage'

export const downloadMethod = (path) => {
    getDownloadURL(ref(storage, path))
        .then(url => {
            const xhr = new XMLHttpRequest();
            xhr.responseType = 'blob';
            xhr.onload = (event) => {
                const blob = xhr.response;
            };
            xhr.open('GET', url);
            xhr.send();
        })
        .catch(error => {
            throw error
        })
}

在此之前，我有cors错误，但我解决了它使用

[
  {
    "origin": ["*"],
    "method": ["GET"],
    "maxAgeSeconds": 3600
  }
]

我希望网站在我点击按钮时下载请求的文件。

reactjs

来源：https://stackoverflow.com/questions/74584045/why-my-download-button-is-not-doing-anything-firebase-react

2条答案

按热度按时间

omqzjyyz1#

我猜您缺少对存储的引用

import { getStorage, ref, getDownloadURL } from "firebase/storage";
const storage = getStorage();
...

赞(0）回复(0）举报 2022-11-29

gev0vcfq2#

由于文档中的示例不起作用，所以我在文档中查找了其他方法，并通过使用getBlob()成功地完成了所需的操作
这是我的最后一个函数：

import { ref, getBlob } from 'firebase/storage'
import { storage } from '../firebase/firebase.config'

getBlob(ref(storage, 'files/MyFile.pdf'))
        .then((blob) => {
            const href = URL.createObjectURL(blob)
            const a = Object.assign(document.createElement('a'), {
                href,
                style: 'display:none',
                download: 'myFile.pdf' // This is where you set the name of the file you're about to download
            })
            a.click()

            URL.revokeObjectURL(href)
            a.remove()
        }).catch((error)=>{
            console.error(error)
        })

如果你觉得我能改变什么你可以告诉我

赞(0）回复(0）举报 2022-11-29

我来回答

reactjs 为什么我的下载按钮没有任何作用？Firebase，React

2条答案

相关问题

热门标签

最新问答