Node.js+MongoDB中如何同时返回音频文件与元数据？

你现在的核心问题是：HTTP响应只能设置一种Content-Type，当前你把它设为了audio/mpeg，所以响应体只能是音频二进制数据，没法直接把JSON元数据和音频放在一起返回。这里给你两个实用的解决思路：

方案一：拆成两个接口（最推荐） #

这种方式简单直观，前端可以按需请求：

• 接口 /api/songs/:id/meta：返回歌曲元数据（JSON格式）
• 接口 /api/songs/:id/audio：返回音频流（复用你现有的代码逻辑）

元数据接口实现 #

const id = new ObjectId(req.params.id);
const filesCollection = db.collection('songs.files');
const fileDoc = await filesCollection.findOne(id);

if (!fileDoc) {
  return res.sendStatus(404);
}

// 注意修正拼写错误：matadata → metadata
res.json(fileDoc.metadata);

音频接口 #

保留你现有的代码即可。前端可以先请求元数据展示，再请求音频播放，或者并行请求两者。

方案二：把元数据塞进响应头（单接口实现） #

如果一定要用一个接口，可以把元数据序列化为JSON字符串，放在自定义的HTTP响应头里，前端读取响应头解析出元数据，同时接收音频流。

修改你的现有代码 #

const id = new ObjectId(req.params.id);
const filesCollection = db.collection('songs.files');
const fileDoc = await filesCollection.findOne(id);

if (!fileDoc) {
  return res.sendStatus(404);
}

// 修正拼写错误
const metadata = fileDoc.metadata;

// 把元数据转成JSON字符串，放在自定义响应头里
res.set('X-Song-Meta', JSON.stringify(metadata));

// 保持音频流的响应头设置
res.set('content-type', 'audio/mpeg');
res.set('accept-ranges', 'bytes');

const bucket = new mongodb.GridFSBucket(db, { bucketName: 'songs' });
const downloadStream = bucket.openDownloadStream(id);

downloadStream.on('data', (chunk) => res.write(chunk));
downloadStream.on('error', (err) => {
  console.error(err);
  res.sendStatus(500); // 服务器出错返回500，资源不存在才用404
});
downloadStream.on('end', () => res.end());

前端获取示例（Fetch） #

fetch(`/api/songs/${songId}`)
  .then(res => {
    // 从响应头拿元数据
    const metaStr = res.headers.get('X-Song-Meta');
    const metadata = JSON.parse(metaStr);
    // 获取音频Blob
    return res.blob().then(audio => ({ metadata, audio }));
  })
  .then(({ metadata, audio }) => {
    // 处理元数据
    console.log('艺人：', metadata.artist);
    console.log('专辑：', metadata.album);
    // 播放音频
    const audioUrl = URL.createObjectURL(audio);
    document.getElementById('audio-player').src = audioUrl;
  });

⚠️ 注意：响应头的大小有限制（一般不超过几KB），如果你的元数据很大，别用这个方案，老老实实拆接口。

你代码里的几个小问题要改 #

1. 拼写错误：matadata → metadata，不然根本拿不到元数据
2. find(id).toArray() 换成 findOne(id) 更高效，不用转数组直接拿文档
3. 错误处理里，服务器内部错误返回500，404只用来表示资源不存在

内容的提问来源于stack exchange，提问作者Ysp