js下载文件三种方式_js 直接下载文件

/**
 * 二进制文件流下载
 * @param {BlobPart} data 文件流
 * @param {string} fileName 下载文件名
 */
export function downloadBlob(data, fileName) {
  const blob = new Blob([data]);
  const link = document.createElement('a');
  link.download = fileName;
  link.style.display = 'none';
  link.href = URL.createObjectURL(blob);
  link.click();
  URL.revokeObjectURL(link.href);
  document.body.removeChild(link);
}


/**
 * 文件url下载
 * @param {string} url 文件地址
 * @param {string} fileName 下载文件名
 */
export function downloadUrl(url, fileName) {
  const link = document.createElement('a');
  link.style.display = 'none';
  link.download = fileName;
  link.href = url;
  link.click();
  document.body.removeChild(link);
}


/**
 * post方式下载文件
 * @param {string} url 请求地址
 * @param {object} params 请求参数对象
 * @param {string} [method=post] 请求类型
 */
export function downloadPost(url, params = {}, method = 'post') {
  const form = document.createElement('form');
  form.style.display = 'none';
  form.action = url;
  form.method = method;
  form.target = '_blank';
  Object.keys(params).forEach(name => {
    const input = document.createElement('input');
    input.type = 'hidden';
    input.name = name;
    input.value = params[name];
    form.appendChild(input);
  });
  document.body.appendChild(form);
  form.submit();
  document.body.removeChild(form);
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55