在React組件中下載錨標記中的屬性

我將文件存儲在雲中，因此在上傳過程中他們獲取使其名稱唯一的前綴。例如，如果我上傳一個名爲test.txt的文件，在上傳期間它將被保存爲7ea205f01ae5_test.txt。請注意，我確實捕獲並保存了原始文件名。在React組件中下載錨標記中的屬性

在我的React組件中，我試圖通過使用下載屬性使用戶友好，以便當用戶點擊下載文件時，它將被下載爲test.txt，但它不起作用。該文件仍然被下載爲7ea205f01ae5_test.txt。

這是我的陣營代碼看起來像

<a href={fileUrl} download={origName}>{fileName}</a>

，我的組件看起來像這樣的對象：

{ 
    id: 123, 
    fileName: "7ea205f01ae5_test.txt", 
    origName: "test.txt", 
    fileUrl: "https://myBlobStorageUrl.com/container/7ea205f01ae5_test.txt?signature=123abcxyz" 
}

請注意，指定fileurl包含安全訪問簽名允許用戶訪問文件。沒有它，用戶將無法訪問該文件。

我需要怎麼做才能使文件下載爲test.txt？

來源

2017-02-16 Sam

這是反應問題。下載屬性顯然不適用於交叉原點鏈接。 – DroidNoob

正如DroidNoob提到的那樣，這不是React的特別之處。任何跨源鏈接將與服務器一起下載給定的文件名和擴展名，但download屬性將適用於同一來源。

// Domain: example.org 

// Downloads as 281c2df7dbce9284dca6059db944f8df.png 
<a download="foo.txt" target="_blank" href="https://www.gravatar.com/avatar/281c2df7dbce9284dca6059db944f8df?s=48&d=identicon&r=PG">download</a> 

// Downloads as foo.txt 
<a download="foo.txt" target="_blank" href="http://example.org/assets/avatar.png">download</a>

根據您的後端，您可以設置一個通用映射原始名稱到實際文件名的路徑。所以前端鏈接到您的後端映射器，然後輪流抓取文件。

來源

2017-02-16 06:12:50 Chris

在React組件中下載錨標記中的屬性

回答

相關問題