Question

我正在使用Amplitude.js播放动态歌曲。服务器端脚本是php。我的目标是检查是否正在播放任何歌曲，如果是，则导航到该页面之前，然后保存该歌曲的索引和当前位置（以百分比为单位）。然后在下一页上，我必须从同一位置继续播放这首歌。到目前为止，我已经成功地在下一页上播放了同一首歌曲，但是从一开始就在播放。

这里$ feat是一个像这样创建的数组：

$featured = array();
        foreach ($all as $key => $value) {
           array_push($featured, array(
                "id" => $value['audio_id'],
                "name" => $value['audio_name'],
                "artist" => $value['audio_artist'],
                "album" => $value['product_name'],
                "url" => l($value['audio_file_path'].$value['audio_file']),
                "cover_art_url" =($value['product_image_path'].$value['product_image']),
           ));
        }

我的JavaScript代码可初始化Amplitude js：

<script>
Amplitude.setDebug( true );
let _songs = JSON.parse('<?=$feat?>');
Amplitude.init({
  "songs":_songs,
});
</script>

在每页的更改中，我保存了歌曲的当前索引和当前播放歌曲的百分比。它的工作正常。 Home / song_stats将在会话中保存歌曲信息

<script>
    $(window).on("beforeunload", function() {
    song_percent =  Amplitude.getSongPlayedPercentage();
    song_index = Amplitude.getActiveIndex();

    $.ajax({
      type: "POST",
      url: "<?=g('base_url')?>Home/song_stats", 
      data:  "song_percent="+song_percent+"&song_index="+song_index,
      dataType: "json"
    });
    return false;    
    });

</script>

此javascript代码在单击时播放歌曲，并且如果有会话数据可用于继续播放歌曲，它将继续播放该歌曲。

<script>
$(window).load(function(){

  function playmysongs(_index){
  $('div[amplitude-song-index="'+_index+'"]').click();
}


  var appender = '';
  for(var i =0;i<_songs.length;i++){
    appender+='<div class="rixinside-list"><a onclick="playmysongs('+i+')"><span class="album_img"><img src="'+_songs[i].cover_art_url+'" class="img-responsive"/></span><span class="album_name">'+_songs[i].album+'<span class="album_artist">'+_songs[i].artist+'</span></span></a></div>';
  }
$('#playlist-container .rixplaylist').append(appender);

  //cont song
     $.ajax({
      type: "POST",
      url: "<?=g('base_url')?>Home/continue_song",
      data:  "",
      dataType: "json",
      success: function(response){
        playmysongs(response.song_index);
        Amplitude.setSongPlayedPercentage(response.song_percent);
      }
    });
    return false;  
    //cont song end
});


$('#playlist-container').click(function(){
  $('.rixplaylist').toggle();
});
$('#wishlist-container i').click(function(){
  $(this).toggleClass('like');
});

尽管“ response.song_percent”显示正确的值，但下面的行不起作用。任何帮助将不胜感激。 Amplitude.setSongPlayedPercentage（response.song_percent）;

Answer 1

可能存在异步问题：在设置百分比之前，尝试用代码本身替换对“ playmysongs”函数的调用，或者在设置百分比值之前添加200的超时时间。

Answer 2

使用AmplitudeJS 3.3或更高版本有一些选项。

首先，在导航之前，我将正在播放的歌曲的当前位置保存到本地存储或cookie中。如果要保存位置服务器端，也可以这样做。如果您使用Java编写所有内容，则本地存储可能会更容易。

加载页面时，在获得歌曲播放百分比（或当前时间）之后，您可以使用以下两个选项之一。

1。使用Amplitude.setSongPlayedPercentage（percent）。

这样做是将正在播放的 current 歌曲设置为定义的百分比。密钥是最新的。现在，如果用户跳到歌曲3，转到下一页，将歌曲的播放百分比设置为35，它将执行数组中的第一首歌曲，这将是错误的歌曲。在执行Amplitude.setSongPlayedPercentage之前，必须将Amplitude.init（）方法中的start_song键设置为用户播放的歌曲的索引。然后，您可以运行Amplitude.setSongPlayedPercentage（percent），它将正常运行。

2。使用Amplitude.skipTo（seconds，index）;

此方法较新，但较简单。您需要做的就是将歌曲中的几秒钟保存到本地存储，Cookie中，或者将其与歌曲索引一起存储。加载页面时，初始化AmplitudeJS之后，可以运行Amplitude.skipTo（seconds，index）。秒是用户到歌曲的距离，索引是歌曲在歌曲数组中的索引。它将从那里恢复。

希望这会有所帮助！

使用Amplitude.js在下一页上继续播放歌曲

2 个答案: