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

여기서 아무런 잘못하지 않았습니다. 현재 임시 재생 목록에 대한 모자이크 대신 자리 표시 자 이미지가 표시됩니다.

코드를 디버깅하면 (축소되어 있지 않은 경우 도움이됩니다) 자리 표시 자 이미지 (메모가있는 회색 배경)가 노드의 이미지로 설정되어 있지만 시간 제한이 지날 때까지 숨겨진 상태로 유지됩니다 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); 
     }); 
    }); 
}); 

이 고정을 필요로 간주됩니다 어떤 경우 나도 몰라,하지만 그것이있는 방법입니다.