我正在使用OWASP ESAPI encodeForHTMLAttribute但是符号显示为其html实体编号而不是符号

Question

我刚刚了解了用于XSS预防的OWASP ESAPI，我在我的应用程序中使用了Javascipt version

根据XSS预防备忘单中的Rule #2，您应该在将不受信任的数据插入属性值（如“宽度，名称或值”）之前进行“属性转义”，此时我正在处理此问题。

但是，在将电子邮件地址作为联系人表单中输入字段的值插入之前使用encodeForHTMLAttribute（）时，@符号显示为相应的html实体＃＆amp; 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元素的object属性中设置，因此不需要注入。”......“使用适当的编码将只是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问题有一个很好的解释：Do jQuery's val() and prop() methods html-escape values?。重要的是，val在内部设置DOM value属性，并且该属性永远不会尝试将文本解释为HTML标记，因此不需要转义。