CODEWITHSUNDEEP
javascriptsoundcloud
Clonebaby
Clonebaby

Reputation: 53

Uploading song to Soundcloud account using javascript

I am trying to upload a song to soundcloud using the souncloud API and javascript. But I don't seem to be able to do it. This is my javascript

function ADDTRACK() {
    var test = document.getElementById('SongTrack').files[0];
    SC.get("http://api.soundcloud.com/users/redstr/tracks.json?client_id=3200814596a029b47877e63edfe6066c", {
        limit: 1
    }, function(tracks) {
        SC.POST({
            tracks: {
                description: 'This track was recorded in Berlin',
                asset_data: '@' + test
            }
        });
    });
}

And this is my HTML upload

  <input type="file" id ="SongTrack" name="pic" accept="audio/*" />
      <button type="button"   onclick="ADDTRACK()" />Add TRACK</button>

I get no errors, so can anyone point me in what im doing wrong?

Upvotes: 5

Views: 1305

Answers (2)

BVMiko
BVMiko

Reputation: 117

I ended up wanting to upload audio files via Javascript SDK as well, so I reverse engineered the PHP and JS SDKs to make it work.

First, you should make sure you have the Javascript SDK working. We're only using it for the authentication token (using an undocumented method). Aside from the token, the rest of it is handled manually using $.ajax and a FormData object.

HTML:

<script src="//cdn.jsdelivr.net/jquery/1.8.3/jquery-1.8.3.min.js"></script>
<script src="//connect.soundcloud.com/sdk.js"></script>
<button id="login">log in</button>
<form>
    <label>Title: <input name="title" disabled /></label><br>
    <label>File: <input name="file" type="file" accept="audio/*" disabled /></label><br>
    <button type="submit" disabled >Submit</button>
</form>

Javascript:

SC.initialize({
    client_id: "INSERT_CLIENT_ID",
    redirect_uri: "INSERT_REDIRECT_URI"
});

$("#login").click(function(){
    SC.connect(function(){
        $('form input,form button').removeAttr('disabled');
    });
});

$('form').submit(function(e) {
    var fd = new FormData();
    fd.append('oauth_token', SC.accessToken());
    fd.append('format','json');
    fd.append("track[title]", $(this).find('input[name=title]').val());
    fd.append("track[asset_data]", $(this).find('input[name=file]').prop('files')[0]);

    $.ajax({
        url: 'https://api.soundcloud.com/v1/tracks',
        type: 'POST',
        data: fd,
        processData: false,
        contentType: false,
        xhr: function() {
            var xhr = $.ajaxSettings.xhr();
            xhr.upload.onprogress = function(e) {
                if(e.lengthComputable) {
                    var percent = Math.floor((e.loaded / e.total) * 100);
                    console.log(percent  + '% uploaded');
                }
            };
            return xhr;
        }
    }).done(function(e) {
        console.log('Upload Complete!');
        console.dir(e); // This is the JSON object of the resulting track
    });
    e.preventDefault();
});

Upvotes: 1

SuperKingTurban
SuperKingTurban

Reputation: 27

From: http://developers.soundcloud.com/docs/api/guide#uploading

// the JavaScript SDK does not by itself have access
// to the filesystem, so instead this example records
// some audio in the browser and uploads it.

        SC.connect(function() {
          SC.record({
            start: function() {
              window.setTimeout(function() {
                SC.recordStop();
                SC.recordUpload({
                  track: { title: 'This is my sound' }
                });
              }, 5000);
            }
          }    
    });

So you can't directly upload the track with javascript.

Upvotes: 2

Related Questions