title: Download attribute in anchor tag in React component
body: <p>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 <code>test.txt</code>, during upload it gets saved as <code>7ea205f01ae5_test.txt</code>. It's important to note that I do capture and save the original file name.</p>
  
  <p>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 <code>test.txt</code> but it's not working. The file still gets downloaded as <code>7ea205f01ae5_test.txt</code>.</p>
  
  <p>This is what my React code looks like</p>
  
  <pre><code>&lt;a href={fileUrl} download={origName}&gt;{fileName}&lt;/a&gt;
  </code></pre>
  
  <p>The object that my component looks like this:</p>
  
  <pre><code>{
    id: 123,
    fileName: "7ea205f01ae5_test.txt",
    origName: "test.txt",
    fileUrl: "https://myBlobStorageUrl.com/container/7ea205f01ae5_test.txt?signature=123abcxyz"
  }
  </code></pre>
  
  <p>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.</p>
  
  <p>What do I need to do so that the file will be downloaded as <code>test.txt</code>?</p>