Spotify api 1.0.0获取给定轨道播放列表的图像

Question

在这里让我不知道如何获取给定轨道播放列表的图像。

我只是不能得到它的工作。

这是我的代码。

我包括两个播放列表，一个是由一组给定的音轨和一个实际存在的音轨组成。

我在做什么错第一个？我是否正确创建临时播放列表？

require([ 
      '$api/models', 
      '$views/image#Image', 
      '$views/list#List' 
     ], function(models, Image, List) { 
      'use strict'; 

      var image, trackUris, tracks = [], customPlaylist, customPlaylistList; 

      // list of track uris 
      trackUris = [ 
       'spotify:track:0jakfggA0WkYpkAXni6pts', 
       'spotify:track:2g1EMRbn6So6zGTdwNyySf', 
       'spotify:track:4kNfh9In8hjuuERSZhwTTx', 
       'spotify:track:1JHUxxd77M4ViaqJZfBdl0', 
       'spotify:track:6x3db7BbBjDYZH2ZAcvYyC', 
       'spotify:track:6czyeVTQtHYPnZgXE6op0I', 
       'spotify:track:51Vyh1xfCD27SneoG7NAhb' 
      ]; 

      // get track objects from uris 
      for (var i = 0; i < trackUris.length; i++) { 
       tracks.push(models.Track.fromURI(trackUris[i])); 
      } 

      // create temporary playlist 
      var title = 'tmp_' + Date.now(); 
      var tmp = models.Playlist.createTemporary(title).done(function(playlist){ 

       // get tracks collection and add tracks to it 
       playlist.load(['tracks']).done(function(){ 
        for (var i = 0; i < tracks.length; i++) { 
         playlist.tracks.add(tracks[i]); 
        } 
       }); 
       customPlaylist = playlist; 

      }).fail(function() { 
       console.log("Failed"); 
      }); 

      // create image of playlist 
      image = Image.forPlaylist(customPlaylist, {width: 200, height: 200, player: true}); 
      document.getElementById('customPlaylistCover').appendChild(image.node); 

      // create a list view for the playlist 
      customPlaylistList = List.forPlaylist(customPlaylist); 
      document.getElementById('customPlaylistList').appendChild(customPlaylistList.node); 
      customPlaylistList.init(); 

      // get all the above for an existing playlist 
      var playlist = models.Playlist.fromURI('spotify:user:116690321:playlist:6l3dvYJaGrX5mqkNntbyLx'); 
      image = Image.forPlaylist(playlist, {width: 200, height: 200, player: true}); 
      document.getElementById('playlistCover').appendChild(image.node); 

      var playlistList = List.forPlaylist(playlist); 
      document.getElementById('playlistList').appendChild(playlistList.node); 
      playlistList.init(); 

     }); 

Answer 1

你在这里没有做错任何事。目前，显示占位符图像而不是用于临时播放列表的马赛克。

调试代码（如果未缩小会有所帮助）会向您显示一个占位符图像（带有注释的灰色背景）被设置为节点图像，但保持隐藏状态直至超过时间限制（小于一半一秒）。在此期间，播放列表的图像属性正在加载。如果图像加载成功，则在时间限制未通过时，占位符将被替换或完全不显示。下面的代码尝试从临时播放列表中加载图像属性，该临时播放列表失败，从而显示占位符。

require(['$api/models', '$views/image#Image'], function(models, Image) { 
    models.Playlist.createTemporary("Temporary Playlist").done(function(playlist) { 
     playlist.load("tracks").done(function(playlist) { 

      // Adding some random tracks to the temporary playlist 
      playlist.tracks.add(models.Track.fromURI("spotify:track:2YtDzuAcSVk2j4UFXON5iG")); 
      playlist.tracks.add(models.Track.fromURI("spotify:track:6xzCQrXrn0uOOKBQZK1zsF")); 
      playlist.tracks.add(models.Track.fromURI("spotify:track:0m1sOrAltrx0oQlqKVUf75")); 
      playlist.tracks.add(models.Track.fromURI("spotify:track:40RFNnTV6CAounCsx56TZ2")); 

      // Checking if the playlist image can be loaded. 
      // This code holds no purpose other than showing that 
      // loading an image from a temporary playlist fails 
      playlist.load("image").done(function(playlistWithImage) { 
       console.log("Loaded image."); 
      }).fail(function(playlistWithImage) { 
       console.log("Failed to load image."); 
      }) 

      // Appending the playable node to the body tag 
      var image = Image.forPlaylist(playlist, {width: 100, height: 100, player : true }); 
      document.body.appendChild(image.node); 
     }); 
    }); 
}); 

我不知道这是否被认为需要修复，但它是这样的。