Fatal编程技术网
  • javascript/
  • Javascript 如何通过html5音频元素从php播放音频文件

Javascript 如何通过html5音频元素从php播放音频文件

javascript php html yii2

Javascript 如何通过html5音频元素从php播放音频文件,javascript,php,html,yii2,Javascript,Php,Html,Yii2,我想流式传输位于应用程序服务器目录中的.wav音频文件，文件名不应向最终用户公开。顺便问一下，我正在使用Yi2框架，一般来说，如何通过PHP实现这一点？简单的方法。如果不想公开文件名，则不要使用name属性 <html> <body> <audio controls> <source src="horse.ogg" type="audio/ogg"> <source src="horse.mp3" type="audio/mpeg"

我想流式传输位于应用程序服务器目录中的.wav音频文件，文件名不应向最终用户公开。顺便问一下，我正在使用Yi2框架，一般来说，如何通过PHP实现这一点？

简单的方法。如果不想公开文件名，则不要使用name属性

<html>
<body>

<audio controls>
  <source src="horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

</body>
</html>


您的浏览器不支持音频元素。

src
是音频文件的路径，
type
是音频的类型。



<?php
    foreach($video as $video) { ?>
       <video width="100%" height="390" controls="">
           <source src="<?php echo $video['video'];?>" type="video/mp4">
       </video>
<?php } ?>



实际上，我已经设法找到了解决问题的方法。

控制器代码


    $audioFilePath = "audio_file_absolute_path.wav"

    header('Cache-Control: no-cache');
    header('Content-Transfer-Encoding: binary');
    header('Content-Type: audio/wav'); // sets the output content type to wav
    header('Content-Length: ' . filesize($audioFilePath)); // sets the legth of the file (in order to the HTML5 player to access the audio duration)
    header('Accept-Ranges: bytes');
    header('Content-Disposition: inline; filename="test_audio.wav"'); // set an output file name

    readfile($audioFilePath); // reads the file 


查看代码（音频播放器）




我想你可以试试服务器重写模块。

          <audio controls>
               <source id="audioPlayerSource" src="<? 'Url of audio file read controller function' ?>" type="audio/wav">
          </audio>