node 给前端返回图片流
先看效果
实现方式
// 二维码中间件 const express = require('express'); const router = express.Router(); const fs = require('fs') const path = require('path') router.get('/', (req, res, next) => { const qrcodeName = Date.now() + '-' + Math.random().toString(36).slice(-6); const filePath = path.resolve(__dirname, `./../public/qrcode/${qrcodeName}.png`); // 给客户端返回一个文件流 //格式必须为 binary,否则会出错 // 创建文件可读流 const cs = fs.createReadStream(filePath); cs.on("data", chunk => { res.write(chunk); }) cs.on("end", () => { res.status(200); res.end(); }) }) module.exports = router;
原理
我们创建一个可读的流,然后开始读的时候,就对接口响应流,针对大文件也不会有问题,毕竟是流,读出一部分,然后就响应,一开始使用readFile,
但是发现,send后竟然是文件下载,后面想想也是,readFile
读出的是二进制的文件,浏览器他不明白你的二进制的文件要怎么处理,就给直接下载了。