I need to make a custom web part which can download a file from a SharePoint document library. I created a web part which contains a download button. The button should download the file. Currently I am using an html anchor link tag using the download attribute. It uses the path to a file in a SharePoint document library. The anchor link tag can be structured like this:
<a href="<path to doc in SharePoint>" download> Download </a>
This works fine on the hosted workbench, but when my app is deployed to a site on SPO, it does not work fine. The first time it is clicked, it works (the url in the url box briefly changes to the file path of the doc to be downloaded, the file is downloaded and then the url changes back to the site page url). But the second time it is clicked, the url changes to the file path of the doc to be downloaded, and does not change back. Each time I click a link on the page after that, the url changes to the link, and does not execute the action. An error is shown in the console at this time: This is a problem because there will be many of these web parts on a page, and clicking each button twice to make it download is bad. Additionally, in order to refresh the page, the back button must be clicked as many times as the download buttons were clicked to have the url go back to the page url. Otherwise if the url file path still points to the doc to be downloaded and refresh button is clicked, the file is simply downloaded again, the page does not refresh (obviously).
Can some one help me come up with a solution which allows files to be downloaded from SharePoint correctly? This should not be hard to do, I just want to be able to reliably download a file with a custom web part from a SharePoint document library.