Come posso evitare correttamente le virgolette all'interno degli attributi HTML?

267

Ho un menu a discesa su una pagina Web che si interrompe quando la stringa del valore contiene un preventivo.

Il valore è "asd, ma nel DOM appare sempre come una stringa vuota.

Ho provato in tutti i modi che conosco per sfuggire correttamente alla stringa, ma senza risultati.

<option value=""asd">test</option>
<option value="\"asd">test</option>
<option value="&quot;asd">test</option>
<option value="&#34;asd">test</option>

Come posso renderlo sulla pagina in modo che il messaggio postback contenga il valore corretto?

html xhtml escaping

— Chris
fonte

Come stai generando la pagina?

— SLaks,

1

E se utilizzi virgolette singole? <option value = '"asd'> test </option>

— Wim ten Brink

5

Devo sottolineare che nessuna di queste risposte dice come sfuggire correttamente alle stringhe per l'uso all'interno degli attributi html

— riconnettere il

4

@reconbot Dipenderebbe da come veniva generato l'HTML. La domanda riguardava le virgolette, quindi tecnicamente la risposta accettata risponde alla domanda posta. Per quanto riguarda come sfuggire correttamente alle stringhe, non ho un link utile per il caso generale, ma in PHP useresti htmlentities.

— Matt Browne,

possibile duplicato di come avere le virgolette nei valori di input HTML

— Ciro Santilli illi 冠状病六四事件法轮功

344

" è il modo corretto, il terzo dei tuoi test:

<option value="&quot;asd">test</option>

Puoi vederlo funzionare sotto o su jsFiddle .

alert($("option")[0].value);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
  <option value="&quot;asd">Test</option>
</select>

Espandi frammento

In alternativa, puoi delimitare il valore dell'attributo con virgolette singole:

<option value='"asd'>test</option>

— Andy E
fonte

17

La quarta opzione di OP, & # 34 ;, è anche un modo valido per sfuggire alle virgolette. C'è un vantaggio nell'utilizzare entità html numeriche su entità nominate, in quanto le entità nominate non coprono tutti i caratteri, mentre le entità numeriche lo fanno. L'elenco completo di HTML4 è disponibile su w3.org/TR/html4/sgml/entities.html .

— atk

38

@atk: sì, si "associa allo stesso carattere di ", ma non c'è alcun vantaggio nell'usare qui l'opzione numerica perché "è un'entità denominata definita. "è anche più facile da ricordare.

— Andy E

6

Sono d'accordo. In questo caso particolare, è più facile usare & quot ;. Intendevo solo sottolineare il caso generale.

— atk,

4

@SIDU: modificalo in &quot;a(sostituisci &con &)

— Andy E

4

^ loop infinito

— Omar Meky,

16

Se stai usando PHP, prova a chiamare htmlentitieso htmlspecialcharsfunzione.

— Lukasz Czerwinski
fonte

2

semplicemente usarli potrebbe non essere sufficiente, prova <option value='<?php echo htmlentities("' onmouseover='alert(123);' foo='"); ?>' />- assicurati di usarlo con ENT_QUOTES, questo è sicuro:, <option value='<?php echo htmlentities("' onmouseover='alert(123);' foo='", ENT_QUOTES); ?>' /> ma oltre a ENT_QUOTES dovresti anche aggiungere ENT_SUBSTITUTE ed ENT_DISALLOWED, personalmente ho usato questo wrapper per anni:

function hhb_tohtml(string $str):string {     return htmlentities($str, ENT_QUOTES | ENT_HTML401 | ENT_SUBSTITUTE | ENT_DISALLOWED, 'UTF-8', true); }

— hanshenrik il

12

Per sintassi HTML e persino HTML5 , le seguenti sono tutte opzioni valide:

<option value="&quot;asd">test</option>
<option value="&#34;asd">test</option>
<option value='"asd'>test</option>
<option value='&quot;asd'>test</option>
<option value='&#34;asd'>test</option>
<option value=&quot;asd>test</option>
<option value=&#34;asd>test</option>

Si noti che se si utilizza la sintassi XML sono richieste le virgolette (singole o doppie).

Ecco un jsfiddle che mostra tutto quanto sopra funzionante .

— aij
fonte

7

Un'altra opzione è quella di sostituire le virgolette doppie con virgolette singole se non ti dispiace qualunque cosa sia. Ma non menziono questo:

<option value='"asd'>test</option>

Cito questo:

<option value="'asd">test</option>

Nel mio caso ho usato questa soluzione.

— csonuryilmaz
fonte

9

Ma se il valore contiene virgolette singole e doppie, questo fallirà

— Raptor

@Raptor Ho detto che se il valore contiene virgolette doppie, convertirle in virgolette singole. Se il valore contiene virgolette singole, non sarà un problema.

— csonuryilmaz,

1

Se stai usando Javascript e Lodash, puoi usare _.escape (), che sfugge a ",", <,> e &.

Vedi qui: https://lodash.com/docs/#escape

— Andrea
fonte

0

Dovresti davvero consentire solo dati non attendibili in una whitelist di buoni attributi come: allinea, alink, alt, bgcolor, border, cellpadding, cellpacing, class, color, colspan, colspan, coords, dir, face, height, hspace, ismap, lang , marginheight, marginwidth, multiple, nohref, noresize, noshade, nowrap, ref, rel, rev, righe, rowpan, scrolling, shape, span, summary, tabindex, title, usemap, valign, value, vlink, vspace, width

Vuoi davvero mantenere i dati non attendibili fuori dai gestori javascript e dagli attributi id o name (possono ostruire altri elementi nel DOM).

Inoltre, se stai inserendo dati non attendibili in un attributo SRC o HREF, allora è davvero un URL non attendibile, quindi dovresti convalidare l'URL, assicurati che NON sia un javascript: URL e quindi codificare l'entità HTML.

Maggiori dettagli su tutto qui: https://www.owasp.org/index.php/Abridged_XSS_Prevention_Cheat_Sheet

— Jim Manico
fonte

3

So che questo è in ritardo, ma quasi tutti questi attributi sono deprecati in HTML4.01 e rimossi in 5. Ora potrebbe non importare comunque, poiché ci sono modi migliori per proteggersi, semplicemente sottolineandolo.

— trysis,

1

La domanda riguarda i dati con virgolette, non i dati non attendibili.

— Quentin,

-3

Non c'è modo di sfuggire alle virgolette nel valore di un testo di input ... ma puoi usare javascript (o jquery):

<input type="input" name="myinput" id="myinput" value="" />
<script>document.getElementById("myinput").value="This input has a [\"]";</script>

— Miguel
fonte

1

La tua affermazione "Non c'è modo di sfuggire alle virgolette nel valore di un testo di input" è semplicemente sbagliata. Vedi la risposta accettata dal 2010 che ha ricevuto 276 voti in più.

— Quentin,

Mi scusi Quentin, ma CHE RISPOSTA dice che non c'è modo di farlo. Dice che puoi inserire una virgoletta doppia codificata HTML o puoi usare una semplice virgoletta per delimitare la doppia virgoletta, ma non è possibile inserire una virgoletta doppia nel valore definito con virgolette doppie. Propone un'alternativa a qualcosa di impossibile, che è lo stesso di quello che faccio

— Miguel,

Il modo per inserire una virgoletta doppia in un valore delimitato da una virgoletta doppia consiste nell'utilizzare la codifica HTML come hai appena detto.

— Quentin,

(Ciao Quentin ... siamo online) Sto solo dicendo che il valore di quella stringa non è una doppia virgoletta, è un & quot ;, che non è lo stesso.

— Miguel,

2

Se inserisci un & quot; in un valore e lo invii, nel server ricevi 6 caratteri, da & a ;. Non ricevi un doppio preventivo. Non è lo stesso e non funziona per me

— Miguel,