JavaScript doesn't read JSON string, no error

Question

I'm facing a bit of an odd problem here. I just launched: http://claudiu.phpfogapp.com/ To keep it short, when you minify your files or custom code or both, it returns a JSON string containing various data:

{
    "source" : MINIFIED_CSS,
    "location" : CSS_URL,
    ...
    "error_msg" : ERROR_MSG
}

Where the words typed in caps are actually the values. It works for a few lines of code, but breaks on large values of MINIFIED_CSS. It's weird that JavaScript doesn't issue any errors as well. I read the JSON with jQuery like this:

$.get('/minify/', {custom: $('.custom textarea').val(), files: JSON.stringify(request_string)}, function(data) {

                    console.log(data);
                    var response = eval(data);

When the MINIFIED_CSS is too large, I can't even see the console.log() call, but inspecting with Firebug you can see the source and can also see the JSON tab in Firebug for the request parsing the JSON nicely.

I have no idea what could be wrong. I'm sure that the JSON string doesn't break, I even created a small CSS file with the most awkward characters that could break the JSON: http://claudiuceia.info/css/small.css but minifying that runs smoothly. Did anyone face this problem before? Any ideas what could be wrong?

Hoping that having an actual link to the problem can help finding a solution quicker but if you need anything else please let me know, I don't know what else I could try. Also, note that this stopped working just now, but it worked when I launched a few hours ago? I tested in Chrome and Firefox and it worked, now it doesn't work in any of them.

UPDATE

I followed Scottie's suggestion (comment below) and ran the response through JSONlint.com The requests that I'm having problems with don't validate in JSONLint but running them through eval() doesn't issue an error and converts nicely: http://claudiuceia.info/demo/json/index.html

I'm expecting to see that, or at least an error or the console.log() call in the live app as well. The console.log() call should display even if data is null or undefined or whatever it might be.

Pictures with the requests working but not being read by JavaScript as well:

UPDATE 2

Looks like json_encode() didn't escape the CSS text properly for some reason. I had to use a solution found on this page: PHP's json_encode does not escape all JSON control characters

$escapers = array("\\", "/", "\"", "\n", "\r", "\t", "\x08", "\x0c"); 
$replacements = array("\\\\", "\\/", "\\\"", "\\n", "\\r", "\\t", "\\f", "\\b"); 
$result = str_replace($escapers, $replacements, $value); return $result;

Answer 1

If .custom textarea text is too long, you may exceed the maximum URI length error, resulting in HTTP 416 status code (you can see status code of the request in firebug console as well, usually it marks in red all request that are not with status 200 response. So you have to use $.post instead of $.get

Edit: based on the discussion below, the question is why callback function is not being called. Here is the answer :

The callback function is called only if the request succeeds. Since the response contains content-type application/json and browser can't parse json (the xmlhttp object contains statusText 'parseerror') the callback is never executed. If you add 'text' as last parameter to $.post() in order to parse the response as text, the callback will be executed and response will be logged

Answer 2

Maybe the problem is that you are using $.GET and when the CSS (or other value you are passin) is too big, it truncates it. The maximum length is at around 2000 characthers. Try to use $.POST that has no such limitations (well, it's limited by the value of your post_max_size in php ini.

Read here for more info: What is the maximum length of a URL in different browsers?

Answer 3

problem 1
You are using .get() which has a limit on the number of bytes it can send over the URL..
Use '.post()' instead..

possible problem 2
You are using the console.log command, so if you do not have the console open, your code crashes there..

---

Update

Testing your examples i see that the CSS contains the \ character and that seems to choke the json parser which handles it as the escape char..

You need to escape that to \\ for the json parser to handle it correctly.

As you mention in your edited question, there is a series of chars that need to be properly encoded..