前端根据url下载文件

前端从URL下载文件通常涉及浏览器的JavaScript API，主要有`fetch`、`XMLHttpRequest`（XHR）以及`Blob` 和 `URL.createObjectURL` 等技术。以下是基本步骤：

1. 使用 `fetch` 或 `XMLHttpRequest` 发送一个HTTP请求到指定的URL，这通常是GET请求：

// fetch
fetch('https://example.com/file.txt')
  .then(response => {
    if (!response.ok) {
      throw new Error('Network response was not ok');
    }
    return response.blob(); // 对于fetch，直接返回blob
  })
  .then(blob => {
    const url = URL.createObjectURL(blob);
    // 创建一个a标签或者创建一个新的下载链接
    const downloadLink = document.createElement('a');
    downloadLink.href = url;
    downloadLink.download = 'file.txt'; // 设置下载文件名
    document.body.appendChild(downloadLink); // 添加到文档以便触发下载
    downloadLink.click();
  })
  .catch(error => {
    console.error('Error downloading:', error);
  });

// XMLHttpRequest (for legacy browsers)
const xhr = new XMLHttpRequest();
xhr.open('GET', 'https://example.com/file.txt');
xhr.responseType = 'blob';
xhr.onload = function() {
  if (xhr.status === 200) {
    const url = URL.createObjectURL(xhr.response);
    // 同样创建下载链接并点击下载
  } else {
    console.error('Error downloading');
  }
};
xhr.send();

2. 注意`createObjectURL()`会生成一个临时URL，允许你在页面上展示文件，但当页面关闭或刷新时这个URL将失效，所以你需要在用户完成下载后清理。