使用 react-player 播放 mp3 文件时出现 "Cannot play media. No decoders for requested formats: text/html" 错误

Question

我一直在尝试使用 react-player 播放单个音频文件，但它似乎无法正确读取文件。这是我用来播放文件的 React 道具。

<ReactPlayer 
    forceAudio
    controls
    width='100%'
    url='../../../../../build/assets/audio/Big_O_Opening_US_Version.mp3'
    type = 'audio/mp3'
/>

每当我的应用呈现时，播放器不读取文件并在 Firefox 控制台中给我以下错误：

Cannot play media. No decoders for requested formats: text/html

我用过的其他浏览器不

Answer 1

在 webpack 中为 mp3 添加文件加载器

您的加载器需要了解您使用的文件，您可以使用 webpack 中的标准文件加载器将这些文件捆绑到您的构建中。有一个关于如何使用这个 here 的问题。然后将该文件作为变量导入并将其传递给您的组件。导入很重要，因为那是 webpack 查看要打包的内容的方式。

import mp3 from '../../../../../build/assets/audio/Big_O_Opening_US_Version.mp3';

...

<ReactPlayer 
    forceAudio
    controls
    width='100%'
    url={mp3}
    type = 'audio/mp3'
/>

使用 react-player 播放 mp3 文件时出现 "Cannot play media. No decoders for requested formats: text/html" 错误

Getting "Cannot play media. No decoders for requested formats: text/html" Error when using react-player to play mp3 file

javascript

reactjs

react-player

在 webpack 中为 mp3 添加文件加载器