Spanish letter issue with special characters while ajax call for json response

Hi All,

Today we are going to talk about a problem whose solution is not easy to find.

Spanish letter issue with special characters while ajax call for JSON response.

Problem:

Some time ago I got this strange issue. I found out an Ajax service response was containing some strange symbols instead of particular Spanish letters like (á, é, í, ñ, Ü, ö…).

For example: '-ó' got converted into 'Ã' and in some cases �.

The Strange part was the same service response was working fine for use in Xcode ( iOS mobile application development framework), but somehow through browser's Ajax call, I was getting JSON along with these strange characters. While the hard-coded Spanish characters present in HTML was rendering perfectly.

Approach:

Thinking it might be a front-end bug, I tried to look for a solution. I tried changing the meta tag from 'UTF-8' to 'ISO-8859-1' like below:

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />

But this didn't solve my problem, and it was not a problem in HTML, as the hard-coded text was rendering neatly.

I also tried other approaches like configuring response and request header in Ajax call. That also didn't work. 

Finally, after a long research, I found out a simple solution.

Solution:

In the back-end the handler which is returning the JSON, you need to explicitly add a header in the response.

Content-Type = application/json; charset=ISO-8859-1

The example in Java:

response.setHeader("Content-Type", "application/json; charset=ISO-8859-1");

In the JavaDoc, it is written -

Containers must communicate the character encoding used for the servlet response's writer to the client if the protocol provides a way for doing so. In the case of HTTP, the character encoding is communicated as part of the Content-Type header for text media types. Note that the character encoding cannot be communicated via HTTP headers if the servlet does not specify a content type; however, it is still used to encode text written via the servlet response's writer.

Although the above solution should work for you, you should probably add the below two steps as well in case if you are using java.

response.setContentType("application/json");
response.setCharacterEncoding("ISO-8859-1");

Please feel free to comment if this worked or any other solution you have.