多分、私が難しく考えすぎているだけなのでしょうが、リンクのonClickハンドラ内のいくつかのJavaScriptコードで、文字列にどのようなエスケープを使用すればよいかがわからずに困っています。例
<a href="#" onclick="SelectSurveyItem('<%itemid%>', '<%itemname%>'); return false;">Select</a>
例:{{5319413}}の「<%itemid%>」と「<%itemname%>
」はテンプレート置換が行われる場所です。私の問題は、アイテム名がシングルクォートとダブルクォートを含む任意の文字を含むことができることです。現在、シングルクォートを含むと、JavaScriptのコードが壊れてしまいます。
最初に考えたのは、テンプレート言語の機能を使って、アイテム名をJavaScriptでエスケープすることでした。これでは、ダブルクォートを含む文字列がリンクのHTMLを壊してしまうケースを解決することはできません。この問題は、通常どのように対処するのでしょうか?onClickハンドラ全体をHTMLエスケープする必要があるのでしょうか?
もしそうなら、テンプレート言語のエスケープ関数が括弧、引用符、セミコロンもHTML化するので、とても奇妙に見えるでしょう...。
このリンクは、検索結果ページのすべての結果に対して生成されるので、JavaScriptタグの中に別のメソッドを作成することは不可能です。
また、私は勤めている会社で自家製のテンプレートエンジンを使っているので、ツールキット固有の解決策は私には役に立ちません。
JavaScriptでは、単一引用符を「\ x27」としてエンコードし、二重引用符を「\ x22」としてエンコードできます。 したがって、この方法では、JavaScript文字列リテラルの(ダブルまたはシングル)引用符の内側に入ったら、文字列の「ブレイクアウト」の埋め込まれた引用符を恐れることなく、免責のある\ x27 \ x22を使用できます。
\ xXXは文字用です< 127、Unicodeの\ uXXXXなので、この知識で武装して、通常のホワイトリスト以外のすべての文字に対して堅 ⁇ な JSEncode 関数を作成できます。
例えば、。
<a href="#" onclick="SelectSurveyItem('<% JSEncode(itemid) %>', '<% JSEncode(itemname) %>'); return false;">Select</a>
サーバー側の言語によっては、次のいずれかを使用できます。
.NET 4.0。
string result = System.Web.HttpUtility.JavaScriptStringEncode("jsString")
Java。
import org.apache.commons.lang.StringEscapeUtils;
...
String result = StringEscapeUtils.escapeJavaScript(jsString);
Python。
import json
result = json.dumps(jsString)
PHP。
$result = strtr($jsString, array('\\' => '\\\\', "'" => "\\'", '"' => '\\"',
"\r" => '\\r', "\n" => '\\n' ));
RailsのRuby。
<%= escape_javascript(jsString) %>
HTMLで文字列リテラルの使用を避け、JavaScriptを使用してJavaScriptイベントをバインドしてください。
また、自分が何をしているのかを本当に知らない限り、「href =#」は避けてください。 強迫的なミドルクリッカー(タブオープナー)の使いやすさを大幅に低下させます。
<a id="tehbutton" href="somewhereToGoWithoutWorkingJavascript.com">Select</a>
私が選んだJavaScriptライブラリは、たまたまjQueryです。
<script type="text/javascript">//<!-- <![CDATA[
jQuery(function($){
$("#tehbutton").click(function(){
SelectSurveyItem('<%itemid%>', '<%itemname%>');
return false;
});
});
//]]>--></script>
そのようなリンクのリストをレンダリングしている場合は、これを行うことができます。
<a id="link_1" href="foo">Bar</a>
<a id="link_2" href="foo2">Baz</a>
<script type="text/javascript">
jQuery(function($){
var l = [[1,'Bar'],[2,'Baz']];
$(l).each(function(k,v){
$("#link_" + v[0] ).click(function(){
SelectSurveyItem(v[0],v[1]);
return false;
});
});
});
</script>
HTML属性に入れる場合は、HTMLエンコード(最低限)する必要があります。また、シングルクォートを(バックスラッシュで)エスケープして、javascriptのクォートに干渉しないようにする必要があります。
これを行う最良の方法は、テンプレートシステム(必要なら拡張する)を使用することですが、単純に2つのエスケープ/エンコード関数を作成し、その両方をそこに入るすべてのデータにラップすることができます。
そして、HTML属性の内容全体をHTMLエスケープすることは、たとえそれがjavascriptを含んでいたとしても、完全に有効(正しい、でさえある)です。
別の興味深い解決策は、これを行うことです。
<a href="#" itemid="<%itemid%>" itemname="<%itemname%>" onclick="SelectSurveyItem(this.itemid, this.itemname); return false;">Select</a>
次に、JavaScriptの引用の余分な複雑さを気にすることなく、両方の変数に標準のHTMLエンコーディングを使用できます。
はい、これは厳密に無効なHTMLを作成します。 ただし、これは有効な手法であり、最新のブラウザはすべてサポートしています。
それが私の場合は、おそらく最初の提案に従って、値がHTMLエンコードされていることを確認し、*単一引用符をエスケープします。
私もこの問題に直面しています。 HTMLを壊さないエスケープされた二重引用符に単一引用符を変換するスクリプトを作成しました。
function noQuote(text)
{
var newtext = "";
for (var i = 0; i < text.length; i++) {
if (text[i] == "'") {
newtext += "\"";
}
else {
newtext += text[i];
}
}
return newtext;
}
JavaScriptのエンコードを含むMicrosoft Anti-XSSライブラリをご利用ください。
まず、オンクリックハンドラーがこのように設定されている場合は、より簡単になります。
<a id="someLinkId"href="#">Select</a>
<script type="text/javascript">
document.getElementById("someLinkId").onClick =
function() {
SelectSurveyItem('<%itemid%>', '<%itemname%>'); return false;
};
</script>
次に、JavaScriptでitemidとitemnameをエスケープする必要があります(つまり、「」が「\」になるなど)。)。
サーバー側でJavaを使用している場合は、ジャカルタの共通ラングのクラスStringEscapeUtilsをご覧ください。 それ以外の場合は、独自の「escapeJavascript」メソッドを書き込むのに時間がかかりすぎないようにしてください。
私も同じ問題に直面し、トリッキーな方法で解決しました。 まず、グローバル変数v1、v2、v3を作成します。 そして、オンクリックで、インジケーター1、2、または3を送信し、関数チェックで1、2、3をv1、v2、およびv3を次のように配置します。
onclick="myfun(1)"
onclick="myfun(2)"
onclick="myfun(3)"
function myfun(var)
{
if (var ==1)
alert(v1);
if (var ==2)
alert(v2);
if (var ==3)
alert(v3);
}