【问题标题】:Converting base64 to image file (jpeg, jpg)将base64转换为图像文件(jpeg、jpg)
【发布时间】:2019-03-21 04:27:13
【问题描述】:
所以我通过套接字发送图像文件,我在发送之前将文件编码为 base64。
发送图片:
const img = cv.imencode('.jpg', frame).toString('base64');
ws.send(img);
现在在插座的另一边,当我收到图像并尝试显示它时,图像似乎坏了。有谁知道我需要做什么才能将其转换回常规图像文件(jpg、jpeg 等)?
接收图像:
incomingImage = event.data.toString('base64');
IMAGE_SAMPLES.push(incomingImage);
【问题讨论】:
标签:
javascript
node.js
image
base64
【解决方案1】:
我不会做所有事情。但是,当您拥有 base64 数据时,您可以将 base64 数据设置为 <img> 标记的 src 属性。
var imgData = [{"imgURL" : "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3N//AABEIAGAAYAMBIgACEQEDEQH/xAAcAAEAAQUBAQAAAAAAAAAAAAAACAMEBQYHAQL/xAA7EAABAwMCAwMICAYDAAAAAAABAAIDBAURBhITITEHQVEUIlRhcXSUshYXMzVikbHRI1JVcoGhFTI0/8QAFAEBAAAAAAAAAAAAAAAAAAAAAP/EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/AO4oiICIiAiIgIiICIiAiIgIiICLxzgxpc4gNAySTyAWN+kNk/rFu+KZ+6ClqvUFJpiyT3Sta97I8NZHGPOkeeQaP3WjR2XWerqKlv8AS6xNtZWxNljoYIHBkLTzA3B3nHxJHP2cl8dt90t9bo+GKiuFLO8V0biyGZrjja/uB9iz3ZzfbTFoeyQ1F0oopo6RjHxvqGNc0jlzBPJBhm1+oezqWkn1bfWXi01tQKdz+GWyUrtrjv8AxNw05GfWPA9NY9sjGvY4Oa4ZBByCFyLt6ulFW6ftkNFWU9Q7y3e7gytfgCN47j+JdC01dKH6O2sSV1MHijh3AzNyDsGe9BnUVtHcaGR4ZHWU7nOOA1srST/tXKAiIgIioSVG2QjHRBTuxxa6w+ED/lKiFC1vAZyH/UfopaXWcutlY04A4EmT6tpUd6bRTxGfKK4bA1zGPZGeTgcNJz1HIkgfn1wGrBo7gAvNozkjJWzx6OqeXFq4o8lrWkxuIcXcMDB7xulAz+Eq9s2gZLla6OufcxTGpaTwX0pJYRuyD5w/ld3eHjyDTNo7hhfHBiJJMbCT3lq6BN2by0vAfPcd7HSMbI1sGzzS4NO1xJyefeFj5NGOfHSvpagtMn2geNw6OPmnAycN6deaDG6EYxutrEQxoIrosED8QUqlHzTWkZaDVlmnFQHCCaN8wLTzc0s3bOmW5d/hd8dUtDsAZ9eUFdFQbUBzg3b19aroC+XMa8YcMr6RBZXhoForuQ/88nylRFjcTG05PTxUur19z13u8nylREi+yZ/aEGStNvfcjXhk/C8joJq05bu38PB29RjOevPHgt00hBcG6bgraOuo2z8KbgU09M92WRTYe4vDwAc1JAG08sd/Na/oSmnray90tJE6aomsdWyONgyXOOwABbnpa31dDpinNbTvgFJDXw1Jk5cJ7qimLWu8CQCQgpX6xvvdRDR1F/o201E6RglgoH74pOO2nMZYZScFxb5xPRufFc1roH0VfVUkj976ad8JcOhLXFpI/JdrqbdUuuEsHkbRXyzSzFjI2te+Jtzjc15x1GwZye5ca1C4O1Fd3NIINfUEEd/8VyDI6DJdraxEkk+Wx9T61KbaPBRY0Bz1vYvfY/1UqEHmAvURAREQWV6+5q/3aT5SoiR/Zt9gUur59y1/u0nylRGYf4bfYEBzA4YcAR4ELo9tsVm+jVnqv+MikqKianime6m38ncLd38hhxO7uz0XOcqtHV1cTdsVVOxuMbWyuAx4Yz6h+SDZNfW+3UfksdDbY6dpfKJCKXZvc2RzMh248jtJDe4YOea1TGByVWWpqJY2xy1EsjGnLWPeSAfEAqkg2Ds+565sXvjFKdRZ7POeurF7439CpTICIiAiIgtbrC+otlXBEMySQPY0ZxklpAUe29k2sNgBoqbIHpTVI5EEcvql1f6HTfFNXv1Sav8ARKX4pqkYiCOf1Sav9Epfimp9Uer/AEWk+KH7KRiIOGaO7MtTWrVNruFbBStp6acSSFtQHHGD0GF3NEQEREH/2Q=="}];
document.getElementById("sampleImg").src = imgData[0].imgURL;
<html>
<head>
</head>
<body>
<img id="sampleImg">
</body>
</html>