我正在使用OWASP ESAPI encodeForHTMLAttribute，但是符號顯示為它們的html實體編號而不是符號

Question

我只是在學習用於XSS預防的OWASP ESAPI，並且在我的應用程序中使用Javascipt版本

根據XSS預防備忘單中的規則2 ，在將不受信任的數據插入到屬性值（例如“寬度，名稱或值”）中之前，應先進行“屬性轉義”，而我目前正在對此進行研究。

但是，在將電子郵件地址作為聯系表單中輸入字段的值插入之前使用encodeForHTMLAttribute（）時，@符號將作為其對應的html實體＃＆x40;顯示。 如您在此屏幕快照中看到的：

我想念什么嗎？

我已確保將文檔的字符集設置為utf-8，如下所示：

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

我還在問題表單中添加了accept-charset =“ UTF-8”屬性。

HTML形式：

<form id="contact_form" name="contact_form" method="post" action="" accept-charset="UTF-8">
    <div class="form_divider">  
        <label for="contact_form_email"><span class="asterisk">*</span>E-mail</label>       
        <input id="contact_form_email" tabindex="1" name="contact_form_email" type="email" data-role="none" maxlength="254" placeholder="E-mail" required/>
    </div><!--/form_divider-->  

</form>

我的應用程序的數據流：

在我的應用程序中，執行了一個ajax請求以提交登錄詳細信息，並且在成功通過身份驗證之后，我從數據庫中檢索了它們的詳細信息，並以json格式發送回客戶端。 然后，將這些詳細信息插入適用的html中

Javascript：

     $.ajax({
            url: app_root_url + 'login_registration/user_processing.php',
            data: JSON.stringify(params), 
            type: "POST",
            dataType: "json",
            contentType: "application/json;charset=utf-8",
            success: function(data){
            //data will be the user details such as userID, display name, email
            var result = data;
            prepareAppAfterLogin(result);

            }           

    });//end ajax


function prepareAppAfterLogin(result){
    var userDetails = result.userDetails;
    generateUserProfilePage(userDetails);

}

function generateUserProfilePage(userDetails){
    var userID = userDetails.userID;
    var display_name = userDetails.display_name;
    var email_address = userDetails.email_address;

    var profile_image = userDetails.profile_image;
    $("#profile_pic").attr('src', profile_image);

    var safe_email_address_for_html = $ESAPI.encoder().encodeForHTML(email_address);
    $("#profile_email_address").html(safe_email_address_for_html);

    var safe_email_for_attribute = $ESAPI.encoder().encodeForHTMLAttribute(email_address);
    $("#hidden_input_for_email").val(safe_email_for_attribute);
    $("#contact_form_email").val(safe_email_for_attribute);

}

編輯：我剛剛找到了支持@Cheran Shunmugavel在他的注釋中所說的內容的文檔：規則2，在這里： https ://www.owasp.org/index.php/DOM_based_XSS_Prevention_Cheat_Sheet“重要的是要注意在設置HTML時屬性不會執行代碼，該值直接在HTML元素的對象屬性內設置，因此無需擔心注入。“ ...”使用的適當編碼僅是JavaScript編碼，以禁止攻擊者關閉刪除單引號和內聯代碼，或者轉義為HTML並打開新的腳本標簽。”

遵循此規則，我只是嘗試對Javascript的電子郵件地址進行編碼，而不是對html屬性進行編碼，如下所示：

function generateUserProfilePage(userDetails){
      var safe_email_address = $ESAPI.encoder().encodeForJavaScript(userDetails.email_address);
      $("#contact_form_email").val(safe_email_address);

}

但是，這樣做似乎也會導致顯示問題：

您可以確認我需要在此處進行JavaScript編碼嗎？ 謝謝

Answer 1

如果您正在使用jQuery val方法將數據插入文檔中，則不必使用encodeForHTML和encodeForHTMLAttribute函數。 我在官方文檔中找不到任何內容，但是對此StackOverflow問題有很好的解釋： jQuery的val（）和prop（）方法是否可以html-escape值？ 。 重要的一點是val在內部設置DOM value屬性，並且該屬性永遠不會嘗試將文本解釋為HTML標記，因此不必進行轉義。