Keskustelu: Yleinen keskustelu: Kuinka esittää JS-koodia suorittamatta sitä?

Millä keinolla html -sivulle voi laittaa näkyviin kävijöiden luettavaksi javascript -koodiesimerkkejä niin, ettei tuota koodia suoriteta, vaan itse lähdekoodi näytetään selaimessa?

Korvaa merkki < merkinnällä &lt; ja merkki > merkinnällä &gt;.

&lt; = less than = pienempi kuin
&gt; = greater than = suurempi kuin

Esimerkki:

<script>
alert("Moi!");
</script>

HTML-sivulla:

<pre>
&lt;script&gt;
alert("Moi!");
&lt;/script&gt;
</pre>

Muunnoksen voi automatisoida näppärästi PHP:llä:

<?php

// näytetään tiedostossa moi.js oleva koodi

$tiedosto = "moi.js";
$koodi = file_get_contents($tiedosto);

$koodi = str_replace("<", "&lt;", $koodi);
$koodi = str_replace(">", "&gt;", $koodi);

echo "<pre>$koodi</pre>";

?>

PHP:ssä tarvittavat korvaukset voi tehdä funktiolla htmlspecialchars.

<?php
$koodi = '
<script>
alert("Moi!");
</script>
';
echo "<pre>", htmlspecialchars($koodi), "</pre>";

Tämä on yleisesti ottaen parempi tapa kuin omien str_replace-viritelmien käyttö, koska tämä korvaa myös &-merkin tekstillä &amp; ja "-merkin tekstillä &quot;. Muuten esimerkiksi seuraava koodi näkyisi väärin:

alert("&-merkin saa kirjoittamalla &");

Tuo on tosiaan parempi.

Onko lainausmerkin muunnos joskus tarpeen?

Lainausmerkin muunnoksesta on hyötyä, jos tekstiä on tarkoitus lisätä lainausmerkkien väliin:

<img src="hege.jpg" alt="" title="Heikki &quot;Hegemoni&quot; Heikkilä">
<!-- Heikki "Hegemoni" Heikkilä. -->

Muunnoksella on merkitystä jo käytännön tietoturvankin kannalta. Kuvitellaanpa seuraava muunnos esimerkiksi jonkin foorumin viesteissä:

Syöte: [linkki http://osoite.fi/muuta] teksti [/linkki]
Tulos: <a href="http://osoite.fi/muuta"> teksti </a>

Jos lainausmerkkejä ei muunneta eikä linkin muotoa tarkisteta, käyttäjä voi ujuttaa sivulle JavaScriptia:

Syöte: [linkki http://osoite.fi/muuta" onclick="alert(document.cookie);]
Tulos: <a href="http://osoite.fi/muuta" onclick="alert(document.cookie);">

(Tosin jos foorumilla ei tarkisteta linkin alkuosaa, JS-koodia voi lisätä suoraankin tai epäonnistuneen suojauksen ohi pienellä kikkailulla.)