Javascript 下载带有服务器节点和vue.js的pdf

我有个问题。我必须创建一个与服务器下载pdf的链接，但当点击链接的文件没有下载

重要的是不要在客户端公开PDF链接，而是从服务器下载文件

请帮帮我

在前面，我把它弄坏了

    <div class="historyNavBtns">
      <a
        v-if="isLoggedIn"
        href="/tutorial"
        @click="goLinkTutorial"
      >
        <fa-icon
          class="btn bg-blue"
          icon="info-circle"
        />
      </a>

在api.js中

export async function getLinkTutorial () {
  console.log('test')
  const response = await apiClient.get('/tutorial')
  return response.data
}

途中

router.get('/', getTutorial)

内部控制器

import { techLogger } from '../util/logger.js'

export const getTutorial = (req, res) => {
  try {
    res.type('application/pdf').download(new URL('../upload-folder/tutorial.pdf', import.meta.url).pathname, 'tutorial.pdf')
  } catch (error) {
    techLogger.info(error)
  }
}

---

您不应通过axios（或ApicClient）获取下载的文档，而应创建指向该文档的链接并单击它：

    <div class="historyNavBtns">
      <a
        v-if="isLoggedIn"
        href="/tutorial"
        download="tutorial.pdf"
      >
        <fa-icon
          class="btn bg-blue"
          icon="info-circle"
        />
      </a>

---

谢谢，重要的是不要在客户端公开PDF链接，而是要从服务器下载文件以防安全问题。当然，你不需要。您可以以这种或那种方式向客户机公开/tutorial，但不应将请求初始化为XHR请求，而应通知浏览器启动下载尝试。

    <div class="historyNavBtns">
      <a
        v-if="isLoggedIn"
        href="/tutorial"
        download="tutorial.pdf"
      >
        <fa-icon
          class="btn bg-blue"
          icon="info-circle"
        />
      </a>

export async function getLinkTutorial () {
  console.log('test')
  //const response = await apiClient.get('/tutorial')
  //return response.data
  var link = document.createElement('a');
  link.href = '/tutorial';
  link.setAttribute('download', 'tutorial.pdf');
  document.body.appendChild(link);
  link.click();
}