download a local file, on button click

Question

Hi there I'm trying to download a local file on button click in VueJs

<a href="./documentation.docx" download>Download</a>

I have the documentation in the same folder as index

But when I'm trying to download, its saying No File

Browser are not allowed to access the local file system unless the page runs in `file://` protocol. Or what do you mean by "local file"? — connexo, Apr 12 '21 at 13:42
Does this answer your question? [Local file access with JavaScript](https://stackoverflow.com/questions/371875/local-file-access-with-javascript) — Nino Filiu, Apr 12 '21 at 13:43
@connexo Yes the system doesn't allow that and By local file I mean that the document is in my assets, idk how should i say that, — Alban denica, Apr 12 '21 at 13:49
@Hard_Coder it doesn't allow to do that, it doesn't let file:// — Alban denica, Apr 12 '21 at 13:49
Of course, run your app through a webpack dev server. Also, the `local file` OP was talking about was probably in comparison vs a `hosted` resource on the web. Here, he does have the asset in his code repo. — kissu, Apr 12 '21 at 15:46
@Albandenica You can see my solution for a method that allows you to trigger a download using any element - not just an `a` tag. You can bind this method to anything with `@click` or `@click.native` — Jordan, Apr 12 '21 at 15:52

score 3 · Accepted Answer · answered Apr 12 '21 at 15:43

This should work properly as you've written it. It's essentially comes down to the given path, try something like this structure and this code (with an absolute path):

<a href="/azuki.jpg" download> download stuff </a>

Also, check the official documentation page here: https://cli.vuejs.org/guide/html-and-static-assets.html#the-public-folder

download a local file, on button click

1 Answers1