I store files in the cloud so during the upload process they get prefixes that make their names unique. For example, if I upload a file named test.txt
, during upload it gets saved as 7ea205f01ae5_test.txt
. It's important to note that I do capture and save the original file name.
In my React component, I'm trying to make it user friendly by using the download attribute so that when the user clicks to download the file, it'll be downloaded as test.txt
but it's not working. The file still gets downloaded as 7ea205f01ae5_test.txt
.
This is what my React code looks like
<a href={fileUrl} download={origName}>{fileName}</a>
The object that my component looks like this:
{
id: 123,
fileName: "7ea205f01ae5_test.txt",
origName: "test.txt",
fileUrl: "https://myBlobStorageUrl.com/container/7ea205f01ae5_test.txt?signature=123abcxyz"
}
Please note that the fileUrl contains a security access signature which allows user to access the file. Without it, user won't be given access to the file.
What do I need to do so that the file will be downloaded as test.txt
?