Electron应用中锚点标签无法下载本地文件系统XML文件问题

你当前的实现不生效是因为Electron渲染进程中，原生<a>标签的download属性仅对http/https、blob等协议的资源生效，指向本地file://协议的路径会被Chromium内核判定为本地资源访问，不会触发下载流程，因此既不会产生网络请求，也不会执行文件写入操作。

方案一：通过Electron原生API实现（最稳定，推荐） #

通过主进程的文件对话框和文件读写能力完成本地文件复制，不需要走浏览器下载逻辑，适配所有本地文件场景。

步骤1：修改模板代码，替换原a标签的跳转逻辑 #

<a
  class="custom-button-primary big px-3 py-2"
  style="text-decoration: none;"
  @click="handleDownload"
  >Download file</a>

步骤2：预加载脚本暴露主进程API #

在preload.js中声明需要暴露给渲染层的能力，避免开启不安全的node集成：

const { contextBridge, ipcRenderer } = require('electron')
contextBridge.exposeInMainWorld('electronAPI', {
  showSaveDialog: (options) => ipcRenderer.invoke('show-save-dialog', options),
  copyLocalFile: (sourcePath, targetPath) => ipcRenderer.invoke('copy-local-file', sourcePath, targetPath)
})

步骤3：主进程注册对应逻辑处理 #

const { ipcMain, dialog } = require('electron')
const fs = require('fs/promises')

// 调出保存文件选择框
ipcMain.handle('show-save-dialog', async (_, options) => {
  const { filePath } = await dialog.showSaveDialog({
    defaultPath: 'saft.xml',
    filters: [{ name: 'XML 文件', extensions: ['xml'] }],
    ...options
  })
  return filePath
})

// 复制本地文件到目标路径
ipcMain.handle('copy-local-file', async (_, sourcePath, targetPath) => {
  await fs.copyFile(sourcePath, targetPath)
  return true
})

步骤4：渲染层实现点击下载逻辑 #

const handleDownload = async () => {
  // 你本地临时文件夹中的XML文件路径
  const sourceXmlPath = filePath
  // 调出保存路径选择框
  const savePath = await window.electronAPI.showSaveDialog()
  if (!savePath) return
  // 执行文件复制
  await window.electronAPI.copyLocalFile(sourceXmlPath, savePath)
  // 可自行添加成功/失败提示
}

方案二：转Blob URL触发浏览器下载（轻量方案） #

如果不想修改主进程和预加载脚本，也可以把本地文件内容读取为Blob生成临时URL，再用a标签触发下载：

const handleDownload = async () => {
  // 读取临时文件夹XML文件内容，此处如果渲染层无fs权限，需要预加载暴露读文件接口
  const xmlContent = await fs.readFile(filePath, 'utf-8')
  // 生成Blob对象
  const xmlBlob = new Blob([xmlContent], { type: 'application/xml' })
  const blobUrl = URL.createObjectURL(xmlBlob)
  // 触发下载
  const tempLink = document.createElement('a')
  tempLink.href = blobUrl
  tempLink.download = 'saft.xml'
  tempLink.click()
  // 释放内存
  URL.revokeObjectURL(blobUrl)
}

内容的提问来源于stack exchange，提问作者Paul