json_encode creating a malformed JSON (with extra hidden character)

Question

I'm using PHP's json_encode() to return some data, retrieved by jQuery's ajax():

Simplified JS:

$.ajax({
    dataType: 'json',
    contentType: 'application/json',
    cache: false,
    type: 'POST',
    url: './api/_imgdown.php',
    error: function(jqXHR, textStatus, errorThrow) {
        console.log(jqXHR, textStatus, errorThrow);
    },
    success: function(data, textStatus, jqXHR) {
        console.log(data, textStatus, jqXHR);
    }
});

The PHP is:

header('Content-Type: application/json; charset=UTF-8');
//default apiResponse
$apiResponse = [
    "status" => 1,
    "message" => "success",
    "data" => null
];

Then when php runs my code, it ends by adding this data:

$apiResponse['data'][] = [
    "mid" => (int)$mid,
    "card_type" => $card_type,
    "header_size" => (int)$headers['Content-Length'],
    "saved_size" => (int)filesize($imgSavePath),
    "saved_path" => $imgSavePath
];
//spit out the JSON
echo json_encode($apiResponse);
exit();

The JSON:

{"status":1,"message":"success","data":[{"mid":340052,"card_type":"kakusei","header_size":48337,"saved_size":48337,"saved_path":"..\/card\/kakusei\/340052.png"}]}

At first it seems valid. My Ajax that retrieves this PHP always ends with parseerror (thus going into the error part of ajax()).

If you copy and paste this JSON on http://jsonlint.com/, it says "Unexpected token " and http://jsonformatter.curiousconcept.com/ says is not valid.

I've tried echo json_encode($apiResponse, JSON_UNESCAPED_SLASHES); even though escaping slashes is ok \/ but made no difference.

But what isn't exactly valid? Wasn't PHP supposed to return valid JSON?

Extra info: Testing on Windows7, Chrome v28.XX, using PHP 5.4.XX on Apache

Questions I've read before actually posting this one:

• json_encode creating malformed JSON data?
• https://stackoverflow.com/a/15654848/684932
• about json_encode and ajax dataType: "json"
• php json_encode not returning proper json encoded string

---

Update:

Copying from SO into JSONlint gives valid json. So I investigated a little further and noticed the PHP is creating a weird hidden character that is actually making json invalid. See below screenshot. How I fix that?

Answer 1

It could be an issue with a BOM mark. Try to save the file as normal UTF-8 instead.

Answer 2

I have encountered same problem, but I could not find which file on my Windows is saved in UTF8 with BOM (Even though I have tried to search the files as many as I could).

However, I've found out the workaround. Assuming on the server side I have

die(json_encode(array(
    'OK' => 1
)))

1. On the $.ajax call, I remove the entry "datatype : 'json'" and I access to the response with the following lines:

success: function (response) {
      var data = $.parseJSON(response); 
      console.log(data.OK); // = 1
  }

2. On the $.ajax call, I still keep the entry "datatype : 'json'", then I have to access the value inside the response like this

var dataOK = response['OK']; // = 1