Javascript: getting Audio via POST

Question

I may be coming at this from completely the wrong angle (if this is the case then please feel free to tell me so) but....

I have a music app in which a user can upload a music track and then later on preview it.

The directory where the audio is stored is protected with .htaccess to prevent unauthorised access:

deny from all

Protecting this directory obviously prevents the files being accessed by Javascript:

var track = new Audio('path/to/file');

I want to be able to validate the user and then return the track through another script by passing extra info with the request for the page (too much data for a GET request).

var track = new Audio('path/to/script/to/return/audio');

Is this possible? Pretty sure it's not so if you can think of a solution, I'd be keen to hear.

That's definitely possible, can you specify which backend technology you're using? — ArtoAle, May 13 '14 at 16:03
PHP. THe issue isn't on the PHP end, it's just the actual sending of the post data when requesting the file — Fraser, May 13 '14 at 16:06
Got you - sorry :) What about downloading the audio with AJAX? You can send the POST request as you like — ArtoAle, May 13 '14 at 16:13
Good idea. Is there a way to pass that into a new Audio object once I've retrieved it? — Fraser, May 13 '14 at 16:22
Yep! Have a look at this: http://stackoverflow.com/questions/12467922/setting-html5-media-source-using-ajax — ArtoAle, May 13 '14 at 16:24

score 2 · Accepted Answer · edited May 23 '17 at 12:27

Why don't you serve your audio file via a php script that would

check user credentials and
stream the data using the right Mime Type ?

Something like (inspired by php output file on disk to browser SO question)

in get-audio.php file

<?php 
// check user credentials
if($_GET['auth_token'] != '12345') exit;

// read the audio file
$name = $_GET['path'];
if (file_exists($name)) {

    // send the right headers
    header("Content-Type: audio/mp3");
    header("Content-Length: " . filesize($name));

    // dump the file and stop the script
    readfile($name)
    exit
}

And then, in javascript :

var track = new Audio('get-audio.php?auth_token=12345&path=path/to/file');

Javascript: getting Audio via POST

1 Answers1