js如何判断二进制流数据的类型？

Question

刚刚有人问了我一个问题：
后端返回一个url的字符串（猜测是二进制），这个url有时候是图片、有时候是video
他想预览这个这个图像或视频，但是不知道类型是什么
所以也不知道是 用什么，什么时候用img或video标签去预览。

本人才识疏浅，暂时没有想到好的办法，想问一下，在这种情况下是否能有较好的方案进行预览，谢谢。

Answer 1

用js动态创建image对象，将url赋值给image的src属性，然后根据image对象的error和load事件判断是否加载成功，没加载成功触发error事件的话，url应该不是图片是视频

Answer 2

上面的思路都对，不过如果是自己控制的后端，这样做就是一种不负责任的做法，正确的应该是传递信息中传递一下类型，前端好处理。

这需要前端和后端沟通的，说不定是传了，只是问你的人不知道而已。如果真的没有传可以沟通来处理。

尽量少折腾开发啊，不要故意设置障碍！

因为二进制数据，除非预先知道格式，否则解析都很麻烦的。

Answer 3

可以参考如何预览以及下载pdf文件中的预览代码,response.data.type

function loadpdf() {
axios({
  method: 'get',
  url:
   'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8e76dff9-ce38-4577-9e5c-398943705060/a5b050b8-3fa1-4436-b231-7b40725de731.pdf',
  responseType: 'blob',
}).then(function (response) {
  let blob = new Blob([response.data], { type: response.data.type })
  let url = URL.createObjectURL(blob)
  document.getElementById('iframe').src = url
})
}