通过Ajax从LocalStorage向PHP传值时PHP端返回空数组问题

我来帮你排查这个问题，你的代码里有几个关键错误导致PHP接收不到数据，咱们一步步解决：

问题根源分析 #

1. 重复JSON序列化：localStorage.getItem("productsInCart") 本身返回的就是你之前存入的JSON字符串（如果当初是用JSON.stringify()存的对象），你又再次调用JSON.stringify()，把这个字符串转成了「字符串的字符串」，这会导致PHP接收后的数据格式异常；如果localStorage里没有这个键，返回null，JSON.stringify(null)会变成"null"，传递过去的只是这个无效字符串，而非预期的购物车数据。
2. 缺少基础校验与错误回调：没有判断localStorage中是否存在目标值，也没给AJAX添加错误回调，没法直观排查请求是否成功发送。

修正后的代码 #

JavaScript 代码 #

// 从LocalStorage获取购物车数据
let cartItems = localStorage.getItem("productsInCart");

// 先判断数据是否存在，避免传递null
if (cartItems) {
    // 将JSON字符串解析为JavaScript对象（匹配当初存入时的格式）
    const cartData = JSON.parse(cartItems);
    
    $.ajax({
        url: "read.php",
        method: "POST",
        data: { data: cartData }, // 直接传对象，jQuery会自动序列化为表单数据
        success: function(res) {
            console.log("PHP返回结果：", res);
        },
        error: function(xhr, status, error) {
            // 新增错误回调，方便排查请求问题
            console.error("AJAX请求出错：", error);
        }
    });
} else {
    console.log("LocalStorage中没有找到productsInCart数据");
}

PHP 代码 #

<?php
// 先确认是POST请求
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    echo "接收到的POST数据：<br>";
    print_r($_POST);
    
    // 如果你选择直接传递JSON字符串（而非解析后的对象），可以用下面的方式解析：
    // $rawData = file_get_contents('php://input');
    // $cartData = json_decode($rawData, true);
    // echo "<br>解析后的JSON数据：<br>";
    // print_r($cartData);
} else {
    echo "请通过POST请求访问此页面";
}
?>

额外排查要点 #

• 检查LocalStorage数据：在浏览器控制台输入localStorage.getItem("productsInCart")，确认返回的是有效的JSON字符串，而非null或乱码。
• 查看请求状态：打开浏览器开发者工具的「Network」面板，找到发送给read.php的请求，检查「Form Data」里是否有data字段和对应的值，同时确认请求状态是200。
• 确保jQuery引入正确：页面必须先引入jQuery库，AJAX才能正常执行。
• 避免本地文件跨域：如果是直接打开本地HTML文件（file://协议），AJAX请求可能被浏览器拦截，建议用本地服务器（如XAMPP、WAMP）运行项目。

内容的提问来源于stack exchange，提问作者ceeejeey