JSON character encoding

Posted by Paull | Filed under Technology

It appears the encoding of a JSON file must match the encoding used in the HTML page which is downloading it. If a page uses UTF-8 encoding but the JSON file uses iso-8859-1 (or visa versa) then any unicode characters in the JSON may not be decoded and displayed properly.

I came across this issue working on a script which gets the items to display in a menu from a JSON data feed. This JSON data file is downloaded by writing out a script tag e.g.

document.write('&lt;script language="JavaScript" src="'+dataurl);
document.write('" type="text/javascript"&gt;&lt;/script&gt;');

In this instance we are unable to control the encoding used on the pages which embed the script so the solution I came up with was to detect the encoding used on the page with javascript and pass this to the server side script so it can vary the encoding used on the JSON to match the pages encoding - heres an extract of what I did:-

function getCharacterEncoding() {
	var charSet = "";
	// list of properties to try read for the current pages encoding.
	// document.characterSet is used by FF 2/3 &amp; Safari
	// document.charset is used by IE 6/7
	// the others are for belt and braces
	var testList = ["document.characterSet",
		"document.charset",
		"document.defaultCharset",
		"document.actualEncoding",
		"document.inputEncoding"
	];
	for (var i=0;i&lt;testList.length;i++) {
		try {
			charSet="notset";
			eval("charSet = "+testList[i]+";");
			if (charSet != "" &amp;&amp; charSet != null) {
				break;
			}
		} catch(e) {
		}
	}
	return charSet;
}
document.write('&lt;script language="JavaScript" src="'+dataurl+"?encoding="+escape(getCharacterEncoding()));
document.write('" type="text/javascript"&gt;&lt;/script&gt;');