0

I have a curious error while i try to download an apk file with a website in vue :

Based on How to download a locally stored file in VueJS, i try to download a local file with this command :

<a href="../../app-debug.apk" download="client.apk">Download</a>

But no matter what i put in href, the file download is always this file : 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="/favicon.ico">
    <title>client_web</title>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
  <link href="/js/app.js" rel="preload" as="script"><link href="/js/chunk-vendors.js" rel="preload" as="script"></head>
  <body>
    <noscript>
      <strong>We're sorry but client_web doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  <script type="text/javascript" src="/js/chunk-vendors.js"></script><script type="text/javascript" src="/js/app.js"></script></body>
</html>

I don't understand where this file come from, and how to make my link download the apk file.

Edit: vue.config.js

  "transpileDependencies": [
    "vuetify"
  ],
  chainWebpack: config => {
    config.module
      .rule('apk')
      .test(/\.(apk)$/)
      .use('apk-loader')
      .loader('apk-loader')
      .end();
  }
}

Directory Tree: 

│  └──views
│     └──APKDownload.vue
└──app-debug.apk```
incubus
  • 1
  • 2
  • Would you try changing this part download="client.apk" to just download? – Petar Nikov Feb 25 '20 at 09:04
  • I try and it change nothing, the file download still the same – incubus Feb 25 '20 at 09:26
  • In the accepted answer of the link you reference, they use file-loader, are you using that? Could you share the relevant parts of your webpack.config.js? – Shoejep Feb 25 '20 at 10:11
  • @Shoejep Yes, i have try to use the apk-loader. This is my `vue.config.js` : ```module.exports = { "transpileDependencies": [ "vuetify" ], chainWebpack: config => { config.module .rule('apk') .test(/\.(apk)$/) .use('apk-loader') .loader('apk-loader') .end(); } }``` – incubus Feb 25 '20 at 14:10

1 Answers1

1

There could be 2 problems:

  1. Server does not allows you to download '.apk' files.
  2. There is a path problem. The fastest way to check it is in DevTools/Network, what url is used to download file as you use ../../app-debug.apk.
Darius
  • 1,060
  • 2
  • 6
  • 17
  • I just try to run it on localhost from a docker, so i don't see what permission is missing. And i am sure that the link is good, i have try with other kind of files and other path, i still have the same html file download. – incubus Feb 25 '20 at 14:23
  • can you give the path of your web page, what path is showing in DevTools on download? have you tried that path in browser directly e.x. `http://localhost:3000/webpagepath/../../app-debug.apk`? – Darius Feb 25 '20 at 14:33
  • When i use the path `http://localhost:8081/client.apk/../../app-debug.apk`, i get the html page that is download, but in my `client_web` folder i have this : ```├──src │ └──views │ └──APKDownload.vue └──app-debug.apk``` So the apk file is located ``../../app-debug.apk`` from the vue file – incubus Feb 25 '20 at 14:53
  • It is server issue, and is not directly related to vue directory/files. Normally `src` directory is not allowed to access from outside as it can compromise your security. You try to download: `http://localhost:8081/app-debug.apk` which is not acsessible. Place apk file in public space, or let it webpack decide: `const apkPath = require('../../app-debug.apk'); export default { data() ({apkPath: apkPath});` and template `Download` – Darius Feb 25 '20 at 15:30
  • I think it work, now it try to access to the file apk,but I got another error where they say that the apk-loader is not à loader. I will do more research, thanks a lot. – incubus Feb 26 '20 at 00:46