文件下载针对安卓系统

复制代码

<template>
  <div>
    <button @click="handleDownload">下载文件</button>

    <!-- 使用一个Dialog组件来提示用户 -->
    <el-dialog
      title="下载提示"
      :visible.sync="dialogVisible"
      width="80%"
      v-if="isMobile"
    >
      <p>检测到您在移动设备上，请选择下载方式：</p>
      <div style="display: flex; justify-content: space-around; margin-top: 20px;">
        <el-button type="primary" @click="openInBrowser">浏览器直接下载</el-button>
        <el-button type="success" @click="copyLink">复制下载链接</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false,
      fileUrl: 'https://your-domain.com/path/to/your/file.pdf',
      isMobile: false // 通过用户代理判断是否是移动设备
    };
  },
  mounted() {
    // 简单的移动设备检测
    this.isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
  },
  methods: {
    handleDownload() {
      // 如果是移动设备，显示提示对话框
      if (this.isMobile) {
        this.dialogVisible = true;
      } else {
        // 如果是PC，直接用方案二下载
        this.downloadFileDirectly();
      }
    },
    openInBrowser() {
      // 方案一：新窗口打开
      window.open(this.fileUrl, '_blank');
      this.dialogVisible = false;
    },
    copyLink() {
      // 使用现代浏览器 Clipboard API
      navigator.clipboard.writeText(this.fileUrl).then(() => {
        this.$message.success('下载链接已复制到剪贴板，请粘贴到浏览器地址栏中打开。');
      }).catch(err => {
        // 如果Clipboard API不支持，使用古老的document.execCommand方法
        const textArea = document.createElement('textarea');
        textArea.value = this.fileUrl;
        document.body.appendChild(textArea);
        textArea.select();
        document.execCommand('copy');
        document.body.removeChild(textArea);
        this.$message.success('下载链接已复制，请粘贴到浏览器中打开。');
      });
      this.dialogVisible = false;
    },
    downloadFileDirectly() {
      // 方案二的实现
      const link = document.createElement('a');
      link.href = this.fileUrl;
      link.download = '文件.pdf';
      link.style.display = 'none';
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link);
    }
  }
};
</script>

服务器配置 ：确保你的服务器为文件设置了正确的 MIME 类型（如 .apk 对应 application/vnd.android.package-archive），否则浏览器可能无法正确识别。
文件路径 ：务必使用完整的绝对URL （以 http:// 或 https:// 开头），不要使用相对路径。

文件下载 针对安卓系统

文件下载针对安卓系统