如何从 HTML5 网络视频生成音频波形？
How to generate an audio waveform from an HTML5 web video?
给定一个纯网络视频，例如：
<video src="my-video.mp4"></video>
如何生成它的音频波形？
是否可以在不播放视频的情况下生成波形？
备注：
- 我对实现此目的的可用 API 感兴趣，而不是 "how to render a waveform to a canvas" 指南。
- 普通JavaScript，请。没有图书馆。
你可以试试AudioContext.decodeAudioData，虽然我不知道视频媒体是否得到很好的支持，这可能在很大程度上取决于编解码器和浏览器。
看到 FF、chrome 和 Safari 接受带有 mp4 和 mpeg4a 音频的它，我有点惊讶。
如果可行，那么您可以使用 OfflineAudioContext 尽快分析您的音频数据并生成波形数据。
如果您将使用网络音频 API，您将在客户端呈现。
您将无法控制体验质量，因为渲染可能会导致客户端出现内存和时间问题。
您可以在后端使用 FFmpeg 生成波形图像并将其传递到前端。
很简单。
https://trac.ffmpeg.org/wiki/Waveform
示例：
ffmpeg -i C:\test.mp3 -filter_complex "showwavespic=s=640x120" -frames:v 1 C:\waveform.png
给定一个纯网络视频，例如：
<video src="my-video.mp4"></video>
如何生成它的音频波形？
是否可以在不播放视频的情况下生成波形？
备注：
- 我对实现此目的的可用 API 感兴趣，而不是 "how to render a waveform to a canvas" 指南。
- 普通JavaScript，请。没有图书馆。
你可以试试AudioContext.decodeAudioData，虽然我不知道视频媒体是否得到很好的支持，这可能在很大程度上取决于编解码器和浏览器。
看到 FF、chrome 和 Safari 接受带有 mp4 和 mpeg4a 音频的它，我有点惊讶。
如果可行，那么您可以使用 OfflineAudioContext 尽快分析您的音频数据并生成波形数据。
如果您将使用网络音频 API，您将在客户端呈现。 您将无法控制体验质量，因为渲染可能会导致客户端出现内存和时间问题。 您可以在后端使用 FFmpeg 生成波形图像并将其传递到前端。 很简单。
https://trac.ffmpeg.org/wiki/Waveform
示例： ffmpeg -i C:\test.mp3 -filter_complex "showwavespic=s=640x120" -frames:v 1 C:\waveform.png