AJAX jQuery success with IE8, fails with IE10/Chrome/FF

Question

I am facing a very odd issue with jQuery and AJAX. My AJAX call goes to success with IE8 but into error with IE10, Chrome and Firefox.

Here is the PHP code in Zend Framework 2:

$response = $this->getResponse();
$headers = $response->getHeaders();
$headers->clearHeaders()
        ->addHeaderLine('Content-Type', 'application/json; charset=utf-8');
$response->setContent(json_encode($array));
return $response;

Where $array is a PHP array.

Here is my Javascript code:

$.ajax({
    url: "/application/getTypeDossierParPilote/" + idPilote,
    type: "POST",
    async : false,
    success: function(data) {
        LISTE_TYPE_BANDEAU = data;
        ID_PILOTE_SELECTED_BANDEAU = idPilote;
        LISTE_TYPE_BANDEAU_LOADED_BANDEAU = true;                    
    },
    error: function errorHandler(e)             
        ID_PILOTE_SELECTED_BANDEAU = 0;
        LISTE_TYPE_BANDEAU_LOADED_BANDEAU = false;
        LISTE_TYPE_BANDEAU = null;                      
    }                
});

When using IE8, it goes to success and the data are usable. When using IE10, it goes to error. Although, when my client tries this on IE10, he doesn't get any issue, so I assume it goes straight to success.

I have tried adding something like dataType: "json", and even dataType: "html", to check whether the JSON is correct or not and it goes to success in that latter case but the data are not usable.

When I use the developer mode of the browser to copy the response body and check on http://jsonlint.com/ whether the JSON is correct or not I get the following message :

JSON.parse: unexpected character at line 1 column 1 of the JSON data

where the first character is the curly bracket. Here is an example of a JSON that I get :

{
    "typeDossier": [
        {
            "type": "MED",
            "famille": "AEC",
            "codeType": 1,
            "session": ""
        },
        {
            "type": "HPS",
            "famille": "AEC",
            "codeType": 2,
            "session": ""
        }
    ],
    "aecHps": true,
    "CodeAecHps": "1,2,",
    "tous": "1,2,"
}

Hope you can help me out with this weird issue. Thank you in advance. Regards,

Answer 1

My problem has been fixed and was caused by BOM characters which appeared in the configuration file of my project.

Check here to see how I fixed it: Web server response generates UTF-8 (BOM) JSON