HTML5 audio组件禁止下载

当使用原生的audio标签时，默认效果为【播放按钮 - 进度条 - 音量 - 下载】。有时需要隐藏下载按钮，主要包括以下3种方式。

添加controlsList属性

这个方法只支持Chrome 58+，低于该版本无法隐藏。nodownload: 不要下载；nofullscreen: 不要全屏；noremoteplayback: 不要远程回放。

<audio src="/record/test.wav" controls="controls" controlsList="nodownload"></audio>

css方式来隐藏

audio::-webkit-media-controls {
	overflow: hidden !important;
}
audio::-webkit-media-controls-enclosure {
	width: calc(100% + 32px);
	margin-left: auto;
}

禁止右键下载

<audio src="/record/test.wav" controls="controls" controlsList="nodownload" οncοntextmenu="return false;"></audio>