Chrome Storage Syncはアイテムを永続的な順序で取得します

Question

私は、後でいくつかのアクションを実行するために、SoundCloudのアイテムからの一時的なプレイリストを保存するクロムエクステンションで作業しています。 Chromeのストレージはオブジェクトであり、そのものをに注文することはできませんが、実現可能な方法でその注文が本当に必要です。 オブジェクトを配列に格納しようとしましたが、最後に新しい要素を押し込んだ後にその配列を記憶域に格納しようとしましたが、27個のオブジェクトがあるまで、完全な回避策でした。 ）各要素を別々のオブジェクトとして格納することで、事実上どのような量でも構いませんが（50mbだと思いますが）、メソッドが必要な方法で要素をスローします（明らかに、オブジェクト）。 オブジェクトにはタイムスタンプキーが格納されていますが、まだ動作していません。

「軽い方法」がありますか？ コードは確定的ではありません。新しいウィンドウに直接要素を追加することを考えています。ストレージを呼び出して他のものを呼び出し、「軽い」コードに移動しますが、これが何らかの理由で可能かどうかをまず知りたいと思います。

CODE - popup.js（順序が永続的でない場合、ここではある）

function appendTracks(){ 

    chrome.storage.sync.get(null, function (storageObject) { 

//TODO check if is song 
      $.each(storageObject, function(key, trackData) { 

       trackContainer(trackData["permalink"]); 

      }); 

     }); 
} 
function trackContainer(trackPermalink){ 
    console.log(trackPermalink); 
    var trackWidget; 
    $.getJSON(
    'http://soundcloud.com/oembed' + 
    '?format=json' + 
    '&url='+trackPermalink+'&visual=false' 
).done(function (embedData) { 
    trackWidget = embedData.html; 
    $("#mainPlayList").append(trackWidget); 
}); 
console.log(trackWidget); 
return trackWidget; 
} 

CODE - main.js（キーとしてタイムスタンプを持つストレージセッター）

function downloadClick(a) { 
    playListName = ""; 
    var b = this; 
    $.ajax({ 
     url: a.data.reqUrl 
    }).done(function(a) { 

     var time = Date.now(); 
     var timeStamp = Math.round(time/1000); 

     var key = timeStamp.toString()+"queueSc"; 

     var trackData = { 
      "trackId" : a["id"], 
      "trackTitle" : a["title"], 
      "thumbnail" : a["artwork_url"], 
      "streamUrl" : a["stream_url"], 
      "permalink" : a["permalink_url"], 
      "duration" : a["duration"], 
      "genre" : a["genre"]}; 

     trackData[key] = "key"; 

     getStorage(null,function(storageObject){ 

      if(!isTrackInList(trackData,storageObject)){ 

      setStorage({ 
        [key]: trackData 
      }); 

      }else{ 

       console.log("ya esta en la lista"); 

      } 

      });  

    }) 
} 

function isTrackInList(trackData, storageObject){ 

    var isInList = false; 
    $.each(storageObject, function(key, value) { 

     if(trackData["trackId"] == value["trackId"]){ 
      isInList = true; 
     } 
    }); 

    return isInList; 

} 

I注文問題以外に問題はないと言っても大丈夫だと思うのですが、すべてがうまくいっていますが、確かに「もっとエレガント」なものがあります。 おかげさまで、お手伝い願います！

Answer 1

問題は、QUOTA_BYTES_PER_ITEMを超過していることです。つまり、1オブジェクトあたりの保存容量の上限です。 chrome.storage.syncを使用する場合は、8,192 Bytesに限定されます。 chrome.storage.localを使用すると、アイテムごとに無制限のサイズを保存できます。

chrome.storage.localを使用すると、データはそのマシンに対してローカルになり、別のマシンのブラウザ間で同期されません。

Answer 2

EyuelDKのおかげで、最後に非同期呼び出しが必要でしたが、私は次の問題を解決しようとします。

CODE - popup.js

function appendTracks(){ 

    chrome.storage.local.get("souncloudQueue", function (storageObject) { 

      var length = storageObject["souncloudQueue"].length; 

      for (var i=0;i<length;i++){ 

       var trackPermalink = storageObject["souncloudQueue"][i]; 

       console.log(i, trackPermalink); 

       $("#mainPlayList").append(trackContainer(trackPermalink)); 

      } 

     }); 
} 

function trackContainer(trackPermalink){ 
    console.log(trackPermalink); 
    var trackWidget; 

$.ajax({ 
    url: 'http://soundcloud.com/oembed' + 
    '?format=json' + 
    '&url='+trackPermalink, 
    dataType: 'json', 
    async: false, 
    success: function(data) { 
     trackWidget = data.html; 
    } 
}); 
console.log(trackWidget); 
return trackWidget; 

} 

CODE - だからmain.js

function downloadClick(a) { 

var trackUrl = a.data.reqUrl; 

console.log(trackUrl); 

getStorage("souncloudQueue", function(callback){ 

    console.log(callback["souncloudQueue"]); 

    var tempArray = callback["souncloudQueue"]; 

    tempArray.push(trackUrl); 

    setStorage({"souncloudQueue": tempArray}, function() { 

    }); 

}) 

}