正确的方法设置cookie从jQuery和读取从php


Correct way to set cookie from jQuery and read from php

我试图通过jQuery在PHP中读取cookie值。但是在第一次页面加载时没有读取。但是我看到它已经被jQuery设置了,可以从jQuery中读取相同的值。

当尝试从PHP读取cookie值时,它不会在页面第一次呈现时显示该值。刷新页面,然后从php中获取值。(我需要刷新第2页的时间来获得正确的值)

我使用了head标签和onload方法来放置setCookie()函数。但结果是一样的。

我使用这个jQuery库来编写cookie。

这是我用来读取和写入cookie的代码。

<?php
    if (!isset($_SESSION)) {
        session_start();
    }
    ?>
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <style>
                body{
                    background: #666666;
                }
            </style>
            <script src="js/jquery.min.js" type="text/javascript"></script>
            <script src="js/jquery.cookie.js" type="text/javascript">/script>
            <script>
                setCookie();
                function setCookie() {
                    console.log('on Load');
                    var data_spl = $(location).attr('href').split('#?camlist=')[1];
                    if (data_spl != undefined) {
                        var len = data_spl.split(',').length;
                        $.cookie("len", len);
                        console.log($.cookie("len"));
                    } else {
                        console.log('undefined');
                    }
                }
            </script>
        </head>
        <body>           
            <?php
            for ($i = 0; $i < 100; $i++) {
                echo "<script>console.log('START');</script>";
                echo "<script>console.log('" . $_COOKIE['len'] . "');</script>";
                echo $_COOKIE['len'];
                echo "<script>console.log('END');</script>";
            }
    
            echo "WIDTH & HEIGHT :" . $_SESSION['width_x'] . "-" . $_SESSION['height_y'];
            ?>        
        </body>
    </html>

编辑:

我使用另一个php页面来设置来自java脚本的会话值,并通过jQuery调用该页面,如下所示。

var len = $(location).attr('href').split('#?data=')[1].split(',').length;
$.post('set_session.php', {params: len}, function (retparams) {
      if (retparams.has) {
         console.log('sucessfuly sent the paramlen!');             
      } else {
         alert("can't read camarauids for grid making");
      }
}, 'retparams');

set_session.php

<?php
if (session_status() == PHP_SESSION_NONE) {
    session_start();
    $_SESSION['urllen'] = 0;
}
if (isset($_POST['params'])) {
    $_SESSION['urllen'] = $_POST['params'];
    echo json_encode(array('retparams' => 'has'));
    echo json_encode(array('datalen' => $_SESSION['urllen']));
} else {
    echo json_encode(array('retparams' => 'error'));
}
?>

然后我尝试从index.php页面读取会话值($_SESSION['urllen'])。但它也和上面的一样。(我需要再次刷新页面以获得从jQuery post函数设置的正确值)

正如在评论部分已经提到的,你的Cookie不存在于第一个页面加载,因为它还没有设置。(如果你设置 Cookie直接在JS或通过AJAX本质上是相同的)

有效获取信息的唯一方法是重新加载页面或重定向,或者通过AJAX请求(取决于您的需求)。例如,你可以在JS中重定向Cookie后设置:

//set your cookie in JS
window.location = location.host; 

关于JS重定向的更多信息可以在这里找到,或者你可以通过谷歌搜索。

你也可以设置你的Cookie在PHP和重定向与header()函数:

header('Location: http://www.example.com/');
关于PHP重定向的更多信息可以在这里或Google上找到;)

您可以使用ajax检查这一点。下面是一个简单的例子:

<?php
  if(isset($_GET["checkIfLoggedIn"]) && boolval($_GET["checkIfLoggedIn"]) === true) {
    header("Content-Type: text/json");
    die(json_encode(array("isLoggedIn" => $_COOKIE["isLoggedIn"])));
    exit();
  } else {
    var_dump($_COOKIE);
  }
?>
<html>
  <head>
    <script type="text/javascript" src="jquery-3.1.1.min.js"></script>
    <script type="text/javascript" src="js.cookie.js"></script>
  </head>
  <body>
    <script type="text/javascript">
      function checkIfLoggedIn() {
        console.log("checking...");
        jQuery.post("?checkIfLoggedIn=1", function(data) {
          if(data.isLoggedIn == true) {
            alert("Logged im.");
          } else {
            alert("NOT logged in!");
          }
        });
      }
    </script>
    <a href="#" onclick="Cookies.set('isLoggedIn', 'true'); checkIfLoggedIn(); return false;">Set logged in to true</a><br/>
    <a href="#" onclick="Cookies.set('isLoggedIn', 'false'); checkIfLoggedIn(); return false;">Set logged in to false</a>
  </body>
</html>