gpt4 book ai didi

node.js - 播放音频-React/NodeJS/MongoDB- GridFS

转载 作者:行者123 更新时间:2023-12-03 01:34:43 25 4
gpt4 key购买 nike

我有以下项目结构:

  • NodeJS是我的后端:用于在mongodb上上传.mp3并将其流式传输。我使用GridFsBucket进行上传/流
  • React是我的前端,并且与Redux商店一起工作:因此,我有两页,第一页用于使用FormData上传.mp3文件,第二页用于音频流播放。

  • 我的上传阶段工作良好,我将所选的.mp3文件推送到后端,并在GridFS的帮助下在MongoDB上创建了我的集合(fs.files和fs.chunks)。

    我从 http://site:4000/play/myMp3Code的后端播放.mp3,这将创建一个播放我的.mp3的播放器。这样就可以了

    我的问题是在React的流播放阶段,因为块(是块吗?)来自Redux,但我不知道如何从我的React网页上播放它。

    这是我在后端的处理方式
    const filename = req.params.filename;

    const bucket = new mongoose.mongo.GridFSBucket(mongoose.connection.db, {
    chunkSizeBytes: 1024,
    bucketName: 'fs'
    });

    const downloadStream = bucket.openDownloadStreamByName(filename);

    downloadStream.on('data', (chunk) => {
    res.write(chunk);
    });

    downloadStream.on('error', () => {
    res.sendStatus(404);
    });

    downloadStream.on('end', () => {
    res.end();
    });

    我对Redux的行动
    export const playTrack = (path, id) => {
    return async dispatch => {
    try {
    const track = await api.call('get',`tracks/${path}/${id}`);

    console.log("Track action: ", track);

    dispatch(currentTrack(track));
    dispatch(removeError());
    } catch (err) {
    const {error} = err.response.data;
    dispatch(addError(error.message));
    }
    };
    };

    Redux操作的console.log输出示例
    ���T!1AQa"q��2�#BR������3brCS��$���4Tcs�D��%��EUd����5����+!1AQ"2aBq#R3�$��?��v�.A  �UY�d[MVj�?�  1u
    ��D���MM1�u*곧TXR��X��A ,ְ���+#h�J��*)gQ��i�R:�Ut5�9���Ŋ�)ע%�r�X��c�&ȣ�����GD�B=c^�6T� 2y,�F���\*��
    �H���*�Lҋ ....

    我的问题如下:如何直接从前端播放.mp3?
    我可以播放Reat的上述数据吗?

    希望我解释得很好。
    感谢您的回答和阅读

    最佳答案

    我认为流是可以的,您所要做的就是发送带有正确标题的响应:(内容类型:音频/ mpeg),浏览器应该播放它。

    关于node.js - 播放音频-React/NodeJS/MongoDB- GridFS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54275150/

    25 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com