vue3+tiff.js展示tif檔案
場景：tif格式的檔案需要在頁面上預覽（預覽的tif檔案較小）
組件：tiff.js
npm install tiff.js
組件引入：
import 'tiff.js';
注意：網路上的資訊引入使用import Tiff from 'tiff.js' 但是實際測驗這樣會報錯：
看原始碼發現只需要直接import即可獲取到Tiff物件
代碼：
async function getTiffDataUrlHandler() { await axios.get('../../../public/1.tiff', { responseType: 'blob' }).then((res) => { res.data.arrayBuffer().then((arrayBuffer) => { const tiff = new Tiff({ buffer: arrayBuffer, }); //轉成png格式的base64圖片，將其用img標簽展示即可 console.log(tiff.toDataURL("image/png")) }) }); }
注意：
1.由于tiff檔案格式瀏覽器不能直接識別，所以需要通過ajax獲取到檔案流blob，然后使用tiff.js將其轉換為base64格式
2.現實使用中，遇見的檔案格式后綴為.jpg，實際檔案為tif格式導致不能展示，所以以上方法可以直接將.jpg后綴的tif格式檔案進行轉換，
3..jpg后綴的tif格式檔案直接用ps打開會報錯，但是后綴改為.tiff即可編輯，
測驗檔案：
https://files.cnblogs.com/files/s313139232/tif%E5%89%8D%E7%AB%AF%E5%8A%A0%E8%BD%BD_%E6%B5%8B%E8%AF%95%E6%96%87%E4%BB%B6.zip?t=1688455935&download=true
鉆研不易，轉載請注明出處，，，，，，
翻譯
搜索
復制
<iframe></iframe>轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/556611.html
標籤：其他
下一篇：返回列表