JavaScript文件下载不跳标签页。支持get、post

最新推荐文章于 2024-02-06 09:30:00 发布

原创最新推荐文章于 2024-02-06 09:30:00 发布 · 1.3w 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#js #javascript #文件下载

js 专栏收录该内容

9 篇文章

订阅专栏

本文介绍了一种使用HTML表单提交方式实现文件下载的方法，通过创建隐藏的iframe和form元素，结合JavaScript动态设置参数，实现跨域文件的下载功能。

利用表单提交方式，

downloadFile(url, method, params) {
  if (!document.getElementById("myIframe")) {
    let iframe = document.createElement('iframe');
    iframe.id = "myIframe";
    iframe.name = "myIframe";
    iframe.style = "display:none";
    document.body.appendChild(iframe);
  }
  let form = document.createElement('form');
  form.target = "myIframe";
  document.body.appendChild(form);
  for (let obj in params) {
    if (Object.prototype.hasOwnProperty.call(params, obj)) {
      let input = document.createElement('input');
      input.tpye = 'hidden';
      input.name = obj;
      input.value = params[obj];
      form.appendChild(input);
    }
  }
  form.method = method == null ? "GET" : method;
  form.action = url;
  form.submit();
  document.body.removeChild(form);
}