JavaScript'ten alıntılardan kaç

211

Veritabanından değerler çıkarıyorum (gerçekten genel girişe açık değil, ancak şirketteki bir kullanıcı tarafından girişe açık - yani, XSS hakkında endişelenmiyorum ).

Ben böyle bir etiket çıktı çalışıyorum:

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

AÇIKLAMA aslında veritabanından şuna benzer bir değerdir:

Prelim Assess "Mini" Report

Ben "ile \" değiştirmeyi denedim, ama ne denesem denesem, Firefox Değerlendir kelimesinden sonraki boşluktan sonra JavaScript çağrımı kesmeye devam ediyor ve her türlü soruna neden oluyor.

Açık cevabı yaymak zorundayım, ama benim hayatım için çözemiyorum.

Aptallığımı belirtmek isteyen var mı?

İşte tüm HTML sayfası ( sonunda bir ASP.NET sayfası olacak , ancak bunu çözmek için sorun kodu dışında her şeyi çıkardım)

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

javascript quotes escaping

— Matt Dawdy
kaynak

3

onclickEtkinlik ekinizi göze batmaz hale getirmek ve tüm veritabanı bilgilerinizi bir veri adasına taşımak iyi bir fikirdir . İşler daha temiz olacak ve dizeleriniz yanlış kaçtığında aslında bir çeşit sözdizimi hatası alacaksınız.

— Justin Johnson

1

Olası yinelenen ben bir onClick işleyicisi içinde JavaScript kodu içinde bir dize kaçmayı nasıl? .

— Peter Mortensen

Ayrıca escape ("string") ve unescape ("string") jquery yöntemlerini de kullanabilirsiniz

— Abhiram

212

DoEditÇift tırnak karakterlerini temizlemek için yazdığınız dizeden kaçmanız gerekir . onclickHTML özelliğinin erken kapanmasına neden oluyorlar .

JavaScript kaçış karakterini kullanmak, \HTML bağlamında yeterli değildir. Çift tırnak işaretini doğru XML varlık gösterimi ile değiştirmeniz gerekir ".

— Aaron
kaynak

Doğru, ama bu olmaz mı? <a href="#" onclick="DoEdit('Ön Değerlendirme "\"Mini\"'); dönüş yanlış;"> düzenleme </a> Bunu denedim ve hala berbat. Bu basit bir WTF olmalı ama benim hayatım boyunca göremiyorum.

— Matt Dawdy

Çift tırnak işaretlerinden kaçabilecek yerleşik bir JavaScript işlevi var mı? 'Quo "' dışında. ('"', '& Quot;') yerine hiçbir şey bulamıyorum.

— kevin

4

Bu bir javascript sorunu değil, bir HTML / XML kodlama sorunudur: onlardan kaçan özellik değeri içinde çift tırnak işareti kullanamazsınız ... aksi takdirde tarayıcılar / ayrıştırıcılar özellik değeri bildirimini sonlandırdığınızı düşünür.

— Aaron

22

örnek değiştirme kodu:'mystring'.replace(/"/g, '"');

— Joshua Burns

3

önceki yorumda ekstra bir teklif var. Çalışan kod 'mystring'.replace (/' / g, '& quot;');

— Agustin Lopez

95

" HTML bağlamı nedeniyle benden önce önerildiği gibi bu özel durumda çalışır.

Eğer JavaScript kodu bağımsız herhangi bağlam için öncelenmelidir istiyorsanız Ancak, yerli JavaScript kodlama tercih olabilir:
'olur \x27
"olur\x22

Böylece onclick'iniz şöyle olur:
DoEdit('Preliminary Assessment \x22Mini\x22');

Bu, örneğin bir JavaScript dizesini başka bir JavaScript yöntemine parametre olarak geçirirken de işe yarayacaktır ( alert()bunun için kolay bir test yöntemidir).

Yinelenen Stack Overflow sorusuna, bir onClick işleyicisinin içindeki JavaScript kodunun içindeki bir dizeden nasıl kaçarım? .

— tsemer
kaynak

2

Teşekkür ederim! Sizinki, daha doğru bir yanıttır, çünkü bağlamdan bağımsız olarak yerel JavaScripttir.

— scarver2

2

Bu doğru cevaptır, ancak bir HTML bağlamında "elbette çalışacaktır.

— Oliver

"Giriş değerlerinde gerekli olduğunu unutmayın , yani <input value="\x22quoted string\x22">çalışmaz.

— thdoan

@ 10basetom doğal olarak, kaçan JavaScript yalnızca olay işleyicileri ( onclick="...") gibi bir JavaScript bağlamında çalışır . Bir valueözelliğin değeri bir JavaScript bağlamında değil, yalnızca HTML bağlamında işlenir.

— tsemer

değiştirme kodu:'mystring'.replace(/"/g, '\\x22').replace(/'/g, '\\x27')

— tavuklar

33

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

Hile yapmalı.

— kristian
kaynak

24

Millet, unescapeJavaScript'te zaten kaçış yapan işlevi var \":

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

— rohtakdev
kaynak

2

"Kaçış" / "unescape" bir arada benim gerekli yaptı. Teşekkürler.

— Luis R.

8

escape / unescape kullanımdan kaldırıldı. rağmen encodeURI sadece tırnak daha fazlasını yapar. gotochriswest.com/blog/2011/05/23/escape-unescape-deprecated

— chug2k

12

Sorun HTML'nin çıkış karakterini tanımamasıdır. HTML özelliği için tek tırnak işaretlerini ve onclick için çift tırnak işaretlerini kullanarak bu sorunu çözebilirsiniz.

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

— dl.
kaynak

5

Amanın. Ben neden doğal olarak geçmişte bu özellik için kullanmaya başvurduğumu merak ediyordum. Hiç bu kadar derinlemesine araştırmadım. Teşekkürler.

— Matt Dawdy

6

Temel olarak böyle yapıyorum 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>

Snippet'i genişlet

— Ronnie Royston
kaynak

2

HTML'yi Java'da bir araya getiriyorsanız, tüm çıkış işlemlerini doğru bir şekilde yapmak için Apache commons-lang'deki bu güzel yardımcı program sınıfını kullanabilirsiniz:

org.apache.commons.lang.StringEscapeUtils
Java, Java Script, HTML, XML ve SQL Dizelerinden kaçar ve kaçar.

— alırım
kaynak

Java'da methodExpression oluşturmak için org.apache.commons.lang3.StringEscapeUtils.escapeEcmaScript (metin) kullanıyorum. Teşekkürler.

— Harun

1

JQuery kullanarak bir örnek bir yaptım

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

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

Ve bu Internet Explorer ve Firefox'ta çalışır.

— rahul
kaynak

5

Elbette öyle, çünkü doğrudan niteliğe koymuyorsunuz. Yönteminizi kullanmak için, bir JS dizeleri dizisi oluşturmak, sonra isteğe bağlı sayıda $ ("# divxxx") ... atamaları yapmak zorunda kalacaktım. Optimalden daha az, ancak öneri için teşekkürler.

— Matt Dawdy

1

Bu iki işlevi (aşağıda listelenmiştir) kopyalayabilir ve tüm tırnak işaretlerinden ve özel karakterlerden kaçmak / bu karakterleri kaldırmak için kullanabilirsiniz. Bunun için jQuery veya başka bir kitaplık kullanmanız gerekmez.

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, '\\');
}

— omanosoft
kaynak

1

Lütfen aşağıdaki kodda, normal bir ifade kullanarak girilen dizenin bir parçası olarak tek tırnak işaretlerinden kaçan kodu bulun. Kullanıcı tarafından girilen dizenin virgülle ayrılıp ayrılmadığını ve dizenin bir parçası olarak girilen herhangi bir tek tırnaktan bile kaçtığını doğrular.

Tek tırnaklardan kaçmak için, geriye doğru eğik çizgi ve ardından dizenin bir parçası olarak : \ ' gibi tek bir alıntı girin . Bu örnek için jQuery validator kullandım ve rahatlığınıza göre kullanabilirsiniz.

Geçerli Dize Örnekleri:

'Merhaba'

'Selam Dünya'

'Selam Dünya',' '

'Bu benim dünyam', 'Bensiz benden zevk alamazsınız.', 'Hoş geldiniz, Misafir'

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 separated string values.');

— Dinesh Lomte
kaynak

0

Boşluktan da kaç. Firefox'un biri yerine üç argüman üstlendiği gibi geliyor bana.  kırılmayan boşluk karakteridir. Bütün sorun olmasa bile, yine de iyi bir fikir olabilir.

— Hampster
kaynak

0

Çift ters eğik çizgi ile tırnak kaçmak gerekir.

Bu başarısız (PHP'nin json_encode tarafından üretilen ):

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

Bu çalışıyor:

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

— bizon
kaynak

0

Escape () ve unescape () jQuery yöntemlerini kullanabilirsiniz. Aşağıdaki gibi,

escape(str);Dize kaçmak ve kullanarak tekrar kurtarmak için kullanın unescape(str_esc);.

— Abhiram
kaynak