2015-07-31 23 views
2

Я пытаюсь закодировать виджет, используя Soundcloud API (локально).ошибка в Soundcloud API

Вот мой код:

<!DOCTYPE html> 
<html> 
<head> 
<title>Soundcloud musics</title> 
</head> 
<body> 
<h1>Soundcloud musics</h1> 
<iframe id="iframe" 
    class="iframe" 
    width="100%" 
    height="465" 
    scrolling="no" 
    frameborder="no"> 
</iframe> 
<script src="api.js"></script> 
<script> 
    var player; 
    player = SC.Widget(document.getElementById('iframe')); 
    console.debug(player); 
    player.load('https://soundcloud.com/somesong', null); 
</script> 
</body> 
</html> 

ошибка я получил от работы это:

Uncaught TypeError: Cannot read property 'substr' of null 
E @ api.js:204 
d @ api.js:328 
n.exports.v @ api.js:326 
(anonymous function) @ index.html:21 

Я вошел в свернутом код апи SoundCloud в в Js Beautifier, поэтому я могу отслеживать ошибки , Вот код: https://jsfiddle.net/0anL7jfs/

Я что-то не так? Похоже, что проблема исходит от функции SC.Widget() ...

+0

Я не уверен, что вы имеете в виду 'locally'; soundcloud api работает путем потоковой передачи треков со своего сайта. –

+0

@ l'L'l Я подразумевал, что я выполняю эту страницу с моего компьютера, а не с сервера. Я не знал, было ли это полезно, поэтому я предпочел сказать это ... но не правильный путь. Извините, что – Devz

ответ

2

Вам нужно изменить пару вещей:

Define src в пределах вашего фрейма с игроком виджет апи URL и свойства:

<iframe id="iframe" 
    class="iframe" 
    width="100%" 
    height="465" 
    scrolling="no" 
    frameborder="no" 
    src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/76067623&amp;auto_play=false&amp;hide_related=true&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"> 
</iframe> 

Bind ваших событий с widget.bind:

<script type="text/javascript"> 
(function(){ 
    var iframeElement = document.getElementById('iframe'); 
    var widget = SC.Widget(iframeElement); 
    widget.bind(SC.Widget.Events.READY, function() { 
     console.log('Ready'); 
     widget.bind(SC.Widget.Events.PLAY, function() { 
      widget.getCurrentSound(function (sound) { 
       console.log(sound.title); 
      }); 
     }); 
      widget.bind(SC.Widget.Events.FINISH, function() { 
       console.log('Finished'); 
     }); 
    }); 
}()); 
</script> 

Пример:

http://jsfiddle.net/dqz1jmzo/(JQuery версия)

+0

Дело в том, что я хотел бы получить доступ к событиям, выпущенным виджетам и т. Д. Я не хочу просто играть музыку на своей странице. И добавление JQuery на мою страницу не решает ничего. – Devz

+0

Я все еще не понимаю, что вы пытаетесь сделать; какие события вы имеете в виду. –

+0

Тот, когда песня закончена, например. Как описано здесь: https://developers.soundcloud.com/docs/api/html5-widget#events – Devz

Смежные вопросы