记录关于图片上传的问题

最近 PM 新提的需求，需要支持 heic/heif/pdf 文件上传与预览，踩了一些坑，这里做一个小结。

pdf 相关问题

pdf 文件采用 window.open 打开的时候有的时候是直接跳转到新标签打开，有的时候是直接下载，经过了一番检索，得知只有访问文件链接返回的响应头的 mime type 为 application/pdf 时，浏览器才会识别其为 pdf 并通过新标签打开。

所以让后端同学改一下返回的响应头完事。

heic/heif 相关问题

heic/heif 文件在 window 系统中通过 FileReader 读取到的文件属性为空，在 mac 系统中读取正常为 image/heic 或者 image/heif。

可能是个 bug 只能 hack 一下解决了。

其他

另外还学到了可以直接用 require/import 本地图片，编译时会直接转化为 base64，原先以为是不能将 React Dom 赋予对象的项的，不过这种方式是可以的。

相关

Why do HEIC/HEIF files have a blank file type in a FileList?

打个广告，写了个网站，欢迎想要找副业的程序员或者找人做项目的雇主入驻～
斜杠青年｜自由职业者