[英]How can I convert image buffer to string base64?
我正在使用 Filepond 庫將圖像上傳到使用 ZCCADCDEDB567ABAE643E15DCF0974E503Z 的 MongoDB。 我想使用彈出功能在地圖的標記中顯示圖像。 圖片我正在恢復格式
{ location:
{ type: 'Point',
coordinates: [ -86.34164, 39.81514 ],
formattedAddress: 'Lucas Oil Raceway, Brownsburg, IN 46234, US' },
_id: 5f10a1867435d3f048a14acc,
storeId: '009',
dateCompleted: 2020-07-01T04:00:00.000Z,
description:
' setup datguard. backups, flashack logs and monitoring',
createdAt: 2020-07-16T18:50:46.997Z,
storeImage:
Binary {
_bsontype: 'Binary',
sub_type: 0,
position: 3569671,
buffer:
<Buffer ff d8 ff e0 00 10 4a....
storeImageType: 'image/jpeg',
__v: 0 }
我能夠顯示除圖像之外的屬性的 rest。 有沒有辦法可以將此圖像緩沖區轉換為字符串,然后設置為 map 屬性。
stores = data.data.map(store => {
return {
type: 'Feature',
geometry: {
type: 'Point',
coordinates: [
store.location.coordinates[0],
store.location.coordinates[1]
]
},
properties: {
storeId: store.storeId,
dateCompleted: store.dateCompleted,
description: store.description,
image:`data:${store.storeImageType};charset=utf-8;base64,${store.storeImage.data.toString('base64')}`,
##with this i see image content as "data:image/jpeg;charset=utf;base64,233,4444,555,67 icon: 'shop' } }; });
function setMarkers(stores) {
//add markers to the map
stores.forEach(function (marker) {
// create a HTML element for each feature
var el = document.createElement('div-marker');
el.className = 'marker';
// make a marker for each feature and add to the map
var mkr = new mapboxgl.Marker(el)
.setLngLat(marker.geometry.coordinates)
.setPopup(new mapboxgl.Popup({
offset: 25
}) // add popups this is where i need to set image
.setHTML("<img src='" + marker.properties.image + "' width='160' />"))
.addTo(map);
mkrs.push(mkr);
});
}
所有這些代碼都在使用 NodeJS Express 的公共 javascript 文件夾中。
從您發布的格式來看,圖像緩沖區似乎位於store.storeImage.buffer
中。 storeImage.data
必須是一個將其轉換為其他東西的getter - 從它的外觀來看,可能是一個數組?
嘗試使用store.storeImage.buffer.toString('base64')
- 將'base64'
傳遞給toString
是緩沖區的一個特性,其他類型的處理方式不同。
編輯:顯然store.storeImage
本身就是緩沖區。 所以你應該簡單地使用store.storeImage.toString('base64')
編輯:盡管實際上並未提供 node.js 緩沖區 object,但顯然它將自己描述為緩沖區。 我建議將數組轉換為緩沖區,然后編碼為 base64: Buffer.from(store.storeImage.data).toString('base64')
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.