如何净化Ajax success响应通过Polaris XSS扫描修复Coverity告警

Coverity触发该告警是因为代码直接将接口返回的未处理字段拼接为HTML字符串，通过.html()插入DOM时存在XSS注入风险。
之前使用DOMPurify、DOMParser出现UI损坏，核心原因是直接对整段拼接后的HTML做净化时，要么默认规则过滤了selected这类合法属性，要么转义逻辑和multiselect插件的渲染规则冲突，这类重净化方案完全没必要用在简单下拉选项渲染场景。

以下两种方案都可以通过Coverity扫描，且完全不会破坏原有UI逻辑，按需选择即可。

方案1：轻量转义（无依赖，改动最小） #

仅对动态插入的接口字段做标准HTML实体转义，固定逻辑生成的标签、属性完全保留，不需要引入第三方库。

1. 先添加通用转义函数

   function escapeHtml(str) {
     if (typeof str !== 'string') return str;
     return str.replace(/[&<>"']/g, function(match) {
       const charMap = {
         '&': '&amp;',
         '<': '&lt;',
         '>': '&gt;',
         '"': '&quot;',
         "'": '&#39;'
       };
       return charMap[match];
     });
   }
   

2. 修改下拉拼接逻辑，所有接口返回的动态字段都用转义函数包裹

   function bindIsosDropDown(isoData) {
     var isoDropDownHtml = "";
     if (window.existingAssociatedIsos !== null && window.existingAssociatedIsos !== "") {
       var existingAssociatedIsosArr = window.existingAssociatedIsos.split(',').map(Number);
       $(isoData).each(function (index, iso) {
         const safeId = escapeHtml(iso.IsoId);
         const safeName = escapeHtml(iso.LegalName);
         const selected = $.inArray(iso.IsoId, existingAssociatedIsosArr) > -1 ? 'selected' : '';
         isoDropDownHtml += `<option value="${safeId}" ${selected}>${safeName}</option>`;
       });
     } else {
       $(isoData).each(function (index, iso) {
         const safeId = escapeHtml(iso.IsoId);
         const safeName = escapeHtml(iso.LegalName);
         isoDropDownHtml += `<option value="${safeId}">${safeName}</option>`;
       });
     }
     $("#ddlIsoList").html(isoDropDownHtml);
     $(".multiselect").multiselect({ noneSelectedText: 'Select ISO' });
     manageIsosAndRoles();
   }
   

注：原代码中属性值Selected改为标准小写selected，避免部分浏览器或插件无法识别选中状态。

方案2：DOM API渲染（零注入风险，最稳妥） #

完全放弃字符串拼接HTML的写法，直接通过jQuery的DOM方法创建节点，动态内容通过.val()、.text()、.prop()设置，jQuery会自动做内容编码，从根源上避免HTML注入，连额外转义函数都不需要写，渲染效果和原代码完全一致：

function bindIsosDropDown(isoData) {
  const $ddl = $("#ddlIsoList").empty();
  const hasExisting = window.existingAssociatedIsos !== null && window.existingAssociatedIsos !== "";
  const existingArr = hasExisting ? window.existingAssociatedIsos.split(',').map(Number) : [];

  $(isoData).each(function (index, iso) {
    const $opt = $('<option></option>').val(iso.IsoId).text(iso.LegalName);
    if (hasExisting && $.inArray(iso.IsoId, existingArr) > -1) {
      $opt.prop('selected', true);
    }
    $ddl.append($opt);
  });

  $(".multiselect").multiselect({ noneSelectedText: 'Select ISO' });
  manageIsosAndRoles();
}

内容的提问来源于stack exchange，提问作者TJG