存储按钮点击数据的安全方法

Question

我正在尝试找出最安全的方法来存储用户单击按钮时使用的数据。

我知道您可以像这样将数据存储在按钮标签的属性（value 属性或 data- 属性）中：

<button type="button" value="1" data-value="1">Click me!</button>

但问题是用户（可能真的只有高级用户）可以使用 firebug 或其他一些应用程序操纵该值，然后单击按钮并发送不同的数据。我完全理解在尝试对发送的数据执行任何操作之前需要检查输入。

我还发现我可以使用 jQuery 的 .data() 将数据附加到 dom 元素，这似乎更有用。我不确定数据是如何存储的，但我认为它更难操作。

真正让我对这个问题感兴趣的是当我在 firebug 中查看 Soundcloud 的 代码时，我看到 none 28=] 按钮有附加到按钮的数据。我试过 deleting/manipulating elements/data 按钮仍然有效。所以这让我想到他们可能正在使用与 jquerys data() 正在做的类似的过程。

我只想知道有没有更安全的方式来存储数据，或者有什么方式可以让用户在点击按钮之前无法操作数据。

Answer 1

如果您要记录按钮点击，最安全的跟踪方法是在服务器端保存和验证。

例如，当您在 Soundcloud 上点击一个赞按钮时，它会向 Soundcloud 的服务器发出一个 HTTP 请求，记录您点击了该按钮，并将其标记为收藏。这样，如果同一用户在以后的任何时候单击该按钮，它都可以在增加收藏夹数量之前进行检查。

按钮中显示的数字也是在呈现视图时从数据库中提取的。

Answer 2

这是一个很大的话题，你有很多东西要学，在这里发表评论太多了。 HTML 源中属性中的任何内容 "stored" 绝对不安全，可以非常容易地更改。

处理此问题的最常见方法是使用 cookie，但即使付出一些努力也可以操纵它们。

如果安全很重要，找到一些识别您的用户的方法（可能通过 IP，但即使那样也不是万无一失的！）并将数据保存在您的服务器上，链接到一个可以在之后检索的用户 ID单击按钮。

Answer 3

用户始终可以操作数据。没有什么能阻止高级用户访问对象属性或自行调用 jquery.data()。

你可以在 vanilla js 中做的事情是：

    var div = document.getElementById("test");
    div.something = "hidden value";
    
    div.addEventListener("click", function() {
        alert(this.something);
    });

<div id="test">click me</div>

最好的方法是服务器端验证发送的数据是否有效。

除此之外，您可以尝试将代码包装在匿名函数中以拒绝用户访问该对象：

(function() {
    var data = {};
    data.something = "test";
})()

但是一旦用户操作您的文件并添加例如调试器语句，即使这样也会失败。

Answer 4

考虑这个函数：

function setupPrivateData(element) {
  var private = 1; 
  element.setPrivate = function ( d ) { private = d; }
  element.getPrivate = function ( ) { return private; }
}

当使用某些 DOM 元素调用时，它将向其添加两个方法：.setPrivate(val) 和 .getPrivate()。

这些仅方法允许您访问和修改与元素关联的 private 变量。

Answer 5

您可以混淆您的 javascript 但唯一的验证必须在您的服务器上完成。例如，我试图从 theweathernetwork 获取天气。他们使用多个文件和回调隐藏了 API 调用。在我看来，如果您想对他们的网站进行逆向工程，那只会更具挑战性（更有趣）。

Javascript 不安全。永远不要相信用户输入

存储按钮点击数据的安全方法

Safe way to store data for button clicks

javascript

jquery

dom

data-storage