Proper use of quotes for output of JavaScript in a variable

Question

I am creating a chunk of HTML/JavaScript with the below code:

$result = mysql_query("SELECT * FROM posts WHERE userid = '$user_id' ORDER BY DATE desc LIMIT 5")or die (mysql_error());

while ($row = mysql_fetch_array($result))
{

    $source = $row[source];
    $source = "'$source'";

    $p = $p.'<div id="red-div"><div id="smartass"><div id="image"><img src="thumbs/'.$user_image.'" /></div><div id="playsong"><a href="#" onclick="playsong(';
    $p = p.$source;
    $p = $p.'); return false;"><img src="play.png" width="16" height="16" border="0" /></a>'.$row[artist].' - '.$row[title].'</div></div><div id="post-comment">'.$row[comment].'</div><div id="post-date">'.$row[date].'</div></div><div id="dotted-line"></div>';

}

I then update a part of my page with the following code:

parent.document.getElementById('posts').innerHTML = '<?php echo $p; ?>';

For some reason no matter how I quote or enter $source into playsong(''); I loose the '' in playsong(); resulting in something like playsong(theSongVariable); and that of course does not work.

How do I properly quote or output the '' to make sure they stay in playsong('');?

Answer 1

Have you tried using the addslashes function on your $p string. I think its primary purpose relates to building queries for databases, but it may work for in your case as well.

Answer 2

edit: also, shouldn't

$p = p.$source;

be

$p = $p.$source;

btw, don't forget you can use the .= operator. like

$p .= $source;

edit2: try outputting your $p for analysis using (will change < to &lt;

echo htmlspecialchars($p);

Edited to remove JS line. clearly not outputted from within a <?php ?> block. (should've had my coffee first)

Answer 3

If possible you should use json_encode to build a JavaScript string declaration and htmlspialchars to use it as a HTML attribute value:

$onclick = 'playsong('.json_encode($row['source']).'); return false';
$p .= '<div id="red-div"><div id="smartass"><div id="image"><img src="thumbs/'.htmlspecialchars($user_image).'" /></div>';
$p .= '<div id="playsong"><a href="#" onclick="'.htmlspecialchars($onclick).'"><img src="play.png" width="16" height="16" border="0" /></a>';
$p .= htmlspecialchars($row[artist].' - '.$row[title]).'</div></div>';
$p .= '<div id="post-comment">'.htmlspecialchars($row['comment']).'</div>';
$p .= '<div id="post-date">'.$row['date'].'</div></div><div id="dotted-line"></div>';

Oh, and IDs must be unique in documents.

Answer 4

There are different ways to escape strings depending the context in which you use them.

In your specific case you should use:

echo json_encode(htmlspecialchars($p, ENT_QUOTES, *your charset*));

htmlspecialchars helps you to escape HTML sequences so that you don't have funky things such as </script> in the Javascript part.

json_encode makes sure that your string is valid as a JavaScript sequence.

These are very important security concepts because otherwise there are serious issues such as XSS or even XSRF if you give users special permissions on your site.

As we're on the topic, make sure that your $user_id is a validated value because otherwise you are vulnerable for SQL injection. For example, $user_id could be "1' OR '1'='1".

Hth