Chrome Storage Sync按固定顺序获取商品

时间:2017-05-19 20:41:16

标签: javascript google-chrome google-chrome-extension soundcloud

我正在使用Chrome扩展程序,该扩展程序存储来自SoundCloud中的项目的临时播放列表,以便稍后对其执行多项操作。 所以...我知道Chrome存储是一个对象而且“不能”订购本身,但我真的需要以任何可行的方式订购。 我尝试将对象存储在一个数组中,然后在它的末尾推送一个新元素后将该数据存储在存储中,这是一个完美的解决方法,直到有27个对象,chrome告诉我,我已达到内存限制(我需要更多元素来存储。) 将每个元素存储为单独的对象实际上允许我任意数量的它们(我认为50mb,这肯定是足够的),但是get方法以它想要的方式抛出元素(显然,作为一个对象)。 对象使用时间戳键存储,但仍然无法正常工作。

这样做有“轻松的方法”吗? 代码不是明确的,我正在考虑将元素直接添加到新窗口,留下存储调用其他东西并转移到“更轻”的代码,但是首先要知道这是否可能。

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;
}

代码 - 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;

}

我认为重要的是说,除了订单问题之外没有任何问题,一切都运行良好,尽管有些事情可能更加“优雅”。 在此先感谢,希望你能帮忙!

2 个答案:

答案 0 :(得分:0)

问题是您超过QUOTA_BYTES_PER_ITEM,即每个对象允许的存储限制。如果您使用chrome.storage.sync,则仅限8,192 Bytes。使用chrome.storage.local将允许您为每个项目存储无限大小。

注意使用chrome.storage.local会使您的数据成为该计算机的本地数据,因此不会在不同计算机上的浏览器之间同步。

答案 1 :(得分:0)

感谢EyuelDK,最后需要进行异步调用,我将在下一步尝试解决此问题。

代码 - 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;

}

代码 - 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() {

    });

})

}