在html表格列中隱藏敏感數據

Question

我有一個html表格，第一列有id。此列已隱藏。我現在讀了這是一個不好的方法。

但我需要這個隱藏的ID，當用戶選擇一行並點擊刪除按鈕做這個ID的ajax職位。

我應該在哪裏另外放這個id，爲什麼這種方法不好？

Answer 1

將ID添加爲表格行中的一個屬性。這樣的事情：

<tr data-id="1"> 
    <td><span class="delete">Delete</span></td> 
</tr> 

<tr data-id="2"> 
    <td><span class="delete">Delete</span></td> 
</tr> 

而當用戶點擊刪除或編輯，使用jquery。

$('.delete').bind('click', function (e) { 
    var $row = $(this).closest('tr'); 
    var id = $row.attr('data-id'); 

    // now you have `id` 
}); 

Answer 2

無論你把它放在哪裏，如果一個特定的數據片段在HTML傳輸到瀏覽器中，用戶將能夠看到它。

你可以把它通過隱藏它等，但這樣做間接將不以任何方式安全它。

我的建議是在服務器端實現某種嚴格的訪問控制機制，以確保嘗試刪除操作的人員有權這麼做 - 而不是試圖在客戶端隱藏事情。

您也可以考慮在將ID發送給客戶端之前對其進行某種加密，以使其無法猜測。

Answer 3

您可以爲每個行元素添加一個data-attribute，並在行上單擊時讀取它。這樣做的好處是，數據屬性值不會顯示在屏幕上。

Answer 4

作爲憑據的敏感數據不應該是可訪問的客戶端。但是因爲我不知道你稱之爲敏感數據，所以我建議你使用jQuery數據對象。這有優勢，保持DOM儘可能保持清潔：

//head or any DOM element 
$('head').data('key','myValue'); //set 
var value = $('head').data('key'); //get 

Answer 5

如果您已經將有一個「刪除按鈕」每行，然後通常慣例是把ID直接進入一個隱藏的輸入如下所示：

<tr> 
    <td>John Smith</td> 
    <td>37</td> 
    <td> 
    <form action="/delete"> 
     <input type="hidden" name="id" value="id_for_this_row"> 
     <button type="submit">Delete</button> 
    </form> 
    </td> 
</tr> 

此代碼將在沒有任何Javascript的情況下運行。如果你想要增強行爲，通過使用AJAX等在後臺發佈表單，只需在頂部添加。

如果你的應用在很大程度上AJAX已經，或者你不能每<tr>使用單獨的形式，然後薩姆帕斯的回答將是我去到（加入data-id屬性各<tr>）