在cookie中传递JS数组并在PHP中检索

In my Javascript I have an array called productArray. When I do a console.log it looks like this:

Object, Object]
0: Object
quantity: "3"
stockCode: "CBL202659/A"
__proto__: Object
1: Object
quantity: "2"
stockCode: "CAV BOX SGLE BR "
__proto__: Object
2: Object
comment: "This is a Test Comment"
__proto__: Object
length: 3
__proto__: Array[0]

As you can see it contains 3 objects: the first 2 are products with a stock code and quantity, the third is a comment associated with the order being made.

I am wondering how I could place this array into a cookie in such a way that I can easily retrieve it from a php script later on in the ordering process.

Currently I am doing this:

$.cookie('order_cookie', JSON.stringify(productArray), { expires: 1, path: '/' });

and in PHP I do this to get reference:

$encoded = json_encode($_COOKIE['order_cookie']);
    $orderArray = json_decode($encoded, true);

My array ends up being output as a String and this is seen when I do var_dump($orderArray)

string '[{\"stockCode\":\"CBL202659/A\",\"quantity\":\"3\"},{\"stockCode\":\"CAV BOX SGLE BR \",\"quantity\":\"2\"},{\"comment\":\"This is a Test Comment\"},{\"comment\":\"\"}]' (length=168)

and as a result I cannot iterate through it in the foreach loop:

if(is_array($orderArray)){
    echo "IS ARRAY";
    foreach($orderArray as $item){
        if(!array_key_exists('comment', $item)){
        $orderContent .= "Stock Code: " . $item['stockCode'] . " Qty: " . $item['quantity'] . "<br/>";
        }else{
        $orderContent .= "Comments: " . $item['comment'];
        }
    }

    echo $orderContent;
    }else{
        echo "NOT ARRAY";
    }
    }

Does anyone know how I can get this JS Array into the Cookie in such a way that I can retrieve it in a PHP script???

This is my JS Script

if($.cookie('order_cookie') != undefined){
    productArray = JSON.parse($.cookie('order_cookie'));
    $.cookie('order_cookie', JSON.stringify(productArray), { expires: 1, path: '/' });
}

//Reference to the order table
var ordertable = document.getElementById("ordertable");

//Loop through the Array and display in the table
for(var i = 0; i < productArray.length; i ++){
   // console.log(productArray[i]);
    console.log("Order Item " + i);
    console.log("StockCode: " + productArray[i].stockCode);
    console.log("Quantity: " + productArray[i].quantity);

    var row = ordertable.insertRow(i + 1);
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);
    var cell3 = row.insertCell(2);
    cell1.innerHTML = productArray[i].stockCode;
    cell2.innerHTML = productArray[i].quantity;
    cell3.innerHTML = "<input type='button' value='-' class='removeBtn'/><input type='button' value='+' class='addBtn'/><input type='button' value='Delete' class='deleteBtn'/>"
}

//Delete Button
$(".deleteBtn").click(function(){
   var row = this.parentNode.parentNode;
   var rowToDelete = row.rowIndex;
   var elementToDelete = row.rowIndex-1;
   //Remove from Array
   productArray.splice(elementToDelete,1);
   //Remove from Table
   ordertable.deleteRow(rowToDelete);
   //Update the Cookie with the information every time you delete
   $.cookie('order_cookie', JSON.stringify(productArray), { expires: 1, path: '/' });
});

//Change the total 
$('.removeBtn').click(function(){ //Remove 1 from quantity

    var row = this.parentNode.parentNode;
    var elementToUpdate = row.rowIndex - 1;

    if( productArray[elementToUpdate].quantity <= 1){
     ordertable.deleteRow(row.rowIndex);
     productArray.splice(elementToUpdate,1);
    }else{
     productArray[elementToUpdate].quantity--;
         ordertable.rows[row.rowIndex].cells[1].innerHTML = productArray[elementToUpdate].quantity;
    }

    $.cookie('order_cookie', JSON.stringify(productArray), { expires: 1, path: '/' });
});

$('.addBtn').click(function(){ //Add 1 to quantity
    var row = this.parentNode.parentNode;
    var elementToUpdate = row.rowIndex - 1;
    productArray[elementToUpdate].quantity++;
    ordertable.rows[row.rowIndex].cells[1].innerHTML = productArray[elementToUpdate].quantity;
    $.cookie('order_cookie', JSON.stringify(productArray), { expires: 1, path: '/' });
});

$('.confirmBtn').click(function(){
    //Get reference to the Value in the Text area
    var comment = $("#comments").val();

    //Create Object
    var orderComment = {
    'comment' : comment
    };

    console.log(productArray);

    //Add Object to the Array

    productArray.push(orderComment);

    //update cookie
    $.cookie('order_cookie', JSON.stringify(productArray), { expires: 1, path: '/' });
});

Maybe you use wrong encoding in js. Try this:

$encoded = utf8_encode($_COOKIE['order_cookie']);
$orderArray = json_decode($encoded, true);