JSON.parse解析details字段报错：Unexpected non-whitespace character

解析data.details时触发错误：Unable to Process items SyntaxError: Unexpected non-whitespace character after JSON at position 2，但console.log(data.details)能正常打印出值"65ttgtest prodct"。其他JSON字段均可正常处理，仅details字段出现该问题，错误发生在let items = JSON.parse(data.details);这一行。

JavaScript代码 #

function processOrderItems(data) {
    try {
        console.log(data);
        console.log(data.details);

        if (data && data.details) {
            let orderItems = "";
            console.log('oujyiu');

            let items = JSON.parse(data.details);
            console.log(items);
            console.log('345353');

            items.forEach((item) => {
                orderItems = orderItems + `${item.c} X ${item.p}` + "\n";
            });
            data.orderItems = orderItems;
        }
    } catch (err) {
        console.log("Unable to Process items", err);
    }
}

console.log(data)输出 #

{
    "tagId": "Ask_for_payment",
    "tags": "Shipping_Pending",
    "phone": "917980730935",
    "encoded-payload": "eyJ0YWdJZCI",
    "name": "#",
    "customerName": "Ravi",
    "status": "confirmed",
    "fulfillmentStatus": "unfulfilled",
    "paymentStatus": "Paid",
    "id": "9024033",
    "ids": "9024033true",
    "createdOn": "July 25, 2022",
    "trackingNumber": "-NA-",
    "address": "Not avialable",
    "pd-clickable": "pd-clickable-order-div",
    "lineItems": "",
    "details": "65ttgtest prodct",
    "hide-line-items-div": "pd-hidden",
    "hiddenLineItems": "",
    "currency": "₹",
    "total": "1310.98",
    "collapse-icon": "true",
    "is_hide": "",
    "expand-icon": "true",
    "readableAddress": "Not avialable",
    "hide-div": "pd-hidden",
    "card-index": 30,
    "can-hide": ""
}

PHP代码 #

$finaldataa .= '{"tagId":"'.$fertrr.'","tags":"'.$djjrjr.'","phone":"'.$phone_noyyy.'","encoded-payload":"kkjhjjhhh","name":"#'.$order_number.'","customerName":"'.$customer_name.'","status":"Confirmed","fulfillmentStatus":"'.$kkekffddf.'","paymentStatus":"Paid","id":"'.$idggg.'","ids":"'.$idggg.'","createdOn":"'.$time_created.'","trackingNumber":"'.$tracking_no.'","address":"Not avialable","pd-clickable":"true","lineItems":"65ttg'.$prod_title.'","details":"65ttg'.$prod_title.'","hide-line-items-div":"false","hiddenLineItems":"false","currency":"'.$s_currency.'","total":"'.$amount.'","collapse-icon":"true","is_hide":"true","expand-icon":"true"},';

问题原因与解决办法 #

• 核心问题：data.details的值是普通字符串"65ttgtest prodct"，并非合法的JSON格式（既不是JSON数组也不是JSON对象），调用JSON.parse()解析普通字符串必然报错。
• 两种解决方向：
  1. 如果details字段应该存储商品列表JSON：修改PHP代码，将商品数据序列化为JSON字符串后再赋值给details。比如假设你有商品信息数组：

     // 示例：构造商品数组
     $productList = [
         ["c" => 1, "p" => "65ttgtest prodct"]
     ];
     // 序列化为JSON字符串
     $detailsJson = json_encode($productList);
     // 拼接时使用这个JSON字符串
     $finaldataa .= '..."details":"'.$detailsJson.'",...';
     

     这样JavaScript端就能用JSON.parse()解析成数组，正常执行forEach循环。
  2. 如果details字段只是普通文本：直接跳过JSON.parse()步骤，根据需求处理文本即可，比如：

     // 替换原解析代码
     data.orderItems = data.details;
     

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