NodeJS 后端通过Http获取Base64格式数据显示图片 ②〇

**Node.js 后端通过 HTTP 获取 Base64 格式数据显示图片**

在 Node.js 后端开发中，经常需要处理图像数据。其中一种常见的需求是从客户端（如前端应用）发送 Base64 编码的图像数据，然后在后端使用该数据生成图像并返回给客户端。在本文中，我们将讨论如何实现这一点。

###1. 前言首先，让我们了解一下 Base64 是什么。Base64 是一种用于编码二进制数据（如图像）为 ASCII 文本的算法。它通过将原始数据分割成24 位块，然后使用一个预定义的字符集来替换每个块中的6 位二进制数，生成一个 Base64 编码的字符串。

###2. Node.js 后端实现下面是 Node.js 后端代码示例，用于接收 Base64 格式的图像数据，并将其转换为原始图像，然后返回给客户端：

javascriptconst express = require('express');
const app = express();
const multer = require('multer'); //仅限于处理 multipart/form-data 请求// 配置 Multer 中间件以处理 Base64 图像数据const upload = multer({
 dest: './uploads/', // 将图像保存在本地磁盘上 limits: { fileSize:5 *1024 *1024 }, // 最大允许上传的文件大小为5MB});

// 接收 Base64 格式的图像数据并将其转换为原始图像app.post('/image', upload.single('image'), (req, res) => {
 const imageBuffer = Buffer.from(req.body.image, 'base64'); // 将 Base64 编码的图像数据解码为 Buffer 对象 // 根据需要进行图像处理（例如，压缩、裁剪等）
 const processedImage = processImage(imageBuffer);

 // 将原始图像返回给客户端 res.set("Content-Disposition", "attachment; filename=image.jpg"); // 指定响应的 MIME 类型和文件名 res.set("Content-Type", "image/jpeg");
 res.send(processedImage); // 返回原始图像});

// 根据需要进行图像处理（例如，压缩、裁剪等）
function processImage(imageBuffer) {
 //请根据具体需求实现图像处理逻辑 return imageBuffer;
}

app.listen(3000, () => {
 console.log('Server listening on port3000');
});

javascript// 使用 Fetch API 或 Axios 等库向后端发送 HTTP 请求fetch('/image', {
 method: 'POST',
 headers: { 'Content-Type': 'application/json' },
 body: JSON.stringify({ image: base64ImageString }), // 将 Base64 编码的图像数据传递给后端})
.then(response => response.blob()) // 接收原始图像并将其转换为 Blob 对象.then(blob => {
 const url = URL.createObjectURL(blob); // 创建一个 URL 对象，指向原始图像 const imgElement = document.createElement('img'); // 创建一个 img 元素 imgElement.src = url; // 将原始图像设置为 img 元素的 src 属性 document.body.appendChild(imgElement); // 将 img 元素添加到页面中})
.catch(error => console.error('Error:', error));