AJAX/LocalStorage：是否可以将JS变量传递给PHP？

我想知道，存放购物车最好的方法是什么？
我考虑将产品ID存储在localstorage/sessionstorage中，然后使用AJAX从服务器检索产品。
唯一的问题是我不知道如何将项目从localstorage传递到PHP…
我猜这可能不可能直接实现，我考虑了一个表单，尽管我不知道如何实现它…
其思想是，当用户单击“添加到购物车”时，项目id和数量将添加到本地存储中，当用户查看其购物车时，将从数据库中检索项目详细信息（图像、名称、价格…）。 我可能会使用本教程

我也可以放弃本地存储，转而使用会话和数据库，但我真的很想给用户这种动态的web体验

我刚刚提出的另一种可能的方法是使用file.php？prodid=……之类的URL，尽管这样的URL可能太长了

---

提前谢谢

不，javascript在客户端运行，php在服务器上运行。

您可以使用本地/会话存储数据并填充一些隐藏的输入，然后在ajax请求中提交相应的表单。为了使事情更清晰，您可以使用一个隐藏的输入并将其值设置为从存储数据创建的JSON对象。

使用AJAX将数据发送到服务器（GET或POST），并将这些值存储在服务器上的会话变量或cookie中。

您必须记住服务器端（PHP）在将代码转换为浏览器端代码之前读取代码。JavaScript在浏览器端被操纵

因此，在一维上，您无法将JavaScript传递给PHP

然而

对于Ajax，我建议您使用JSON，您可以将JavaScript数据发送到PHP页面，并将响应返回到JavaScript方法。我想这会适合你的需要。如果你愿意，我可以提供一个简单的例子

//--示例如下：

JavaScript:

//Ajax Method
function processAjax(queryString, processDiv, responseDiv) {

responseDiv.innerHTML = '';
var myAjax;
try {
    // Modern Browsers-->
    myAjax =new XMLHttpRequest();
} catch (e) {
    // antique ie browsers-->
    try {
        myAjax =new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try{
            myAjax =new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e) {
            // Something went wrong
            document.getElementById('processDiv').innerHTML="";
            alert("Your browser malfunctioned!  Please try again. Consider installing a modern browser if the problem persists.");
            return false;
        }
    }
}
myAjax.onreadystatechange = function() {
    if (myAjax.readyState == 4) {
        var ajaxResponse = myAjax.responseText;
                responseDiv.innerHTML = ajaxResponse;
        processDiv.innerHTML = "";

                    //NOTE: HERE IS WHERE AJAX IS FINISHED, SO IF YOU WANT TO DO SOMETHING ELSE HERE YOU CAN!
                    //POST PROCESSING----->
                    // IE: alert('I am finished processing now!');
                    // or call another function:
                    // anotherFunction();

            } else {
        processDiv.innerHTML = '<img src="http://www.mysite.com/images/loadingicon.gif" alt="processing....." />';
    }
}
myAjax.open("GET", queryString, true);
myAjax.send(null);

}


function sendStorage() {

   var helloVar = 'Hello, I am passed to PHP #1';
   var worldVar = 'I am the second value passed to PHP!';
   var processId = 'process_div';
   var resultId = 'result_div';
   var queryString = 'http://www.mysite.com/process.php?hello=' + helloVar + '&world=' + worldVar;

   processAjax(queryString, processId, resultId);

}

//Ajax方法
函数processAjax（queryString、processDiv、responseDiv）{
responseDiv.innerHTML=''；
var-myAjax；
试一试{
//现代浏览器-->
myAjax=newXMLHttpRequest（）；
}捕获（e）{
//古董ie浏览器-->
试一试{
myAjax=newActiveXObject（“Msxml2.XMLHTTP”）；
}捕获（e）{
试一试{
myAjax=newActiveXObject（“Microsoft.XMLHTTP”）；
}捕获（e）{
//出了点问题
document.getElementById（'processDiv'）。innerHTML=“”；
警告（“您的浏览器发生故障！请再试一次。如果问题仍然存在，请考虑安装一个现代浏览器。”
返回false；
}
}
}
myAjax.onreadystatechange=函数（）{
if（myAjax.readyState==4）{
var ajaxResponse=myAjax.responseText；
responseDiv.innerHTML=ajaxResponse；
processDiv.innerHTML=“”；
//注意：这里是AJAX完成的地方，所以如果您想在这里做其他事情，您可以！
//后处理------>
//IE:alert（'我现在处理完毕！'）；
//或者调用另一个函数：
//另一个函数（）；
}否则{
processDiv.innerHTML=''；
}
}
open（“GET”，queryString，true）；
myAjax.send（null）；
}
函数sendStorage（）{
var helloVar='你好，我被传递到PHP#1'；
var worldVar='我是传递给PHP的第二个值！'；
var processId='process_div'；
var resultId='result_div'；
变量queryString=http://www.mysite.com/process.php?hello=“+helloVar+”&world=“+worldVar；
processAjax（queryString、processId、resultId）；
}

现在来看一些HTML：

<div id="content">
       <div id="process_div"> This is where processing will occur </div>
       <div id="result_div"> This is where my response will display </div>
</div>

这就是进行处理的地方
这就是我的回答将显示的地方

现在来看process.php（注意：为了安全起见，我强烈建议您不要在JAVASCRIPT中显示服务器端处理页面）

重要提示：您应该认真学习一些JSON和$\u POST请求，因为它们更安全、更快，并且您可以轻松地操作返回的数据。我建议查看类似jquery的库以获得简化的示例

我还没有测试过这段代码，但它应该可以工作。。如果您有问题，请告诉我，否则这无法回答您的问题

很乐意帮忙
 对于长时间的请求，为什么不使用.post？来扩展kritya所说的内容，您应该能够准确地完成所描述的内容；您只需要使用包含购物车内容的
.post
向PHP脚本提交AJAX请求。然后，对该请求的响应将需要项目详细信息以及您想要检索的任何其他内容。我知道，这正是问题所在。我的问题是，是否有办法克服这个问题，因为许多人建议在购物车上使用localstorage。虽然这是事实，但这并不能阻止他想要的行为。是的，这正是我想要的。请给我举个例子。我主要想知道如何使用AJAX有效地发送数据。谢谢没问题。。给我几分钟，因为我在某个中间。谢谢这个例子！看起来真不错。只是一个小问题，至于不显示流程页面，有哪些选项？我应该使用“中介”页面还是什么？再次感谢您花时间编写此示例！那就复杂了。。大多数人都使用路由器。添加一个额外的查询字符串参数，比如action mysite.com？action=process\u cart，然后使用php if（isset（$\u GET['action']）{require\u一次（路径\u到\u mysite.DIRECTORY\u SEPARATOR.'actions\u DIRECTORY\u SEPARATOR.$\u GET['action']..php）}，然后将代码放入该操作文件中。。但这在这里解释起来相当复杂。这难道不会毁掉使用本地存储的整个想法吗？本地存储可以用于长时间存储，PHP会话变量可以镜像这些值
<?php

  //init
  $hello = '';
  $world = '';
  $errors = 0;

  //set
  //Security note: never trust a URL request.. you should clean all $_GET, $_REQUEST, AND $_POST with the PHP htmlspecialchars() method (take a look at php.net for that)
  (isset($_GET['hello'])) ? $hello = $_GET['hello'] : $errors++;
  (isset($_GET['world'])) ? $world = $_GET['world'] : $errors++;

  //process
  if($errors > 0) {
      echo 'Errors Detected! Missing querystring get data!';
  } else {
      echo '<p>Hello received: ' . $hello . '</p>';
      echo '<p>World received: ' . $world . '</p>';
      //now we can process $hello and $world server side!
  }