Question

我构建了一个聊天应用程序，并使用localStorage即使在页面刷新后也能保持对话。如果聊天结束，我想删除localStorage并清除聊天窗口，这是正常的。但是，如果用户再次启动聊天并刷新页面，而不是之前的聊天对话，则会恢复到localStorage

以下是我的代码：

var CHAT_MSG_LOCAL = []; //store messages into it
    CHAT_MSG_LOCAL.push(msgObj); //push message into the variable

    //save in local storage  when page refreshed 
    $(window).on('unload', function () {            
        saveLocalData(CHAT_MSG_LOCAL);  
    });

    //Retrive from local storage when page load
    $(document).ready(function () {
      retriveLocalData();
      var data = retriveLocalData();
      if (data.length > 0)
        for (var i = 0; i < data.length; i++) {
            output(data[i]); // generate html
        }
    });

    //Chat End
    $(".close-conversation").on("click", function (e) {
            e.preventDefault();                
            localStorage.removeItem('local-messages');
            localStorage.setItem('local-messages', []);

        });

    //save function
    function saveLocalData(CHAT_MSG_LOCAL) {
        var messageString = JSON.stringify(CHAT_MSG_LOCAL);
        localStorage.setItem('local-messages', messageString);

    }

    //retrive function
    function retriveLocalData() {
        var localmsgObj = localStorage.getItem('local-messages');
        var retrievedObject = {};
        if (localmsgObj.length > 0) {
            retrievedObject = JSON.parse(localmsgObj);
        }
        return retrievedObject;
    }

请帮我找错。提前谢谢。

Answer 1

您正面临问题，因为上述代码并未清除CHAT_MSG_LOCAL参数。

请使用以下代码将参数设为空。

 $(".close-conversation").on("click", function (e) {
      e.preventDefault();                
      localStorage.removeItem('local-messages');
      localStorage.setItem('local-messages', []);
      CHAT_MSG_LOCAL = []; //change
  });

localstorage在页面刷新后恢复已删除的数据

1 个答案: