Django 项目中的 HTML 音频标签播放按钮显示为灰色

Posted

技术标签:

【中文标题】Django 项目中的 HTML 音频标签播放按钮显示为灰色【英文标题】:HTML audio tag play button is greyed out on Django project 【发布时间】:2021-12-04 03:40:35 【问题描述】:

由于某种原因,我的 Django 网站上的播放按钮是灰色的。我在一个空白 html 文档中使用了相同的完全相同的 HTML 代码,它可以正常工作,所以我认为查找文件没有问题,也没有语法错误。在本地运行服务器时,我也没有在命令行中看到任何错误。

它在空白 HTML 文件上的外观

它在网站上的外观

代码:

<audio src="C:\Users\zach2\music\download.mp3" controls>
</audio>

我需要在其中一个 Django 文件中进行更改以使音频能够正常工作吗?我对 Django 和 Web 开发非常陌生。

【问题讨论】:

你确定它没有说“不允许加载本地资源”吗? @gre_gor 我的命令行什么也没说。还有其他地方我需要检查错误吗? 浏览器的开发工具。这个问题与Django无关。 @gre_gor 实际上在开发工具中确实这么说。我会去研究这个错误并尝试现在解决它。感谢您指出这一点。 【参考方案1】:

您可以将文件放在服务器根目录中(在媒体或资产目录中),而不是尝试直接从该路径加载。

出于安全原因,浏览器通常无法访问本地文件。否则任何网站都可以通过猜测并输入最常见的路径来访问您的敏感文件。

【讨论】:

【参考方案2】:

一件事是您无法访问托管网站上的本地文件,可能是本地文件或远程文件,除非您像以前一样使用空白 HTML 页面。这是出于安全考虑。

如果您确实想为您的媒体文件(例如音频、图像、视频等)提供服务,通常您可以将其放在 django 应用程序目录内的媒体文件夹中,如果您正在处理用户上传的文件或任何非静态文件。

要在 django 中处理静态文件和媒体文件,您可以参考此链接https://docs.djangoproject.com/en/3.2/howto/static-files/

【讨论】:

以上是关于Django 项目中的 HTML 音频标签播放按钮显示为灰色的主要内容,如果未能解决你的问题,请参考以下文章

HTML5 audio 如何实现播放多个MP3音频

html5 播放事件与视频标签中的播放事件

如何停止 HTML5 的音频标签播放的音频

HTML5 VIDEO 标签不播放音频/静音

HTML 音频标签(识别音频文件但不会播放)

为页面上的所有音频标签添加播放按钮