如何使用pdo将录制的音频文件上传到数据库

时间:2015-12-27 00:50:10

标签: php mysql pdo

人们!我试图在我的网站上实现录音机。我想要的是让用户将录制的文件直接保存到数据库和我网站上的子文件夹(称为/ speaking_audios)。主要文件如下:

recorder.php

 <!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title>FlashWavRecorder demo</title>
  <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js'></script>
  <script type="text/javascript" src="js/swfobject.js"></script>
  <script type="text/javascript" src="js/recorder.js"></script>
  <script type="text/javascript" src="js/main.js"></script>
  <link rel="stylesheet" href="css/style.css">

</head>

<body>
  <div class="container">

    <h1><a href="https://github.com/cykod/FlashWavRecorder">FlashWavRecorder</a></h1>
    <p><strong>Upload requires php, i.e. example will not work on github.com</strong></p>


    <div id="recorder-audio" class="control_panel idle">
      <button class="record_button" onclick="FWRecorder.record('audio', 'audio.wav');" title="Record">
        <img src="images/record.png" alt="Record"/>
      </button>
      <button class="stop_recording_button" onclick="FWRecorder.stopRecording('audio');" title="Stop Recording">
        <img src="images/stop.png" alt="Stop Recording"/>
      </button>
      <button class="play_button" onclick="FWRecorder.playBack('audio');" title="Play">
          <img src="images/play.png" alt="Play"/>
      </button>
      <button class="pause_playing_button" onclick="FWRecorder.pausePlayBack('audio');" title="Pause Playing">
          <img src="images/pause.png" alt="Pause Playing"/>
      </button>
      <button class="stop_playing_button" onclick="FWRecorder.stopPlayBack();" title="Stop Playing">
        <img src="images/stop.png" alt="Stop Playing"/>
      </button>
      <div class="level"></div>
    </div>

    <div id="recorder-audio2" class="control_panel idle">
      <button class="record_button" onclick="FWRecorder.record('audio2', 'audio2.wav');" title="Record">
        <img src="images/record.png" alt="Record"/>
      </button>
      <button class="stop_recording_button" onclick="FWRecorder.stopRecording('audio2');" title="Stop Recording">
        <img src="images/stop.png" alt="Stop Recording"/>
      </button>
      <button class="play_button" onclick="FWRecorder.playBack('audio2');" title="Play">
        <img src="images/play.png" alt="Play"/>
      </button>
      <button class="pause_playing_button" onclick="FWRecorder.pausePlayBack('audio2');" title="Pause Playing">
        <img src="images/pause.png" alt="Pause Playing"/>
      </button>
      <button class="stop_playing_button" onclick="FWRecorder.stopPlayBack();" title="Stop Playing">
        <img src="images/stop.png" alt="Stop Playing"/>
      </button>
      <div class="level"></div>
    </div>

    <div class="details">
      <button class="show_level" onclick="FWRecorder.observeLevel();">Show Level</button>
      <button class="hide_level" onclick="FWRecorder.stopObservingLevel();" style="display: none;">Hide Level</button>
      <span id="save_button">
        <span id="flashcontent">
          <p>Your browser must have JavaScript enabled and the Adobe Flash Player installed.</p>
        </span>
      </span>
      <div><button class="show_settings" onclick="microphonePermission()">Microphone permission</button></div>
      <div id="status">
       Recorder Status...
      </div>
      <div>Duration: <span id="duration"></span></div>
      <div>Activity Level: <span id="activity_level"></span></div>
      <div>Upload status: <span id="upload_status"></span></div>
    </div>

    <form id="uploadForm" name="uploadForm" action="upload.php">
      <input name="authenticity_token" value="xxxxx" type="hidden">
      <input name="upload_file[parent_id]" value="1" type="hidden">
      <input name="format" value="json" type="hidden">
    </form>

    <h4>Configure Microphone</h4>
    <form class="mic_config" onsubmit="return false;">
      <ul>
        <li>
          <label for="rate">Rate</label>
          <select id="rate" name="rate">
            <option value="44" selected>44,100 Hz</option>
            <option value="22">22,050 Hz</option>
            <option value="11">11,025 Hz</option>
            <option value="8">8,000 Hz</option>
            <option value="5">5,512 Hz</option>
          </select>
        </li>

        <li>
          <label for="gain">Gain</label>
          <select id="gain" name="gain">
          </select>
        </li>

        <li>
          <label for="silenceLevel">Silence Level</label>
          <select id="silenceLevel" name="silenceLevel">
          </select>
        </li>

        <li>
          <label for="silenceTimeout">Silence Timeout</label>
          <input id="silenceTimeout" name="silenceTimeout" value="2000"/>
        </li>

        <li>
          <input id="useEchoSuppression" name="useEchoSuppression" type="checkbox"/>
          <label for="useEchoSuppression">Use Echo Suppression</label>
        </li>

        <li>
          <input id="loopBack" name="loopBack" type="checkbox"/>
          <label for="loopBack">Loop Back</label>
        </li>

        <li>
          <button onclick="configureMicrophone();">Configure</button>
        </li>
      </ul>
    </form>
  </div>

</body>
</html>

数据库表&#34;录音&#34; SQL结构:

    CREATE TABLE `recordings` (
  `id` int(5) NOT NULL AUTO_INCREMENT,
  `username_id` int(5) NOT NULL,
  `username` varchar(50) NOT NULL,
  `upload_file` longblob NOT NULL,
  `filename` varchar(100) NOT NULL,
  `currenttime` datetime NOT NULL,
  `type` longtext NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

的config.php

    <?php
try {
    $pdo = new PDO('mysql:host=localhost;dbname=database','root','');
    $pdo->setAttribute(PDO::ATTR_ERRMODE,PDO::ERRMODE_EXCEPTION);

} catch(PDOException $e) {
    echo 'Error: '.$e->getMessage();
}
?>

upload.php的

    <?php
$save_folder = dirname(__FILE__) . "/speaking_audios";
if(! file_exists($save_folder)) {
  if(! mkdir($save_folder)) {
    die("failed to create save folder $save_folder");
  }
 }

function valid_wav_file($file) {
  $handle = fopen($file, 'r');
  $header = fread($handle, 4);
  list($chunk_size) = array_values(unpack('V', fread($handle, 4)));
  $format = fread($handle, 4);
  fclose($handle);
  return $header == 'RIFF' && $format == 'WAVE' && $chunk_size == (filesize($file) - 8);
}

$key = 'filename';
$tmp_name = $_FILES["upload_file"]["tmp_name"][$key];
$upload_name = md5(uniqid() .rand()). ".wav";
#$_FILES["upload_file"]["name"][$key];
$type = $_FILES["upload_file"]["type"][$key];
$filename = "$save_folder/$upload_name";
#$filename = "$save_folder/$upload_name";
$saved = 0;
if($type == 'audio/wav' && preg_match('/^[a-zA-Z0-9_\-]+\.wav$/', $upload_name) && valid_wav_file($tmp_name)) {
  $saved = move_uploaded_file($tmp_name, $filename) ? 1 : 0;
}

if($_POST['format'] == 'json') {
  header('Content-type: application/json');
  print "{\"saved\": $saved}";
} else {
  print $saved ? "Saved" : 'Not saved';
}

exit;

# Save a few info to database
include "config.php";

$username = $_SESSION['username'];

$stmt = $pdo->prepare("INSERT INTO `recordings` (username, filename, currenttime) VALUES (:username, :filename, NOW())");
$stmt->execute(array(':username' => $username, ':filename' => $upload_name));

?>

好吧,我只是想让你专注于upload.php文件,看看我做错了什么。我不知道问题是否是由线路退出引起的;&#34;在upload.php文件中。该文件将保存到子文件夹&#34; / speaking_audios&#34;,但不保存到数据库。为什么?也许问题出在upload.php文件行中:

include "config.php";

$upload_file=$upload_name; # also $upload_name
$username_id = $_SESSION['username'];

$stmt = $pdo->prepare("INSERT INTO `recordings` (username, filename, currenttime) VALUES (:username_id, :upload_file, NOW())");
$stmt->execute(array(':username_id' => $username_id, ':upload_file' => $upload_file));

javascript中还有主音频控制器:

JS / main.js

 $(function () {
  var $uploadStatus = $('#upload_status'),
    $showLevelButton = $('.show_level'),
    $hideLevelButton = $('.hide_level'),
    $level = $('.control_panel .level');

  var CLASS_CONTROLS = "control_panel";
  var CLASS_RECORDING = "recording";
  var CLASS_PLAYBACK_READY = "playback_ready";
  var CLASS_PLAYING = "playing";
  var CLASS_PLAYBACK_PAUSED = "playback_paused";

//  Embedding flash object ---------------------------------------------------------------------------------------------

  setUpFormOptions();
  var appWidth = 24;
  var appHeight = 24;
  var flashvars = {'upload_image': 'images/upload.png'};
  var params = {};
  var attributes = {'id': "recorderApp", 'name': "recorderApp"};
  swfobject.embedSWF("recorder.swf", "flashcontent", appWidth, appHeight, "11.0.0", "", flashvars, params, attributes);

//  Handling FWR events ------------------------------------------------------------------------------------------------

  window.fwr_event_handler = function fwr_event_handler() {
    $('#status').text("Last recorder event: " + arguments[0]);
    var name, $controls;
    switch (arguments[0]) {
      case "ready":
        var width = parseInt(arguments[1]);
        var height = parseInt(arguments[2]);
        FWRecorder.uploadFormId = "#uploadForm";
        FWRecorder.uploadFieldName = "upload_file[filename]";
        FWRecorder.connect("recorderApp", 0);
        FWRecorder.recorderOriginalWidth = width;
        FWRecorder.recorderOriginalHeight = height;
        $('.save_button').css({'width': width, 'height': height});
        break;

      case "no_microphone_found":
        break;

      case "microphone_user_request":
        recorderEl().addClass("floating");
        FWRecorder.showPermissionWindow();
        break;

      case "microphone_connected":
        FWRecorder.isReady = true;
        $uploadStatus.css({'color': '#000'});
        break;

      case "permission_panel_closed":
        FWRecorder.defaultSize();
        recorderEl().removeClass("floating");
        break;

      case "microphone_activity":
        $('#activity_level').text(arguments[1]);
        break;

      case "recording":
        name = arguments[1];
        $controls = controlsEl(name);
        FWRecorder.hide();
        setControlsClass($controls, CLASS_RECORDING);
        break;

      case "recording_stopped":
        name = arguments[1];
        $controls = controlsEl(name);
        var duration = arguments[2];
        FWRecorder.show();
        setControlsClass($controls, CLASS_PLAYBACK_READY);
        $('#duration').text(duration.toFixed(4) + " seconds");
        break;

      case "microphone_level":
        $level.css({width: arguments[1] * 50 + '%'});
        break;

      case "observing_level":
        $showLevelButton.hide();
        $hideLevelButton.show();
        break;

      case "observing_level_stopped":
        $showLevelButton.show();
        $hideLevelButton.hide();
        $level.css({width: 0});
        break;

      case "playing":
        name = arguments[1];
        $controls = controlsEl(name);
        setControlsClass($controls, CLASS_PLAYING);
        break;

      case "playback_started":
        name = arguments[1];
        var latency = arguments[2];
        break;

      case "stopped":
        name = arguments[1];
        $controls = controlsEl(name);
        setControlsClass($controls, CLASS_PLAYBACK_READY);
        break;

      case "playing_paused":
        name = arguments[1];
        $controls = controlsEl(name);
        setControlsClass($controls, CLASS_PLAYBACK_PAUSED);
        break;

      case "save_pressed":
        FWRecorder.updateForm();
        break;

      case "saving":
        name = arguments[1];
        break;

      case "saved":
        name = arguments[1];
        var data = $.parseJSON(arguments[2]);
        if (data.saved) {
          $('#upload_status').css({'color': '#0F0'}).text(name + " was saved");
        } else {
          $('#upload_status').css({'color': '#F00'}).text(name + " was not saved");
        }
        break;

      case "save_failed":
        name = arguments[1];
        var errorMessage = arguments[2];
        $uploadStatus.css({'color': '#F00'}).text(name + " failed: " + errorMessage);
        break;

      case "save_progress":
        name = arguments[1];
        var bytesLoaded = arguments[2];
        var bytesTotal = arguments[3];
        $uploadStatus.css({'color': '#000'}).text(name + " progress: " + bytesLoaded + " / " + bytesTotal);
        break;
    }
  };

//  Helper functions ---------------------------------------------------------------------------------------------------

  function setUpFormOptions() {
    var gain = $('#gain')[0];
    var silenceLevel = $('#silenceLevel')[0];
    for (var i = 0; i <= 100; i++) {
      gain.options[gain.options.length] = new Option(100 - i);
      silenceLevel.options[silenceLevel.options.length] = new Option(i);
    }
  }

  function setControlsClass($controls, className) {
    $controls.attr('class', CLASS_CONTROLS + ' ' + className);
  }

  function controlsEl(name) {
    return $('#recorder-' + name);
  }

  function recorderEl() {
    return $('#recorderApp');
  }


//  Button actions -----------------------------------------------------------------------------------------------------

  window.microphonePermission = function () {
    recorderEl().addClass("floating");
    FWRecorder.showPermissionWindow({permanent: true});
  };

  window.configureMicrophone = function () {
    if (!FWRecorder.isReady) {
      return;
    }
    FWRecorder.configure($('#rate').val(), $('#gain').val(), $('#silenceLevel').val(), $('#silenceTimeout').val());
    FWRecorder.setUseEchoSuppression($('#useEchoSuppression').is(":checked"));
    FWRecorder.setLoopBack($('#loopBack').is(":checked"));
  };

});

保存文件后,在recorder.php上传状态后会显示绿色信息。这是当点击箭头保存/上传upload.php开始行动,但没有显示。可以这么说的用户仍然在页面记录器上.php。

2 个答案:

答案 0 :(得分:2)

退出后的任何内容都不会被执行!

试着删除它......

在查询后,请尝试添加:

if($stmt->errorCode() == 0) {
    echo "success";
} else {
    $errors = $stmt->errorInfo();
    print_r($errors);
}

可能会给出一些解释。

同样id将我的数据库执行到行之前:

if($_POST['format'] == 'json') {

还注意到所有表字段都设置为NOT NULL,但您只插入3个字段。如果将它们留空,则会导致错误。

您的username_id字段设置为int,我想您可能尝试使用用户名填充它,这可能是varchar

答案 1 :(得分:0)

我知道问题出在哪里。它只是使用:

if(isset($_FILES['upload_file'])){
在$ stmt之前

很简单...解决了问题。