如何使用google-cloud-storage让公众用户下载伤害申请表

Question

单击该按钮时，当我通过localhost运行此程序时，它不会导致下载。我不知道为什么。

我想要的是在反应的HTML方面的按钮，以导致下载docx文件“伤害表单”

从“React”导入react；从“firebase”导入firebase；

const Documents = () =>{


    var storage = firebase.storage();
    var docsRef = storage.ref('Documents/Injury form.docx');

    const Download = () => { 

        docsRef.getDownloadURL().then(function(url) {
        }).catch(function(error) {
            switch (error.code) {
                case 'storage/object-not-found':
                  // File doesn't exist
                  break;

                case 'storage/unauthorized':
                  // User doesn't have permission to access the object
                  break;

                case 'storage/canceled':
                  // User canceled the upload
                  break;


                case 'storage/unknown':
                  // Unknown error occurred, inspect the server response
                  break;
              }
            });

            }
return (
    <div>
        <button onClick={Download}>yoooo</button>d        
    </div>
)
}

export default Documents

我还配置了跨域访问(CORS)的云存储桶。如下所述：https://firebase.google.com/docs/storage/web/download-files#cors_configuration

Answer 1

该功能不会激活下载。它会创建一个指向下载URL的链接。

您需要在函数中放入一个变量，以便与通过它传递的URL相等。在本例中，是通过useState()钩子完成的。

 const [download, setDownload] = useState("blank");

        var storage = firebase.storage();
        var docsRef = storage.ref('Documents/Injury form.docx');

    docsRef.getDownloadURL().then(function(url) {
        setDownload(
            url
        )

    })

然后把这个传递给

<a href={download}>the link to download it

​

如果使用的方法不起作用，您可以转到firebase控制台并右键单击上传到存储区域的文件。从那里获取要下载的URL并创建一个

<a href="<your URL>"> Button </a> 

这将创建一个链接或按钮来激活下载。

在这种情况下，允许用户下载phisio网站的伤害表格。