时间戳

首页 > 解决方案 > 如何使用 Express 通过 HTTP 发送图像

javascript - 如何使用 Express 通过 HTTP 发送图像

问题描述

我正在用 NodeJS 开发一种 API。

我需要做一种getImage，将与名称对应的图像返回到url（例如：localhost:8080/getImage/myImg）。

我在互联网上找到了很多教程，但问题是我不能使用 FS 的 writeFile 和 readFile，因为我的图像存储在一个包含其他 JSON 信息的数组中。我存储的图像是由 tomCat 中的另一个 API 发送的，我的工作是通过设置 NodeJS API 来限制对 tomCat API 的调用。

我的问题是如何发送存储到变量/数组/json 中的图像？

我尝试了下面的代码，但是当我要去 localhost:8080/getImage/myImg 时，代码被执行，但没有返回任何内容。我没有尝试使用一种 tmp 文件夹来存储图像，因为我正在开发一个大型产品，如果我可以限制对磁盘的访问，那就太好了。

app.get('/getImage/:name', (req, res) => {
  imagesArray.forEach( (image) => {
    if(req.params.name === image.small_image_name) {
      res.writeHead(200, {'content-type': 'image/jpeg'})
      res.end(image.small_image, 'binary')
    } else if (req.params.name === image.full_image_name) {
      res.writeHead(200, {'content-type': 'image/jpeg'})
      res.end(image.full_image, 'binary')
    }
  })
})

我要做的是：您使用图像名称作为参数对 url 进行 http 请求，以“下载”图像并更改在我的主页上显示的元素的背景。

感谢您未来的回答。祝你今天过得愉快 ！

标签： javascriptnode.jsimageexpresshttp

解决方案

这段代码会做你想做的事，我假设 image.small_image 和 image.full_image 包含带有图像数据的 Buffer 对象。如果图像数据存储为字节数组或base64字符串，这很容易转换为缓冲区。

app.get('/getImage/:name', (req, res) => {
    const image = imagesArray.find(image => (req.params.name === image.small_image_name || req.params.name === image.full_image_name));

    if (!image) {
        res.status(404).send("Image not found");
        return;
    }

    const imageBuffer = (req.params.name === image.small_image_name) ? image.small_image: image.full_image;
    res.writeHead(200, { 'content-type': 'image/jpeg' })
    res.end(imageBuffer, 'binary')
});

我在本地机器上使用端口 3000，所以请求 url 看起来像：

http://localhost:3000/getImage/test.jpg

另一种方法是预先创建图像地图，这将提高检索效率。请注意，这可能会增加进程的内存需求。

const imageMap = imagesArray.reduce((map, image) => { 
    map[image.small_image_name] = { name: image.small_image_name, data: image.small_image };
    map[image.full_image_name] = { name: image.full_image_name, data: image.full_image };
    return map;
}, {});

app.get('/getImage/:name', (req, res) => {
    const image = imageMap[req.params.name];
    if (!image) {
        res.status(404).send("Image not found");
        return;
    }

    res.writeHead(200, { 'content-type': 'image/jpeg' })
    res.end(image.data, 'binary')
});

推荐阅读