chooseImage 這個(gè)API在小程序端并無(wú)太大的問題，相信看著文檔各位小伙伴都能擼出來并和后臺(tái)對(duì)接好，這篇文章只是為了解決h5端的問題：
h5端的chooseImage拿到的圖片數(shù)據(jù)是以blob開頭的數(shù)據(jù)格式，然而這并不是我們想要的，即便丟到后端也無(wú)法對(duì)接；因此我在網(wǎng)上找了很多解決這個(gè)問題的辦法，然而并沒有清晰的描述的，唯有看到一篇文章：
這篇文章為我解除疑惑，但是我想完善一點(diǎn)這篇文章，所以我就厚臉皮的把它轉(zhuǎn)變?yōu)槲业脑瓌?chuàng)，哈哈哈?。?！
廢話不多說，上代碼。。。
Taro.chooseImage({count: 9}).then(res => {
console.log(res) //這里我們拿到的是blob格式的圖片數(shù)據(jù)，但這不是真正的blob格式數(shù)據(jù)，我們需要將數(shù)據(jù)fetch一下
fetch(res.tempFilePaths[0]).then(fetchRes => {
return fetchRes.blob();
}).then(data => {
let reader = new FileReader();
reader.onloadend = () => {
tempFilePaths[i] = reader.result; //這里得到base64的圖片格式
};
reader.readAsDataURL(data); //base64的圖片格式是通過這個(gè)方法去得到的，如果傳入的不是真正的blob格式的數(shù)據(jù)進(jìn)去會(huì)報(bào)錯(cuò)的，所以要特別注意傳入的格式是否blob格式
})
})
eader.readAsDataURL(data); //base64的圖片格式是通過這個(gè)方法去得到的，如果傳入的不是真正的blob格式的數(shù)據(jù)進(jìn)去會(huì)報(bào)錯(cuò)的，所以要特別注意傳入的格式是否blob格式
到了這里大部分人應(yīng)該就沒問題了，前提是后端愿意接受base64的數(shù)據(jù)格式，然而base64數(shù)據(jù)格式和小程序獲取到的http格式是完全不一樣的，如果你的后端不愿意做兼容，那么h5端還是沒法繼續(xù)跑下去，要如何將blob轉(zhuǎn)為http格式，目前我也還在探索中，希望有知道的小伙伴可以留言告知一下，讓我把這部分補(bǔ)充完整，到了這里這篇文章基本就結(jié)束了， 但是為了文章的完整性，我決定還是補(bǔ)上 轉(zhuǎn)blob的API，不多就幾句代碼而已：
fetch(res.tempFilePaths[0]).then(fetchRes => {
return fetchRes.blob();
}).then(data => {
let reader = new FileReader();
reader.onloadend = () => {
tempFilePaths[i] = reader.result;
//兼容:mozilla(firefox)||webkit or chrome
letwindowURL = window.URL || window.webkitURL;
//createObjectURL創(chuàng)建一個(gè)指向該參數(shù)對(duì)象(圖片)的URL
let dataURL = windowURL.createObjectURL(data);
};
reader.readAsDataURL(data)
})
這段代碼是blob轉(zhuǎn)base64后再重新轉(zhuǎn)回blob，而實(shí)現(xiàn)這個(gè)功能是由window.URL.createObjectURL()這個(gè)API實(shí)現(xiàn)的。
好了，到此就結(jié)束了，如果上文有錯(cuò)誤之處，請(qǐng)留言指明，感謝萬(wàn)分
如果此文對(duì)你有用請(qǐng)動(dòng)動(dòng)你的小手點(diǎn)個(gè)贊！謝謝?。?！
