描述

根据 http url 下载远程文件到本地，返回类型是 promise
如果发现兼容性问题，请用 file-saver (opens new window)

1.示例

下载远程图片 POST方式下载远程图片

<template>
  <div>
    <el-button @click="onClick">下载远程图片</el-button>
    <el-button @click="onClick2">POST方式下载远程图片</el-button>
  </div>
</template>

<script>
import { downloadFile } from 'sf-utils2'
const url = 'https://info.compassedu.hk/ad/225/1637553399694.png?imageView2/3/q/100|imageslim'
export default {
  methods: {
    async onClick() {
      await downloadFile({ url, filename: `${Date.now()}.png` })
      this.$message.success('下载成功')
    },

    async onClick2() {
      await downloadFile({ url, filename: `POST方式-${Date.now()}.png`, method: 'POST', data: {} })
      this.$message.success('POST方式下载成功')
    }
  }
}
</script>

显示代码 复制代码 复制代码

2.入参说明

参数	说明	类型	是否必填	默认值
url	http 链接地址	String	是
filename	文件名（记得要带上拓展名）	String	是
method	请求方式，可选值：GET、POST、DELETE、PUT	String	是	GET
headers	请求头	object 、undefined	否	undefined
data	请求实体	object、undefined	否	undefined

3.源码

源码，点开查看 👈

import getHttpBlob from './getHttpBlob'
import blobSaveAs from './blobSaveAs'

/**
 * 下载文件
 * @param {string} url
 * @param {string} filename
 * @param {string} method
 * @param {object} headers
 * @param {object} data
 */
async function downloadFile({ url, filename = '', method = 'GET', headers = undefined, data = undefined }) {
  const blob = await getHttpBlob(url, { method, headers, data })
  blobSaveAs(blob, filename)
}

export default downloadFile