在web应用程序中存储数据

Storing Data in a web application

本文关键字:存储 数据 应用程序 web      更新时间:2024-04-19

我是一名高中生,正在创建一个相当简单的类似问答的应用程序,试图了解更多关于编码的信息。我使用该应用程序的目标是让用户回答几个问题,每个问题的答案都与一个值相关联,最终结果将是所有值的总和。

我只是不知道如何存储用户选择的数据/值,以便以后使用它们来创建最终和。我应该将每个值与一个稍后使用的变量相关联吗?如果是,如何?

以下是我理想测验中的一个示例问题:http://jsfiddle.net/J7m7m/342/.

function changeText(value) {
    document.getElementById('count').value = 100 * value;
}
<h1>Personal information</h1>
    
<h2>Ability</h2>
    
<input type="radio" onclick="changeText(.5)" name="group2" />Beginner</label>
<input type="radio" onclick="changeText(.3)" name="group2" />Intermediate</label>
<input type="radio" onclick="changeText(.15)" name="group2" />Advanced</label>
</div>
<h3/>Likelihood of Injury (%)
<input type="text" id="count" value="" />

您可以使用Javascript本地存储对象。您的值将在浏览器中存储任意时间,或者浏览器将被删除。

看看w3c学校关于Web存储的解释和更多信息:

本地存储对象

localStorage对象存储的数据没有过期日期。这个当浏览器关闭时,数据不会被删除第二天、第二周或第二年可用。

示例:

// Store
localStorage.setItem("lastname", "Smith");
// Retrieve
document.getElementById("result").innerHTML = localStorage.getItem("lastname"); 

为什么不使用javaScript对象在前端存储数据呢。您可以在服务器上通过json编码直接传递这个对象,将其存储到数据库中。示例:

var g_obj = new Object();
g_obj.level = new Object();
g_obj.level.diff = "Beginner";
g_obj.level.injury = "50";
g_obj.answers = new Array();
g_obj.answers[0] = new Object();
g_obj.answers[0].id = "1";
g_obj.answers[0].correct = "1";
g_obj.answers[0].marks = 10;
g_obj.answers[1] = new Object();
g_obj.answers[1].id = "2";
g_obj.answers[1].correct = "0";
g_obj.answers[1].marks = 10;
g_obj.answers[2] = new Object();
g_obj.answers[2].id = "3";
g_obj.answers[2].correct = "1";
g_obj.answers[2].marks = 15;

存储的要求是什么?

  • 您想在本地还是服务器端存储数据
  • 它应该安全吗?数据库后端密码受保护
  • 您认为需要多少存储空间
  • 数据是否必须持久

如果您对最大5mb的半持久存储感到满意,则不安全地存储客户端:Localstorage或IndexedDB(200mb)

如果你想保护你的数据,你必须创建一个像MySQL这样的数据库和一些后端控制器来处理来自你的web应用程序的请求。

我认为localStorage是您的最佳选择:)