javascript - 如何从静态文件夹中播放 html 格式的 mp3 文件?

标签 javascript python html audio html5-audio

我正在尝试使用 python 将文本转换为音频。我将转换后的音频文件保存在静态文件夹中。我尝试使用下面的 html 代码播放音频文件。

{%extends "main.html" %}
{% block file %}
     <p>{{data}}</p>
     <audio id="myAudio">

        <source src="C:\Users\kousik\Desktop\static\uploads\welcome.mp3" type="audio/mpeg">
        Your browser does not support the audio tag.
     </audio>
     <button onclick="playAudio()" type="button">Play Audio</button>
     <script type="text/javascript">
        var x = document.getElementById("myAudio"); 

function playAudio() { 
  x.play(); 
} 
     </script>
{% endblock %}

我正在尝试玩,但出现错误

Not allowed to load local resource: file:///C:/Users/kousik/Desktop/static/uploads/welcome.mp3

最佳答案

首先将你的mp3文件放入项目文件夹

还可以尝试更灵活地使用它,以便每个人都可以在实时服务器上访问它

也将这个“\”更改为“/”

例如:考虑您的文件位置是这样的

myproject->myfiles->welcome.mp3

你应该做的是

         <source src="/myfiles/welcome.mp3" 
         type="audio/mpeg">

所以当你把你的项目放在任何本地主机中时,生产它就会工作

关于javascript - 如何从静态文件夹中播放 html 格式的 mp3 文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60023361/

相关文章:

javascript - 一键上传文件并发布文本输入值?

javascript - 如何使用 jQuery 将多个文件上传到 java Controller

Ajax 成功时的 Javascript 重定向

python - Python中的2D卷积类似于Matlab的conv2

python - matplotlib for 循环显示、保存和重绘所有图

java - 无法从 jsp 获取值到 servlet

javascript - Jquery 将值数组添加到 json 对象

JetBrains IDE 上的 JavaScript : assigning the base class type-hinted instance to the parameter type-hinted as a sub-class

python - 是什么导致不同 GTK 版本之间的 GtkIconView 显示行为不同?

javascript - 如何使用 SVG (+JS) 绘制正弦波?