JS fetch检查文件是否存在而不下载内容

JS fetch是一种用于发送HTTP请求的现代浏览器API。它可以用于检查文件是否存在而不下载文件内容。具体实现方法如下：

使用fetch函数发送HEAD请求，而不是常见的GET请求。HEAD请求只返回响应头信息，而不返回实际的文件内容。

fetch(url, { method: 'HEAD' })
  .then(response => {
    if (response.ok) {
      console.log('文件存在');
    } else {
      console.log('文件不存在');
    }
  })
  .catch(error => {
    console.log('请求出错', error);
  });

在响应返回后，通过检查状态码来判断文件是否存在。常见的状态码有200表示文件存在，404表示文件不存在。

fetch(url, { method: 'HEAD' })
  .then(response => {
    if (response.status === 200) {
      console.log('文件存在');
    } else if (response.status === 404) {
      console.log('文件不存在');
    } else {
      console.log('请求出错，状态码：', response.status);
    }
  })
  .catch(error => {
    console.log('请求出错', error);
  });

如果需要检查多个文件是否存在，可以使用Promise.all方法同时发送多个HEAD请求，并在所有请求返回后进行处理。

const urls = ['url1', 'url2', 'url3'];

Promise.all(urls.map(url => fetch(url, { method: 'HEAD' })))
  .then(responses => {
    responses.forEach((response, index) => {
      if (response.status === 200) {
        console.log(`文件${index + 1}存在`);
      } else if (response.status === 404) {
        console.log(`文件${index + 1}不存在`);
      } else {
        console.log(`文件${index + 1}请求出错，状态码：`, response.status);
      }
    });
  })
  .catch(error => {
    console.log('请求出错', error);
  });

这种方法可以有效地检查文件是否存在而不下载文件内容，适用于需要快速判断文件是否存在的场景，例如在文件列表中显示文件的存在状态、在下载前检查文件是否可用等。

腾讯云相关产品推荐：