Wie entkomme ich Anführungszeichen in HTML-Attributen richtig?

267

Ich habe ein Dropdown-Menü auf einer Webseite, das unterbrochen wird, wenn die Wertzeichenfolge ein Anführungszeichen enthält.

Der Wert ist "asd, aber im DOM wird er immer als leere Zeichenfolge angezeigt.

Ich habe alles versucht, um der Schnur richtig zu entkommen, aber ohne Erfolg.

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

Wie rendere ich dies auf der Seite, damit die Postback-Nachricht den richtigen Wert enthält?

html xhtml escaping Chris
quelle
Wie generieren Sie die Seite?
SLaks
1
Was ist, wenn Sie einfache Anführungszeichen verwenden? <option value = '"asd'> test </ option>
Wim ten Brink
5
Ich muss darauf hinweisen, dass keine dieser Antworten sagt, wie man Strings für die Verwendung in HTML-Attributen richtig
maskiert
4
@reconbot Das hängt davon ab, wie der HTML-Code generiert wurde. Bei der Frage ging es um Zitate, daher beantwortet die akzeptierte Antwort technisch die gestellte Frage. Ich habe keinen Link für den allgemeinen Fall, aber in PHP würden Sie ihn verwenden htmlentities.
Matt Browne
Mögliches Duplikat von Anführungszeichen in HTML-Eingabewerten
Ciro Santilli 法轮功 冠状 病. 事件 法轮功

Antworten:

343

&quot; ist der richtige Weg, der dritte Ihrer Tests:

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

Sie können dies unten oder auf jsFiddle sehen .

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>
Erweitern Sie das Snippet

Alternativ können Sie den Attributwert in einfache Anführungszeichen setzen:

<option value='"asd'>test</option>
Andy E.
quelle
17
Die vierte Option von OP, & # 34;, ist ebenfalls eine gültige Methode, um Anführungszeichen zu umgehen. Die Verwendung von numerischen HTML-Entitäten gegenüber benannten Entitäten hat den Vorteil, dass benannte Entitäten nicht alle Zeichen abdecken, während numerische Entitäten dies tun. Die vollständige HTML4-Liste finden Sie unter w3.org/TR/html4/sgml/entities.html .
Atk
38
@atk: Ja, entspricht &quot;demselben Zeichen wie &#34;, aber die Verwendung der numerischen Option hat keinen Vorteil, da &quot;es sich um eine definierte benannte Entität handelt. &quot;ist auch leichter zu merken.
Andy E
6
Genau. In diesem speziellen Fall ist die Verwendung von & quot; einfacher. Ich wollte nur auf den allgemeinen Fall hinweisen.
Atk
4
@SIDU: ändern Sie es zu &amp;quot;a(ersetzen Sie &durch &amp;)
Andy E
4
^ Endlosschleife
Omar Meky
16

Wenn Sie PHP verwenden, versuchen Sie es mit Aufruf htmlentitiesoder htmlspecialcharsFunktion.

Lukasz Czerwinski
quelle
2
Es reicht möglicherweise nicht aus, sie nur zu verwenden. Versuchen <option value='<?php echo htmlentities("' onmouseover='alert(123);' foo='"); ?>' />Sie, sie mit ENT_QUOTES zu verwenden. Dies ist sicher: <option value='<?php echo htmlentities("' onmouseover='alert(123);' foo='", ENT_QUOTES); ?>' /> Aber zusätzlich zu ENT_QUOTES sollten Sie auch ENT_SUBSTITUTE und ENT_DISALLOWED hinzufügen. Ich persönlich habe diesen Wrapper seit Jahren verwendet:function hhb_tohtml(string $str):string { return htmlentities($str, ENT_QUOTES | ENT_HTML401 | ENT_SUBSTITUTE | ENT_DISALLOWED, 'UTF-8', true); }
hanshenrik
12

Gemäß HTML-Syntax und sogar HTML5 sind alle folgenden Optionen gültig:

<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>

Beachten Sie, dass bei Verwendung der XML-Syntax die Anführungszeichen (einfach oder doppelt) erforderlich sind.

Hier ist eine jsfiddle, die alle oben genannten Funktionen zeigt .

aij
quelle
7

Eine andere Möglichkeit besteht darin, doppelte Anführungszeichen durch einfache Anführungszeichen zu ersetzen, wenn Sie nichts dagegen haben. Aber ich erwähne diesen nicht:

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

Ich erwähne dieses:

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

In meinem Fall habe ich diese Lösung verwendet.

Csonuryilmaz
quelle
9
Aber wenn der Wert einfache und doppelte Anführungszeichen enthält, schlägt dies fehl
Raptor
@Raptor Ich sagte, wenn der Wert doppelte Anführungszeichen enthält, konvertieren Sie sie in einfache Anführungszeichen. Wenn der Wert einfache Anführungszeichen enthält, ist dies kein Problem.
Csonuryilmaz
0

Sie sollten wirklich nur nicht vertrauenswürdige Daten in eine Whitelist mit guten Attributen wie Align, Alink, Alt, BGColor, Border, Cellpadding, Cellspacing, Klasse, Farbe, Cols, Colspan, Coords, Dir, Gesicht, Höhe, Hspace, Ismap, Lang zulassen , marginheight, marginwidth, multiple, nohref, noresize, noshade, nowrap, ref, rel, rev, Zeilen, Zeilenumfang, Scrollen, Form, Spanne, Zusammenfassung, Tabindex, Titel, Usemap, Valign, Wert, Vlink, Vspace, Breite

Sie möchten wirklich nicht vertrauenswürdige Daten von Javascript-Handlern sowie ID- oder Namensattributen fernhalten (sie können andere Elemente im DOM blockieren).

Wenn Sie nicht vertrauenswürdige Daten in ein SRC- oder HREF-Attribut einfügen, handelt es sich tatsächlich um eine nicht vertrauenswürdige URL. Überprüfen Sie daher die URL, stellen Sie sicher, dass es sich NICHT um eine Javascript: URL handelt, und codieren Sie dann die HTML-Entität.

Weitere Details dazu finden Sie hier: https://www.owasp.org/index.php/Abridged_XSS_Prevention_Cheat_Sheet

Jim Manico
quelle
3
Ich weiß, dass dies spät ist, aber fast alle diese Attribute sind in HTML4.01 veraltet und werden in 5 entfernt. Es spielt jetzt möglicherweise sowieso keine Rolle, da es bessere Möglichkeiten gibt, sich zu schützen, indem Sie nur darauf hinweisen.
Tryse
1
Die Frage bezieht sich auf Daten mit Anführungszeichen und nicht auf nicht vertrauenswürdige Daten.
Quentin
-3

Es gibt keine Möglichkeit, Anführungszeichen im Wert eines Eingabetextes zu umgehen ... Sie können jedoch Javascript (oder jquery) verwenden:

<input type="input" name="myinput" id="myinput" value="" />
<script>document.getElementById("myinput").value="This input has a [\"]";</script>
Miguel
quelle
1
Ihre Aussage "Es gibt keine Möglichkeit, Anführungszeichen im Wert eines Eingabetextes zu umgehen" ist einfach falsch. Siehe die akzeptierte Antwort von 2010, die 276 Stimmen erhalten hat.
Quentin
Entschuldigen Sie mich, Quentin, aber DIESE ANTWORT sagt, dass dies keine Möglichkeit ist. Es heißt, dass Sie ein HTML-codiertes doppeltes Anführungszeichen einfügen oder ein einfaches Anführungszeichen verwenden können, um das doppelte Anführungszeichen abzugrenzen. Es ist jedoch nicht möglich, ein doppeltes Anführungszeichen in einen mit doppeltem Anführungszeichen definierten Wert einzufügen. Es schlägt eine Alternative zu etwas Unmöglichem vor, das das gleiche ist wie das, was ich tue
Miguel
Die Möglichkeit, ein doppeltes Anführungszeichen in einen durch ein doppeltes Anführungszeichen getrennten Wert einzufügen, besteht darin, die HTML-Codierung zu verwenden, wie Sie gerade gesagt haben.
Quentin
(Hallo Quentin ... wir sind online) Ich sage nur, dass der Wert dieser Zeichenfolge kein doppeltes Anführungszeichen ist, sondern ein & quot;, das nicht dasselbe ist.
Miguel
2
Wenn Sie ein & quot; in einem Wert und Sie senden ihn, auf dem Server erhalten Sie 6 Zeichen vom & zum;. Sie erhalten kein doppeltes Angebot. Es ist nicht dasselbe und es funktioniert nicht für mich
Miguel