音频使用PHP Jquery上传到文件夹

以下是我的HTML。

<!DOCTYPE html> 
<html> 
    <head> 
    <script src="src/recorder.js"></script> 
    <script src="src/Fr.voice.js"></script> 
    <script src="js/jquery.js"></script> 
    <script src="js/app.js"></script> 
    </head> 

    <body> 
    <div class="center_div"> 
     <span class="recording_label">Please wait...</span> 
     <span class="loader_bg"></span> 
     <span class="loader_bg1"></span> 

     <br/> 
     <audio controls id="audio"></audio> 
    </div> 

    <style> 
     .center_div { 
     width: 500px; 
     height: 150px; 
     background-color: #f5f5f5; 
     border: 1px solid #808080; 
     position:absolute; 
     top:50%; 
     left:50%; 
     margin-left:-250px;/* half width*/ 
     margin-top:-75px;/* half height*/ 
     padding:25px; 
     } 

     .recording_label { 
     display: block; 
     text-align: center; 
     padding: 10px; 
     font-family: sans-serif; 
     font-size: 1.1em; 
     margin-bottom: 25px; 
     } 

     .loader_bg { 
     min-width: 100%; 
     background: #c5c5c5; 
     min-height: 20px; 
     display: block; 
     } 
     .loader_bg1 { 
     min-width: 90%; 
     background: grey; 
     min-height: 20px; 
     display: inline-block; 
     position: relative; 
     top: -20px; 
     } 

     audio { 
     } 
    </style> 
    </body> 
</html>

在上面的代码中，我试图记录和预览音频一次记录完成处理。我想使用PHP在文件夹中上传预览音频。任何人都可以帮我在AJAX部分如何发送mp3文件。我提到了很多链接，但是我无法得到这部分的解决方案。请人人帮助我。提前致谢。请在这里参考我的工作小提琴。

获取源文件是这样的：

<audio controls="" id="audio" src="blob:null/b63e868d-1628-4836-85da-90cf1b5b65c3"></audio>

如何我能得到这个BLOB并将其转换为mp3并存储在文件夹？

来源

2017-03-20 Kavya Shree

'audio'不是表单输入元素，你需要改变/添加'input type = file src ='blob src '' –

就像只有我曾尝试过，但我不能设置输入文件src像 –

我试图设置输入类型值设置attr标题和somany方式，但我不能改变“没有文件选择”与src名称 –

变化如下app.js代码，设置的URL在Ajax调用

$(function(){ 
     var max = 40; 
     var count = max + 1; 
     var counter = setInterval(timer, 1000); 

     function timer() { 
      count = count - 1; 
      if (count <= 0) { 
       clearInterval(counter); 
       $(".recording_label").html("Recording..."); 
       $('.loader_bg1').css({'min-width':''+(100)+'%'}) 
        Fr.voice.record(false, function(){}); 
        Fr.voice.stopRecordingAfter(40000, function(){ 
         //alert("Recording stopped after 40 seconds"); 
         Fr.voice.export(function(url){ 
         $("#audio").attr("src", url); 
         $("#audio")[0].play(); 
         }, "URL"); 

        }); 
       recordingSec(40); 
       return; 
      } 
      $(".recording_label").html("Recording will begin in " + count + " sec."); 
      var percent = (count/max) * 100 ; 
      $('.loader_bg1').css({'min-width':''+(100 - percent)+'%'}) 
     } 
    }); 

    function uploadAudio(){ 
    Fr.voice.exportMP3(function(blob){ 
     var data = new FormData(); 
     data.append('file', blob); 

     $.ajax({ 
      url: "server.php", 
      type: 'POST', 
      data: data, 
      contentType: false, 
      processData: false, 
      success: function(data) { 
       // Sent to Server 
      } 
     }); 
    }, "blob"); 
    } 

    function recordingSec(sec){ 
     var count = sec + 1; 
     var counter = setInterval(timer, 1000); 

     function timer() { 
      count = count - 1; 
      if (count <= 0) { 
       clearInterval(counter); 
       $(".recording_label").html("Recording stopped...Playing"); 
       $('.loader_bg1').css({'min-width':''+(100)+'%'}) 
       //stopRecording(); 
       return; 
      } 
      $(".recording_label").html("Recording started [ " + (sec - count) + "/" + sec + " ] sec."); 
      var percent = (count/sec) * 100 ; 
      $('.loader_bg1').css({'min-width':''+(100 - percent)+'%'}) 
     }  
    }

Refer this Documentation

Check this file for reference

Server.php样品

<?php 
$path = 'audio/'; 
$location = $path . $_FILES['file']['name'] . ".mp3"; 
move_uploaded_file($_FILES['file']['tmp_name'], $location); 
?>

来源

2017-03-24 19:10:54

我不能得到这个参考链接.. @ karthikeyan –

如果在单个页面中会有多个录音，那么我怎样才能做到这一点。@ karthikeyan ..我们需要什么调用uploadAudio（）..和这里Fr.voice.exportMP3（函数（blob））这个blob将如何取值。 –

@KavyaShree在录制音频后调用uploadAudio（），参考ajax部分，将音频文件发布到网址 –

音频使用PHP Jquery上传到文件夹

回答

相关问题