创建 Cookie 以不再在投票中投票

Question

我使用 jQuery AJAX 和 JSON 创建了一个简单的 [投票表单]。我想知道如何创建一个 Cookie，以便用户不能多次投票。以下是我的代码。

我是 Cookies 和 jQuery 的新手。请告诉我如何完成我的任务。

JavaScript

<script>
$(document).ready(function(){

    $("#poll").click(function(){
        var count = '';
        if (document.getElementById("vote1").checked) {
            count = 0;
        }
        if (document.getElementById("vote2").checked) {
            count = 1;
        }
        var jsonV= { "vote": count };

        $.ajax({
          type  : "POST",
          url   : "poll_vote.php",
          data  : jsonV,
          dataType: "json",
              success : function ( responseText ){
                console.log("Is working " + responseText);
                 $("#result").html( responseText.vote );
              },
              complete : function(){
                  $("#poll").slideUp();
              },
              error : function( error,responseText ){
                // alert("Server not Responding. Sorry for the inconvenience caused. Please Try again Later");
                console.log( error );
                $("#result").html( error + responseText );
                alert( count );
              }
        });
    });
});
</script>

PHP

<?php

$vote = $_REQUEST['vote'];
$filename = "poll_result.txt";
$content = file($filename);
// $decode = json_decode($encode);
$array = explode("||", $content[0]);
$male = $array[0];
$female = $array[1];

if ($vote == '0') {
  $male = $male + 1;
}
if ($vote == '1') {
  $female = $female + 1;
}

$insertvote = $male."||".$female;
$fp = fopen($filename,"w");
fputs($fp,$insertvote);
fclose($fp);

$table =  (
    "<h2>Results:</h2>
        <table>
        <tr>
            <td> Male :</td>
            <td>
            <img src='poll.gif'
            width= ".(100*round($male/($female+$male),2)).
            "height='20'>".
            (100*round($male/($female+$male),2))." %"  .
            "
             </td>
         </tr>
         <tr>
             <td> Female :</td>
             <td>
             <img src='poll.gif'
             width=". (100*round($female/($female+$male),2)) .
            "
             height='20'>".
             (100*round($female/($female+$male),2))." %" ."

             </td>
         </tr>
     </table>"
 );
$list  = array('vote' => $table);
$encode = json_encode($list);
echo $encode;
?>

HTML

<div id= "poll">
    <h3> What is your Gender? </h3>
    <form>
        Male : 
        <input type ="radio" name ="vote"  id="vote1" >
        <br>
        Female :
        <input type ="radio" name ="vote"  id="vote2" >
    </form>
</div>

Answer 1

您可能希望在用户投票时设置一个 cookie，并在提交投票时在 PHP 中检查该 cookie。如果 cookie 已经设置，投票应该被丢弃。

例如，仅使用 PHP，它可能看起来像这样：

if (!isset($_COOKIE['has_voted'])) {
    // normal vote submission code goes here
    // ...
    // then we set a cookie to expire in 30 days
    setcookie('has_voted', '1', mktime().time()+60*60*24*30);
} else {
    // cookie already exists, user has already voted on this machine
    // do not count the vote, flag an error to the user
}

值得注意的是，有一些方法可以解决这个问题 - 用户可以轻松地手动删除 cookie。在这种情况下，您还可以存储已经投票的用户的 IP 地址，但这可能会在共享机器和网络后面的多台机器上引发问题。

Answer 2

由于您似乎使用的是 PHP，因此您将能够实现一个 cookie 以防止在您现有的脚本中进行多次投票。

PHP中设置cookie的语法如下：

setcookie("cookiename", "cookiedata", cookietime, "cookielocation");

其中“cookiename”是cookie的名称，例如“voted”，“cookiedata”是存储在cookie中的数据——例如“yes”。 “cookielocation”是 cookie 存储在用户浏览器缓存中的位置。除非您知道自己在做什么，否则只需将其设置为“/”即可。

Cookietime 是 cookie 在用户系统中停留的时间，直到浏览器自动删除它。请注意，这不会阻止用户删除 cookie。为简单起见，我通常将时间设置如下：

time()+60*60*24*days

days 是 cookie 在用户系统中的停留时间（当然，以天为单位）。

要检索 cookie 的值以便对其执行逻辑，请尝试使用：

if(isset($_COOKIE['cookiename'])) {
   $valueOfCookie = $_COOKIE['cookiename'];
}

在尝试检索值之前，请确保使用 if(isset()) 确保已设置 cookie。

使用这些函数，当用户提交表单时，您的逻辑可能如下所示：

1. 检查是否设置了投票 cookie
2. 如果是，则打印错误消息，否则：
3. 继续处理表单数据，设置投票cookie

但是，附带说明一下，如果您担心用户可能会删除他们的 cookie 以便他们再次投票，我可能会建议您存储用户的 IP 地址，而不是使用 cookie在服务器端，如果他们的 IP 地址已经投票，则拒绝他们投票访问。

Answer 3

你可以用 sessionStorage 做到这一点，只使用 JS：

<script>
$(document).ready(function(){
    $("#poll").click(function(){
        var count = '';
        if (document.getElementById("vote1").checked) {
            count = 0;
        }
        if (document.getElementById("vote2").checked) {
            count = 1;
        }

        var jsonV= { "vote": count };

        if ( sessionStorage.getItem( 'voted' ) == 'true' ) {
            alert('You have already voted!');
        }else if ( sessionStorage.getItem( 'voted' ) == null ){
            $.ajax({
              type  : "POST",
              url   : "poll_vote.php",
              data  : jsonV,
              dataType: "json",
                  success : function ( responseText ){
                    console.log("It's working" + responseText);
                     $("#result").html( responseText.vote );
                  },
                  complete : function(){
                      $("#poll").slideUp();
                      sessionStorage.setItem('voted', 'true');
                  },
                  error : function( error,responseText ){
                    // alert("Server not Responding. Sorry for the inconvenience caused. Please Try again Later");
                    console.log( error );
                    $("#result").html( error + responseText );
                    alert( count );
                  }
            });
        }
    });
});
</script>

• 我在这里所做的是在 complete ajax 调用的回调，所以一旦它完成 将设置“已投票”项。
• 然后我将 ajax 调用包装在一个 if 条件中，该条件检查 存储项的值，如果已设置，则不允许 你投票（然后提出alert）

---

注意，如果您希望项目持续更长时间，因为 sessionStorage 在浏览器窗口关闭时被清除，而 localStorge 将持续到用户清除其 cookie /浏览数据，您也可以localStorage .

---

这里有一个小sn-p，您可以使用它来清除存储以进行测试：

$('#clear').click(function(){
    console.log(sessionStorage.getItem( 'voted' ));
    sessionStorage.removeItem('voted');
    console.log(sessionStorage.getItem( 'voted' ));
});

您将需要随附的 HTML：

<p id="clear">clear</p>