在音频元素中播放 Spotify 歌曲预览答案

【问题标题】：Play Spotify song preview in audio element在音频元素中播放 Spotify 歌曲预览
【发布时间】：2018-03-27 11:18:36
【问题描述】：

我正在尝试在我的 Web 应用程序上构建一个功能，该功能从 Spotify 的 API 中提取预览 URL，并在用户单击音频控件时播放预览。我能够在源中保存正确的 URL，但歌曲无法播放。我查看了MDN Docs，但仍然无法正常工作。这是我在 JSX 中的代码的 sn-p：

<div className="audio-container">
  <audio controls="controls">
    <source src={this.props.songs[2].href} type="audio"/>
  </audio>
  <p className="font-style">{this.props.songs[2].name}</p>
</div>

我没有收到任何错误。我有什么明显的遗漏吗？提前谢谢你！

【问题讨论】：

标签： javascript reactjs audio spotify

【解决方案1】：

如果您使用type="audio/mpeg"，这应该可以工作

下面的工作示例：

  <audio controls="controls">
    <source src="https://p.scdn.co/mp3-preview/83090a4db6899eaca689ae35f69126dbe65d94c9?cid=null" type="audio/mpeg"/>
  </audio>

【讨论】：

感谢您的回复！但这并没有解决我的问题。我仍然无法点击控件。
你从console.log(this.props.songs[2].href);得到什么？
只看这个Spotify Reference，你确定{this.props.songs[2].href} 引用的是.preview_url？
是的，我很肯定我正在查询正确的 url，只是命名约定很差。我得到的网址类似于：p.scdn.co/mp3-preview/…

【解决方案2】：

对于任何人谁可能会发现这个有用后来，我通过删除源标记，并直接把预览网址在音频标签得到了音频作品。示例：

<audio controls src="..."></audio>

【讨论】：