Javascript 表单清理答案

【问题标题】：Javascript Form SanitizationJavascript 表单清理
【发布时间】：2019-09-02 06:08:50
【问题描述】：

我想验证和清理输入，例如来自 GET 表单请求的“搜索”，但我缺少一些关于 Javascript 模式匹配的内容。

这是我目前正在处理的功能：

function jsValidationAndSanitization() {
  /**
      Validate and sanitize every input that comes from an HTML form.
      @return boolean
  **/

  var submittedInput = document.forms["form"]["search_input"].value;

  if (submittedInput == "") {
    alert("error: empty input");
    return false;
  }
  if (submittedInput != "") {
    // admitted chars ( white list )
    var wl_pattern = /[A-z][0-9]/;

    // loop for every chars in the submitted string
    for (char in submittedInput) {
      // if a bad char is present on the string return false
      var result = char.match(wl_pattern); // INVERT THE MATCH OF RE HERE                   alert(result);
      return false;
    }

    return true;
  }
}

<form action="" method="GET" id="form" onsubmit="return jsValidationAndSanitization()">
  <fieldset>
    <legend>Test box</legend>
    <label for="search" id="search_input">Search</label>
    <input type="text" id="search_input" name="search_input" />
    <input type="submit" id="submit" value="submit" />
  </fieldset>
</form>

所以我试图反转 Javascript 模式匹配的匹配项（只有字符和数字），但实际上我没有找到一个很好的方法来完成这个功能。

有什么建议吗？

【问题讨论】：

正则表达式可以同时检查多个字符，因此更好的正则表达式可以消除循环字符的需要。您的方法也可以，但是您需要对“结果”做一些事情。使用完美的正则表达式，整个函数将是 return someRegExp.test( submittedInput ); 我不知道“反转匹配”是什么意思，也不知道它如何帮助您解决这个问题。 JS之外的其他方法是使用输入类型编号而不是输入类型文本或使用输入的模式属性将正则表达式放在那里进行验证。
在服务器端 - 也进行相同的清理。
我想反转 input.match 的匹配（首先是错别字），只是承认的字符和数字，只是因为我想使用白名单方法，这个概念就是@Harry Chilinguerian下面说。

标签： javascript html sanitization

【解决方案1】：

您不必对可以匹配字符串的每个字符进行模式匹配，并且可以只返回 A-z 或 0-9 之外的任何字符的匹配项。正则表达式匹配方法如果找到匹配项，则返回一个对象，如果没有找到，则返回 null，因此在此将其转换为布尔值只需在前面加上一个！，这将反转它，如果您只想将其转换为布尔值然后前面加一个!!。

function jsValidationAndSanitization() {
  /**
      Validate and sanitize every input that comes from an HTML form.
      @return boolean
  **/

  var submittedInput = document.forms["form"]["search_input"].value;

  if (submittedInput == "") {
    console.log("error: empty input");
    return false;
  }
  if (submittedInput != "") {
    // non-admitted chars ( black list )
    var wl_pattern = /[^A-z0-9]+/;
    var result = submittedInput.match(wl_pattern);
    if (result) { console.log(result); }
    return !result;
  }
  return false; // Catch all to return false
}

【讨论】：