关闭浏览器时删除的数据

Data being erased when browser is closed.

本文关键字：数据 删除 浏览器      更新时间：2023-09-26

我有一个存储锦标赛结果的游戏板，我不知道为什么当浏览器关闭时数据（通过下拉菜单输入的游戏结果）被删除。有没有办法让我的结果在服务器运行时持续存在？

结果在main.js中显示如下：

$.post('/postScores', results, function(scores){
  var gameBoard = "";
      for(var j=0;j<scores.length;j++){
          gameBoard+= '<tr>';
          for(var k=0;k<5;k++){             
            gameBoard += '<td>'+scores[k][j]+'</td>';
          }
          gameBoard += '</tr>';
      }
      $("#grid").append(gameBoard);
  });

我的分数存储在这样的server.js中：

 app.post("/postScores", function(req , res){ 
    res.setHeader("Content-Type", "application/json");
    var results = [
  [ "", "team1", "team2", "team3", "team4"],
  ["team1", "x", req.body.e, req.body.h, req.body.k],
  ["team2", req.body.b, "x", req.body.i, req.body.l],
  ["team3", req.body.c, req.body.f, "x", req.body.m],
  ["team4", req.body.d, req.body.g, req.body.j, "x" ]
  ];
   res.json(results);
   res.end();
});

完整程序：https://jsfiddle.net/Amidi/egp1hst3/10/

当您使用 JavaScript 修改当前查看的页面时，这些更改本质上是临时的。下次加载同一页面时，它将再次从浏览器加载 HTML 结构，并将其以原始状态呈现给您。这确实很有意义，因为您希望浏览器呈现服务器发送给您的页面，而不是其他内容。

如果要对UI进行永久更改，则需要将状态存储在服务器上并将更改包含在HTML响应中，或者将状态保存在客户端上（例如在cookie或localstorage中），然后在加载页面后从那里应用修改。

像

这样使用localStorage。

var yourData = '';
localStorage.setItem('gameData',yourData);

检索

var retrievedData = localStorage.getItem('gameData');

请记住，您不能将数组存储在 localStorage 中，因此您必须在保存到 localStorage 之前进行字符串化，并在检索数据时解析。另请记住，您不能在localStorage中存储超过 5MB 的 ，这对您来说应该不是问题。如果你想在浏览器缓存之外保持持久性，你将不得不使用某种数据库。

相关文章：