前端实现下载图片、PDF文件功能

前端实现下载图片、PDF文件功能

直接上代码
下面展示一些 内联代码片。
接口展示:js调用的接口vue项目

export function documentdownload(query) {
  return request({
    url: '/cust/user/fileDownload',
    method: 'get',
    responseType:'blob',
    params: query
  })
}

/**
 * 参数一:文件名称
 * 参数：对象格式的地址
 */
downloadimg(intercept, obj) {
  documentdownload(obj).then((res) => {
    //创建url
    let url = window.URL.createObjectURL(res);
    //创建a标签 并设置属性
    let link = document.createElement("a");
    // link.style.display = 'none'
    link.href = url;
    link.setAttribute(
      "download",
      //下面是文件名字拼接
      this.form.custName + this.formatDate(new Date()) + "." + intercept[1]
    );
    //添加a标签
    document.body.appendChild(link);
    //执行下载
    link.click();
    //释放url对象
    URL.revokeObjectURL(link.href);
    //释放a标签
    document.body.removeChild(link);
  });
},