MySQL，PHP，JSON和JavaScript为NULL

Question

I often have some JavaScript which receives data from a server's database and presents it on the page.

$.getJSON( 'ajax.php',{id:$('bla').val()}, function(json) {
    $('#myClone').clone().removeAttr('id').text('json.a').appendTo(whatever)
});

ajax.php

$sql='SELECT a,b,c FROM t WHERE id=?';
$stmt = $conn->prepare($sql);
$data=array($_GET['id']);
$stmt->execute($data);
header('Content-Type: application/json;');
echo(json_encode($stmt->fetchAll(PDO::FETCH_ASSOC)));

A problem arises when the database contains NULL for a given column, and the associated JSON includes null without quotes, HTTP transmits the JSON string still with null without quotes, but JavaScript/jQuery appears to convert it into a string "null" , and null is displayed on the page instead of the desired empty string.

How is this best rectified? Should be be done so server-side or client-side? If server-side, should it be done at the database level using something like SELECT IFNULL(a,"") , or the PHP application level?

Answer 1

Doing it at the database level will be the best. The only reason not to do it at the database level would be if you can foresee any situation in which another user of that particular database query or a higher level would need to distinguish between an empty string "" and null.

Doing the query at the JavaScript display level would potentially be a bad idea because there is the possibility to forget to add this check or code in a particular output location, and null would be displayed there. In addition, extra bytes are transmitted at every stage from the database to display, and the end user's CPU is processing the request, rather than your really fast MySQL, which will affect load time.

Consider a scenario with 1 million entries. You will do 1 million checks in MySQL (a language optimized for efficiency) instead of 1 million transmissions of 'null' from the database to PHP (an extra 2 million bytes), 1 million transmissions of 'null' from PHP to the page (another extra 2 million bytes), and 1 million checks at the client side in JavaScript (a language not known for efficiency).

Answer 2

Use a conditional expression:

$.getJSON( 'ajax.php',{id:$('bla').val()}, function(json) {
    $('#myClone').clone().removeAttr('id').text(json.a === null ? '' : json.a).appendTo(whatever)
});

But I would probably go with the server-side solution you mentioned in the question.