web-dev-qa-db-fra.com

Escape cite en JavaScript

Je produis des valeurs à partir d'une base de données (elle n'est pas vraiment ouverte au public, mais à un utilisateur de l'entreprise. Cela signifie que je ne m'inquiète pas XSS =.)

J'essaie de sortir une balise comme ceci:

<a href="" onclick="DoEdit('DESCRIPTION');">Click Me</a>

DESCRIPTION est en fait une valeur de la base de données qui ressemble à ceci:

Prelim Assess "Mini" Report

J'ai essayé de remplacer "par \", mais peu importe ce que j'essaie, Firefox continue de couper mon appel JavaScript après l'espace après le mot Assess , et cela cause toutes sortes de problèmes.

Je dois vous cacher la réponse évidente, mais pour ma vie, je ne peux pas le comprendre.

Quelqu'un veut-il signaler mon idiotie?

Voici la totalité de la page HTML (ce sera éventuellement une page ASP.NET , mais pour résoudre ce problème, j’ai retiré tout le reste, sauf le code du problème).

<html>
    <body>
        <a href="#" onclick="DoEdit('Preliminary Assessment \"Mini\"'); return false;">edit</a>
    </body>
</html>
javascriptquotesescaping
201
Matt Dawdy

Vous devez vous échapper de la chaîne que vous écrivez dans DoEdit pour effacer les caractères de citation double. Ils provoquent la fermeture prématurée de l'attribut HTML onclick HTML.

L'utilisation du caractère d'échappement JavaScript, \, n'est pas suffisante dans le contexte HTML. Vous devez remplacer le guillemet double par la représentation d'entité XML appropriée, &quot;.

201
Aaron

&quot; fonctionnerait dans ce cas particulier, comme suggéré précédemment, en raison du contexte HTML.

Toutefois, si vous souhaitez que votre code JavaScript soit indépendamment échappé pour n'importe quel contexte, vous pouvez opter pour le codage JavaScript natif:
' devient \x27
" devient \x22

Donc, votre onclick deviendrait:
DoEdit('Preliminary Assessment \x22Mini\x22');

Cela fonctionnerait par exemple également lors du passage d'une chaîne JavaScript en tant que paramètre à une autre méthode JavaScript (alert() est une méthode de test simple pour cela).

Je vous renvoie à la question de dépassement de pile en double, Comment puis-je échapper à une chaîne dans du code JavaScript dans un gestionnaire onClick? .

89
tsemer
<html>
    <body>
        <a href="#" onclick="DoEdit('Preliminary Assessment &quot;Mini&quot;'); return false;">edit</a>
    </body>
</html>

Devrait faire l'affaire.

33
kristian

Chers amis, il existe déjà la fonction unescape en JavaScript qui effectue la décompression pour \":

<script type="text/javascript">
    var str="this is \"good\"";
    document.write(unescape(str))
</script>
23
rohtakdev

Le problème est que HTML ne reconnaît pas le caractère d'échappement. Vous pouvez contourner ce problème en utilisant les guillemets simples pour l'attribut HTML et les guillemets doubles pour onclick.

<a href="#" onclick='DoEdit("Preliminary Assessment \"Mini\""); return false;'>edit</a>
12
dl.

Voici comment je le fais, essentiellement str.replace(/[\""]/g, '\\"').

var display = document.getElementById('output');
var str = 'class="whatever-foo__input" id="node-key"';
display.innerHTML = str.replace(/[\""]/g, '\\"');

//will return class=\"whatever-foo__input\" id=\"node-key\"
<span id="output"></span>
6
Ron Royston

Si vous assemblez le code HTML en Java, vous pouvez utiliser cette classe d’utilitaires d’Apache commons-lang pour exécuter correctement toutes les opérations d’échappement:

org.Apache.commons.lang.StringEscapeUtils
Échappements et désescapes Strings for Java, Java Script, HTML, XML et SQL.

2
iTake

Veuillez trouver ci-dessous le code qui échappe aux guillemets simples dans la chaîne entrée en utilisant une expression régulière. Il valide si la chaîne entrée par l'utilisateur est séparée par des virgules et en même temps, elle échappe même à tout guillemet saisi dans la chaîne. Afin d'échapper à la citation simple, entrez simplement la barre oblique inverse suivie d'une citation simple, comme suit: \ ' dans le cadre de la chaîne. J'ai utilisé le validateur JQuery pour cet exemple, que vous pouvez utiliser selon votre moyen de transport.

Exemples de chaîne valides:

'Salut'

'Bonjour le monde'

'Bonjour le monde'

'Bonjour le monde',' '

'C’est mon monde', 'Je ne peux pas en profiter sans moi.', 'Bienvenue, Invité'

HTML:

<tr>
    <td>
        <label class="control-label">
            String Field:
        </label>
        <div class="inner-addon right-addon">
            <input type="text" id="stringField" 
                   name="stringField"
                   class="form-control"
                   autocomplete="off"
                   data-rule-required="true"
                   data-msg-required="Cannot be blank."
                   data-rule-commaSeparatedText="true"
                   data-msg-commaSeparatedText="Invalid comma separated value(s).">
        </div>
    </td>

JavaScript:

    /**
 * 
 * @param {type} param1
 * @param {type} param2
 * @param {type} param3
 */
jQuery.validator.addMethod('commaSeparatedText', function(value, element) {

    if (value.length === 0) {
        return true;
    }
    var expression = new RegExp("^((')([^\'\\\\]*(?:\\\\.[^\'\\\\])*)[\\w\\s,\\.\\-_\\[\\]\\)\\(]+([^\'\\\\]*(?:\\\\.[^\'\\\\])*)('))(((,)|(,\\s))(')([^\'\\\\]*(?:\\\\.[^\'\\\\])*)[\\w\\s,\\.\\-_\\[\\]\\)\\(]+([^\'\\\\]*(?:\\\\.[^\'\\\\])*)('))*$");
    return expression.test(value);
}, 'Invalid comma seperated string values.');
1
Dinesh Lomte

J'ai fait un exemple avec jQuery

var descr = 'test"inside"outside';
$(function(){
   $("#div1").append('<a href="#" onclick="DoEdit(descr);">Click Me</a>');       
});

function DoEdit(desc)
{
    alert ( desc );
}

Et cela fonctionne dans Internet Explorer et Firefox.

1
rahul

Vous pouvez copier ces deux fonctions (énumérées ci-dessous) et les utiliser pour échapper/libérer des guillemets et des caractères spéciaux. Vous n'avez pas besoin d'utiliser jQuery ou une autre bibliothèque pour cela.

function escape(s) {
return ('' + s) 
    .replace(/\\/g, '\\\\') 
    .replace(/\t/g, '\\t') 
    .replace(/\n/g, '\\n')
    .replace(/\u00A0/g, '\\u00A0') 
    .replace(/&/g, '\\x26') 
    .replace(/'/g, '\\x27')
    .replace(/"/g, '\\x22')
    .replace(/</g, '\\x3C')
    .replace(/>/g, '\\x3E');
 }

function unescape(s) {
 s = ('' + s) 
    .replace(/\\x3E/g, '>')
    .replace(/\\x3C/g, '<')
    .replace(/\\x22/g, '"')
    .replace(/\\x27/g, "'")
    .replace(/\\x26/g, '&') 
    .replace(/\\u00A0/g, '\u00A0') 
    .replace(/\\n/g, '\n')
    .replace(/\\t/g, '\t');

  return s.replace(/\\\\/g, '\\');
}
0
omanosoft

Vous devez échapper aux guillemets avec des doubles barres obliques inverses.

Cela échoue (produit par PHP json_encode ):

<script>
  var jsonString = '[{"key":"my \"value\" "}]';
  var parsedJson = JSON.parse(jsonString);
</script>

Cela marche:

<script>
  var jsonString = '[{"key":"my \\"value\\" "}]';
  var parsedJson = JSON.parse(jsonString);
</script>
0
Buffalo

Vous pouvez utiliser les méthodes escape () et unescape () jQuery.

Utilisateur d'échappement (str); pour échapper à la chaîne et récupérer à nouveau en utilisant unescape (str_esc);

0
Abhiram

Échappez aussi aux espaces blancs. Il me semble que Firefox assume trois arguments au lieu d’un. &nbsp; est le caractère d'espace insécable. Même si ce n'est pas tout le problème, cela reste une bonne idée.

0
the Hampster