在 Nest.js 中，如何在我的 API 响应中提供与我的 JSON 对象捆绑在一起的静态内容文件

Posted 2023-02-19

【中文标题】在 Nest.js 中，如何在我的 API 响应中提供与我的 JSON 对象捆绑在一起的静态内容文件

【英文标题】：In Nest.js, how to serve static content file/s bundled together with my JSON object in my API Response

【发布时间】：2019-08-07 23:37:42

【问题描述】：

在我的 Nest.js API 中，我有一个 GET 必须返回一个 db 行，一起在响应中包含（最多）6 个图像文件（base64 编码）。

我可以做的是：

db 中的 6 列包含唯一文件名（实际图像位于名为“image-uploads”的文件夹中），连同路径我可以使用@Res 装饰器发送任何 one 他们回来了，例如

@Get('/findVehicleEntry/:id')
async findVehicleEntry(@Param('id') id: number, @Res() res) 
    const resVehicle: Vehicle = await this.vehiclesService.findVehicleEntry(id);
    if (resVehicle) 
        res.sendFile(resVehicle.photo1,  root: 'image-uploads' );
    

以上成功下载了一个图片文件为 Content-Type: "application/octet-stream"

我的计划是（我不知道该怎么做）：

首先，从文件夹中获取图像并放入变量，然后对其运行base64编码，然后将resVehicle.photo1设置为等于该base64字符串，对其他5个执行相同操作图片，然后做一个 res.send(resVehicle);

类似这样的：

@Get('/findVehicleEntry/:id')
    async findVehicleEntry(@Param('id') id: number, @Res() res) 
    const resVehicle: Vehicle = await this.vehiclesService.findVehicleEntry(id);
    if (resVehicle) 
        let image = something.get('resVehicle.photo1', 'my/path/to/image-uploads');
        image = Buffer.from(image).toString('base64');
        resVehicle.photo1 = image;
        // do the same for the other 5 images
        res.send(resVehicle);
    

这是我第一次使用 Nest/Express/Node，实际上这是我编写的第一个 API，所以我的想法/设计可能完全偏离了。欢迎任何建议。非常感谢。

编辑：一直在阅读大文件的 base64 编码不是一个好主意。我很高兴放弃 base64 的想法，主要问题是如何将我的数据库行 JSON 对象和 6 个图像放入同一个响应中？

【参考方案1】：

你说得对，图片的 base64 编码不是一个好主意。

这里的传统解决方案是： 您不推送图片，您在 json 响应中提供图片路径，并让 API 使用者使用该路径来获取图片。

将实际图像文件保存在公开可用的文件夹中，而不是数据库中。这意味着它应该可以从浏览器访问，例如yourdomain.com/images/image232.jpg 在您的数据库中，将这些图像的路径存储为字符串 (image1: "yourdomain.com/images/image232.jpg") 提供包含路径 (make:"Toyota", image1:"yourdomain.com/images/image232.jpg") 的 json 响应 使用您的 API 的任何人都可以使用该路径来获取图像。

【讨论】：

感谢您的信息。 Ja，这（几乎）正是我所做的。我以 JSON 格式发回文件名，并公开了另一个可用于获取图像文件的端点。额外的好处是前端首先获取所有数据，并在后台调用图像时构建页面。它运作良好。再次感谢您的回复。

附言。试图赞成你的答案，但我不能，没有足够的代表。

如果您认为这是您问题的正确答案，您可以将其标记为答案，而不是投票。