标签: soundmanager2

我正在制作一个音乐播放页面,我将SoundManager 2用于AngularJs.我正在使用远程API来播放歌曲URL.我增强了一个angular-soundmanager2点击事件处理程序:

element.bind('click', function () {
    if (angular.isFunction(scope.loadFunction)) {
        scope.loadFunction(scope.song, function () {
            $log.debug('adding song to playlist');
            addToPlaylist(scope.song.playDetails);

        })
    } else {
        $log.debug('adding song to playlist');
        addToPlaylist(scope.song);
    }
});

我添加了一个部分,调用scope.loadFunction(song,callback)此函数并加载一个歌曲URL后,它调用一个回调来将控制权交给angular-soundmanager2.

问题是在chrome for android上我得到一个错误:

Failed to execute 'play' on 'HTMLMediaElement': API can only be initiated by a user gesture.

如果歌曲从头开始并且未使用异步加载,则不会发生这种情况.

它有什么变通方法吗？

有许多可用于HTML5音频的JavaScript库,可以使开发人员的工作更轻松,确保跨浏览器兼容性或支持旧版浏览器的Flash回退.

除了本文之外,我在比较方面没有找到太多的内容.

建议使用以下哪些库以及用于何种目的？在文档和支​​持方面我可以期待什么(例如:这个库可能留下来吗？)

• Audio5JS
• 蜂鸣器
• HowlerJS
• jPlayer
• MediaElementJS
• SoundJS
• SoundManager2

我不需要UI功能来满足我的需求,而是希望保持简洁.这似乎使Audio5JS成为首选候选人.但是,我想知道这是否是一个明智的选择,因为它似乎没有像jPlayer那样大的社区.

编辑:我只需要根据用户输入播放音频文件(完整和/或部分),并为给定文件循环播放(即:循环文件本身或循环其中的一部分.)

关于如何选择JS库来完成工作的一般准则也将受到欢迎.

我主要想节省自己需要尝试所有这些库(以及更多)以找出他们的专业人士和骗子.

谢谢.

我有一个使用Soundmanager2的网络音频播放器.现在在锁定屏幕上播放/暂停工作并且prev/next不起作用.我在iOS 7上工作,但我无法弄清楚原因.

我看到很多关于在本机应用程序中设置轨道图像和播放器控件的讨论,但不是在音频Web应用程序中.那就是说我想知道为什么它退出iOS8工作以及我可以做些什么来添加一个轨迹图像？

更新:控件在iOS 8中不起作用,仅在iOS7上有效.

我试图在调用play()方法的某个时间使用setPosition设置SoundCloud中样本的位置.我需要在样本开始播放之前设置它.现在这段代码不起作用:

SC.whenStreamingReady(function() {
            var sound = SC.stream("/tracks/141543551");
            sound.play();
            sound.setPosition(300);
        });

但是,当我在播放样本时调用setPosition时,它可以正常工作.

SC.whenStreamingReady(function() {
                setTimeout(function () {

                sound.pause();

                var positionCallback = function (eventPosition) {
                    this.clearOnPosition(0, positionCallback);
                    this.resume();
                };
                sound.onPosition(0, positionCallback);
                sound.setPosition(30000);


                sound.play();

 }, 5000);

    });

如何在播放样本之前使用setPosition()？

我正在尝试使用SoundManager2播放多个音频文件,到目前为止,这是我能找到的唯一一个工作示例.

<script src="/path/to/soundmanager2.js"></script>
<script>
soundManager.setup({
  url: '/path/to/swf-files/',
  onready: function() {
    var mySound = soundManager.createSound({
      id: 'aSound',
      url: '/path/to/example.mp3'
    });
    mySound.play();
  },
  ontimeout: function() {
    // Hrmm, SM2 could not start. Missing SWF? Flash blocked? Show an error, etc.?
  }
});
</script>

即使我可以example.mp3使用上面的示例,我也想使用此示例中显示的播放列表.遗憾的是,该页面没有提及有关如何实现播放列表功能的任何内容.

我目前有一个Json返回给定歌曲艺术家的mp3路径,如下所示:

{
  "john_doe":"/path/to/audio/john_doe.mp3",
  "jane_smith":"/path/to/audio/jane_smith.mp3",
}

那么,我如何将这个json数据合并成一个播放列表,例如2首歌曲.

我目前正在考虑将Soundmanager2用作小型项目的音频播放器.我很喜欢SM2,但不幸的是我找不到一个能够为内置播放器提供基本控件(播放,暂停,进度条,时间,音量控制)的实现.

我找到的唯一的东西就是基本的玩家.

你们有没有人知道如何使用Soundmanager2和经典的控制界面(像这样)？

我想知道是否有任何方法可以从soundcloud轨道创建源节点(https://dvcs.w3.org/hg/audio/raw-file/tip/webaudio/specification.html#MediaElementAudioSourceNode).

我对网络音频API很满意,但对于soundcloud sdk来说是新手,据我所知,它依赖于soundmanager2.那么也许soundmanager2可以提供一些选项吗？

问候

如何在soundmanager2中声音后启动声音,我的意思是当第一个声音结束时,第二个声音开始,第二个结束第三个开始等等.

在我的反应应用程序中使用SC.stream,我只是试图从soundcloud API播放一首曲目.这是我的代码:

SC.initialize({
    client_id: '12xxx' // my client ID
  });

//[...]

console.log(this.props.track.trackId); // I get here successfully the trackId from the song I'd like to play

SC.stream('/tracks/'+this.props.track.trackId, function(track){
  track.play();
  console.log(track); // I successfully get the track object here. playState attribute is on 1 
});

不幸的是,曲目从未开始播放.我在控制台中没有错误.

编辑:问题仅在chrome上,它在firefox和safari上完美运行.我现在更加困惑.

编辑2:它似乎与不在Chrome上运行的HTML5播放器相关联:当您在chrome:// plugins /重新启用Flash播放器时,通过选中"始终允许运行",它可以正常工作

我正在使用soundmanager的bar-ui js.

<div id="sm2-99943" class="sm2-bar-ui content compact flat full-width playlist full-width-player ">
    <div class="bd sm2-main-controls">
        <div class="sm2-inline-element sm2-button-element">
            <div class="sm2-button-bd" style="background: transparent url(http://support.simplepodcaster.com/wp-content/uploads/2018/04/podcast_channel_artwork-150x150.png) repeat scroll 0% 0% / cover ;">
                <div id="spp-player-background"> </div>
                <a href="#play" class="sm2-inline-button play-pause">Play / pause</a>
                <div class="eq">
                    <span class="bar bar-1"></span>
                    <span class="bar bar-2"></span>
                    <span class="bar bar-3"></span>
                    <span class="bar bar-4"></span>
                </div>
            </div>
        </div>
        <div class="sm2-inline-element sm2-inline-status progressbar" style="padding-right:0px !important;">
            <div class="sm2-playlist">
                <div class="sm2-playlist-target" style="max-width: 100% !important;"></div>
            </div>
            <div class="sm2-progress">
                <div class="sm2-progress-bd">
                    <div class="sm2-progress-track">
                        <div class="sm2-progress-bar1" style="display:none;"></div>
                        <div …