js判断文件类型的方法有哪些,JS上传文件判断文件类型

在 JavaScript 中,可以通过 input 标签和 FileReader API 来实现上传文件并判断文件类型的功能。以下是一个简单的示例: HTML 代码:

js判断文件类型的方法有哪些,JS上传文件判断文件类型
htmlCopy code
<input type="file" id="fileInput" onchange="checkFileType()">

JavaScript 代码:

javascriptCopy code
function checkFileType() {
  // 获取文件输入框元素
  var fileInput = document.getElementById("fileInput");
  // 获取文件对象
  var file = fileInput.files[0];
  // 创建 FileReader 对象
  var reader = new FileReader();
  // 读取文件
  reader.readAsArrayBuffer(file);
  // 文件读取完成时触发
  reader.onloadend = function() {
    // 获取文件的类型
    var type = getFileType(new Uint8Array(reader.result));
    // 判断文件类型
    if (type === "pdf") {
      console.log("文件类型为 PDF");
    } else if (type === "jpg" || type === "jpeg") {
      console.log("文件类型为 JPG/JPEG");
    } else if (type === "png") {
      console.log("文件类型为 PNG");
    } else {
      console.log("文件类型不支持");
    }
  };
}
function getFileType(bytes) {
  // 根据文件头判断文件类型
  if (bytes[0] === 0x25 && bytes[1] === 0x50 && bytes[2] === 0x44 && bytes[3] === 0x46) {
    return "pdf";
  } else if (bytes[0] === 0xff && bytes[1] === 0xd8) {
    return "jpg";
  } else if (bytes[0] === 0x89 && bytes[1] === 0x50 && bytes[2] === 0x4e && bytes[3] === 0x47) {
    return "png";
  } else {
    return "unknown";
  }
}

以上代码中,checkFileType 函数用于获取文件对象并读取文件内容,通过调用 getFileType 函数判断文件类型,并根据文件类型进行相应的处理。getFileType 函数根据文件头信息判断文件类型,目前支持判断 PDF、JPG/JPEG 和 PNG 文件类型。需要注意的是,这种方式只能判断文件类型是否符合要求,但并不能保证文件内容的安全性,还需要进行其他安全性检查。

版权声明:【js判断文件类型的方法有哪些,JS上传文件判断文件类型】版权归原作者所有,本文由作者:【隔壁老王】用户自发贡献上传,该文观点仅代表作者本人,本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任,如发现本站有涉嫌抄袭侵权/违法违规的内容,请发送邮件至举报,一经查实,本站将立刻删除,如若转载,请注明出处:https://www.intostarry.com/jrzy/437.html

(0)
上一篇 2023年10月31日 22:01:52
下一篇 2023年11月1日 14:45:54

相关推荐

发表回复

登录后才能评论