使用 Ajax 和 PHP 上传音频文件答案

【问题标题】：Upload audio file using Ajax and PHP使用 Ajax 和 PHP 上传音频文件
【发布时间】：2017-05-26 06:14:54
【问题描述】：

我正在尝试上传音频文件。

我正在做的是通过 Ajax 将音频文件传递到 PHP，在那里将完成上传和其他插入到我的数据库的操作。

通过 Ajax 传递后，我的 PHP 页面看不到音频文件。

<script type="text/javascript">
$(function () {

  $('form').on('submit', function (e) {

    e.preventDefault();

    document.getElementById("load").style.display = "block";
    textarea = $('#editor-one').html();
    var formData = new FormData($(this)[0]);
    formData.append("content", textarea);

    $.ajax({
      type: 'post',
      url: 'verimg.php?ins=newmu',
      data: formData,

      cache: false,
      contentType: false,
      processData: false,
      success: function(data){
        document.getElementById("load").style.display = "none";
        //alert(textarea);
        jQuery('#get_result').html(data).show();
      }
    });
  });
});

  </script>

这是我的 PHP 代码：

if(!isset($_FILES['file'])){
  echo '<div class="alert alert-warning">
          <strong>Warning!</strong> Please select an audio
        </div>';
}else{
  $uploaderror='';
  $name = ucfirst($_POST['name']);
  $artist = $_POST['artist'];
  $content = $_POST['content'];
  $genre = $_POST['genre'];

  $validator = new FormValidator();
  $validator->addValidation("name","req","Please fill in Music Name");
  $validator->addValidation("category","req","Please Select Artist");
  $validator->addValidation("category","req","Please Select Genre");
}

我总是收到“警告！请选择音频”。

【问题讨论】：

我觉得你需要看看这个问答：stackoverflow.com/questions/2320069/jquery-ajax-file-upload
<input type="file"> 字段的name 是什么？是“文件”吗？
是的@LouysPatriceBessette

标签： javascript php jquery ajax audio

【解决方案1】：

我已对您的 formData 进行了更改。在您的 php 代码中，您试图检查全局 $_FILES 变量中的“文件”键，但在您的 formData 变量中，音频文件未附加到任何“键”。希望它有效:)

<script type="text/javascript">
 $(function () {

$('form').on('submit', function (e) {

  e.preventDefault();

  document.getElementById("load").style.display = "block";
  textarea = $('#editor-one').html();
  var formData = new FormData();
  formData.append("file", e.target.files[0]);
  $.ajax({
    type: 'post',
    url: 'verimg.php?ins=newmu',
    data: formData,
    cache: false,
    contentType: false,
    processData: false,
    success: function(data)
    {
        document.getElementById("load").style.display = "none";
        //alert(textarea);
        jQuery('#get_result').html(data).show();
    }
  });

});

});

</script>

【讨论】：

收到同样的错误警告！请选择一张图片
根据我的经验，使用 XMLHttpRequest 和 FormData 而不是 AJAX。我认为存在兼容性问题。 var request = new XMLHttpRequest(); var formData = new FormData(); formData.append("文件", e.target.files[0]); request.open("POST", 'verimg.php?ins=newmu', true); // 设置其他头 request.send(formData); request.onload = function(){ // 成功 } request.onerror = function(){ //error }

【解决方案2】：

尝试将enctype='multipart/form-data' 添加到您的form 标记中。
;)

A long painfull Reference is here.

【讨论】：