How to Record Audio and Upload to Folder in Codeigniter
Today we are going to explain how to record manually and upload it to a folder then insert that audio file into the Database using the Codeigniter PHP framework. In this, you can easily record audio and upload it to the destination folder.
Record Audio using Codeigniter
Here are the steps to record audio and upload it to a folder using Codeigniter.
STEP 1 :
- Install the latest version of Codeigniter and set up the required configuration like config, autoload, and database setup.
- Open Application config file, in that file, open autoload and set the database in autoload libraries and set the URL in autoload helper.
- Then we need to set up the base URL in the config file. Open the config file and set the required folder name where your audio folder should be.
- After the configuration, we need to set the Database name so that your uploaded audio file will insert into the database.
- For the audio recording Process, we need to include a js source file. So that your recording will process.
STEP 2:
- After the configuration, you need to create an audio.php file in the views folder. In that audio.php file consists of the design (skeleton) of your recording process.
audio.php file (Views)
<body>
<article>
<section class="experiment recordrtc">
<h2 class="header">
<select style="display:none;" class="recording-media">
<option value="record-video">Video</option>
<option selected value="record-audio">Audio</option>
<option value="record-screen">Screen</option>
</select>
<select style="display:none;" class="media-container-format">
<option>WebM</option</
</select>
<button style="text-align:center;">Start Recording</button>
</h2>
<div style="display: none;">
<button id="save-to-disk" style="display: none;">Save To Disk</button>
<button id="open-new-tab" style="display: none;">Open New Tab</button>
<button id="upload-to-server">Upload To Server</button>
</div>
</section>
</body>
STEP 3 :
- After the audio recording process is done then the audio file moved to the controller. So you need to create one controller file in the name of the Audio.php file in the controller.
- In this audio.php file, you moved the audio file to the destination folder. So you need to create an uploads folder in the application place. So that your recorded audio file will be moved to that uploads folder.
Audio.php file (Controller)
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Audio extends CI_Controller {
/**
* Index Page for this controller.
*
* Maps to the following URL
* http://example.com/index.php/welcome
*- or -
* http://example.com/index.php/welcome/index
*- or -
* Since this controller is set as the default controller in
* config/routes.php, it's displayed at http://example.com/
* So any other public methods not prefixed with an underscore will
* map to /index.php/welcome/<method_name>
* @see https://codeigniter.com/user_guide/general/urls.html
*/
/*-------------- View-------------------*/
public function index()
{
$this->load->view('audio');
}
public function audio_record(){
if (!isset($_POST['audio-filename']) && !isset($_POST['video-filename'])) {
echo 'Empty file name.';
return;
}else{
if (false && isset($_POST['audio-filename']) &&
strrpos($_POST['audio- filename'], "RecordRTC-") !== 0) {
echo 'File name must start with "RecordRTC-"';
return;
}
}
$fileName = $tempName = $file_idx = '';
if (!empty($_FILES['audio-blob'])) {
$file_idx = 'audio-blob';
$fileName = $_POST['audio-filename'];
$tempName = $_FILES[$file_idx]['tmp_name'];
} else {
$file_idx = 'video-blob';
$fileName = $_POST['video-filename'];
$tempName = $_FILES[$file_idx]['tmp_name'];
}
if (empty($fileName) || empty($tempName)) {
if(empty($tempName)) {
echo 'Invalid temp_name: '.$tempName;
return;
}
echo 'Invalid file name: '.$fileName;
return;
}
$filePath = 'uploads/' . $fileName;
$allowed = array('webm', 'wav', 'mp4', 'mkv','mp3', 'ogg' );
$extension = pathinfo($filePath, PATHINFO_EXTENSION);
if (!$extension || empty($extension) || !in_array($extension, $allowed)) {
echo 'Invalid file extension: '.$extension;
return;
}
if (!move_uploaded_file($tempName, $filePath)) {
if(!empty($_FILES["file"]["error"])) {
echo 'Not uploaded because of error #'.$_FILES["file"]["error"];
}
else {
echo 'Problem saving file: '.$tempName;
}
return;
}else {
$data['file'] = $fileName;
$this->load->model('Home_model');
$status=$this->Home_model->insert_audio($data);
}
} }
?>
STEP 4:
Audio (Database)
- You need to save your audio file to the database.
- For that create one Database named called audio and in that database you need to create one table called files. This table having column name id, file, and created time.
STEP 5:
- You need to save your audio file to the database. For that create one file named called Home_model.php in the model folder.
- Call the audio file value to this model in Audio.php in Controller.
- In this model insert the audio file into the database.
Home_model.php file (Models)
<?php
class Home_model extends CI_Model
{
public function insert_audio($data){
return $this->db->insert('files',$data);
}
}
?>
STEP 6:
- Open the browser and run the code.
- Click the Start Recording Button and click upload to server then your audio file save to the database and moved to the destination folder.