Come sappiamo, gli sviluppatori sono responsabili della corretta escaping / validazione dei dati forniti dall'utente prima di renderli o memorizzarli. Tuttavia, dobbiamo convenire che è relativamente facile dimenticare un singolo input tra centinaia e, infine, ottenere l'app Web sfruttata da un XSS. Oppure non hai incontrato qualcuno che ha sfruttato il suo sito XSS?
Anche Twitter e Orkut hanno recentemente sofferto di XSS. E non sono qui per incolpare nessuno.
Supponiamo che il tuo browser supporti gli elementi DOM di whitelisting. Questi elementi autorizzati sono gli unici elementi consentiti per eseguire JavaScript. Ti rendi presto conto che sembra folle perché è impossibile mantenere il tuo sito Web preferito funzionando correttamente se hai una whitelist generica. E tu hai ragione!
Ma ora supponiamo che i motori HTML e JavaScript supportino una sintassi per consentire di autorizzare elementi del tuo sito web. Ad esempio:
<head>
<script type="text/javascript">
document.allowJavaScript(['div.item', '#list', 'a.navigate']);
</script>
</head>
Questo non risolve il problema del rendering dei tag <script> nel mezzo di un albero DOM, ma questo è molto più facile da risolvere, suppongo.
Oltre al punto precedente, che tipo di problemi o difetti vedi nella soluzione descritta?
UPDATE 1 : solo l'elemento head deve essere considerato attendibile per richiamare allowJavaScript .
UPDATE 2 : si spera che il seguente snippet spieghi la mia idea un po 'oltre:
<html>
<head>
<style>
div.outer { background-color: #aaa; width: 200px; height: 100px; }
div.inner { background-color: #5ff; width: 100px; height: 50px; }
ul { list-style-type: none; }
li { background-color: #bbc; border: 1px solid #fff; float: left;
width: 100px; height: 30px; }
</style>
<script type="text/javascript">
document.allowJavaScript(['div.outer', '#list', 'a.test']);
function register_events() {
var list = document.querySelector('#list');
list.onclick = function() { alert('list'); }
var example1 = document.querySelector('#list li:nth-of-type(1)');
example1.onclick = function() { alert('example 1'); }
}
window.onload = register_events;
</script>
</head>
<body>
<div class="outer" onclick="alert('outer');">
<div class="inner" onmouseover="alert('inner');">
</div>
</div>
<a class="navigate" href="#" onclick="alert('a');">click me</a>
<ul id="list">
<li>example 1</li>
<li>example 2</li>
</ul>
</body>
</html>
Questo NON dovrebbe consentire l'esecuzione di:
-
alert('inner')- > consentidiv.outer, ma nessuno dei suoi elementi figli; -
alert('example 1')- > consenti#list, ma nessuno dei suoi elementi figli; -
alert('a')- > consentia.test, nona.navigate;