Javascript to replace ampersand before POST ing form

Question

I'm trying to pass a collection of book titles back to a form. Normally in the second step the data is sanitized, however I'm now getting a server error whenever any of the titles have an Ampersand in them in the first step.

<form id="addbsms" method="post" action="?action=addnewbooks&amp;submit=validate" >
   <Textarea name="newblist" rows="30" cols="68"></textarea>
   <button type="submit" name="Submit" onsubmit="validateForm()">Submit</button>
</form>

I've tried to make a JS to clean up before it submits, but my JS chops aren't great:

<script>
  function validateForm(){
    let x= document.forms["addnewform"]["newmlist"].value;
    return x.replace(/&/g,"and");
  }
</script>

And an example of the data that causes this issue:

Cozy cottage & cabin designs : 200+ cottages, cabins, A-frames, vacation homes, apartment garages, sheds & more / Creative Homeowner|Creative Homeowner|2019|9781580118415 (paperback)|NONFICTION|20210813|

The error Mod_security shows: [Wed Aug 18 12:39:01.559409 2021] [:error] [pid 3772:tid 4255957415680] [client -redacted-] [client -redacted-] ModSecurity: Warning. Pattern match "(?i)(?:;|\\{|\\||\\|\\||&|&&|\\n|\\r|`)\\s*[\\(,@\\'\"\\s](?:[\\w'\"\\./]+/|[\\\\'\"\\^]\\w[\\\\'\"\\^]:.\\\\|[\\^\\.\\w '\"/\\\\]\\\\)?[\"\\^](?:s[\"\\^]*(?:y[\"\\^]s[\"\\^](?:t[\"\\^]*e[\"\\^]m[\"\\^](?:p[\"\\^]*r[\"\\^]*o[\"\\^]*p[\"\\^]*e ..." at ARGS:newblist. [file "/dh/apache2/template/etc/mod_sec3_CRS/REQUEST-932-APPLICATION-ATTACK-RCE.conf"] [line "294"] [id "932115"] [msg "Remote Command Execution: Windows Command Injection"] [data "Matched Data: |\x0d\x0aType R : transformative resilience for thriving in a turbulent world / Ama Marston, Stephanie Marston|Marston, Ama|2018|9781610398060 (hardback)|NONFICTION|20210813|\x0d\x0aUltimate guide : plumbing / [principal author, Merle Henkenius ; contributing author, Steve Willson]|Henkenius, Merle|2021|9781580118613|NONFICTION|20210813|\x0d\x0aUltimate guide : plumbing / [principal author, Merle Henkenius ; contributing author, Steve Willson]|Henkenius, Merle|2021|9781580118613|NONFICTION|..."] [severity "CRITICAL"] [ver [hostname "-redacted-"] [uri "/pageinquestion.php"] [unique_id "YR1h1bWfXoy3zM7JSdfj8QAAAAE"], referer: -fullurl-

I would wholly recommend addressing the root issue rather than replacing the content the user provides - the latter *will* cause data quality issues and immense user confusion. — esqew, Aug 18 '21 at 20:37
The browser should be URL-encoding the form data already as part of the POST process. I think we need something closer to a MCVE to tell what's going wrong. (F12 in Google chrome, network tab should show you the POST request data.) — Dave S, Aug 18 '21 at 20:38
The URL you're `POST`ing to seems odd to me; why would you have to escape the ampersand in the URL to `&`? A simple ampersand on its own is the standard delimiter for URL parameters - escaping it will cause unnecessary issues in its own right. Besides, the `&` escape in a URL doesn't do very much at all considering it's an HTML-specific escape - [related SO thread](https://stackoverflow.com/questions/9084237/what-is-amp-used-for) — esqew, Aug 18 '21 at 20:40
Finally, if the issue you're seeing is a *server* error, you have to show some *server* code - otherwise, any advice we give you here could be entirely moot. Please update the code in your question to adhere to the concept of a [mre]. — esqew, Aug 18 '21 at 20:42
I don't actually have access to the Mod_security rules though I can add snippet from the server log if that would be helpful. — aslum, Aug 18 '21 at 20:43
@esqew I'm not sure I understand. I haven't configured mod_security, nor do I have the ability to. In the first step the form sends the user data to itself and then cleans it up. Normally. Changes to mod_security from my ISP is making it so any instances of Ampersand trip before I can even clean the data with PHP so I'm trying to do a "pre-clean" step with js. — aslum, Aug 18 '21 at 20:49
@aslum — Then complain to your ISP. mod_security takes an extremely paranoid approach to data filtering and it needs careful tuning for any given site. Slapping it on willy nilly is not a good idea. — Quentin, Aug 18 '21 at 21:00

score 1 · Answer 1 · answered Aug 18 '21 at 20:56

Barring that esqew is trying to discern the WHY(s) for you. Since in your last comment you explained you still want to "pre-clean" -- I decided to answer.

function validateForm(){
    let x=  document.getElementById("newblist").value;
    var cleaned = x.replace(/&/g," and ");
    console.log(cleaned);
    return cleaned;
}
validateForm();

<form id="addbsms" method="post" action="?action=addnewbooks&amp;submit=validate" >
    <Textarea name="newblist" id="newblist" rows="30" cols="68"> This & That</textarea>
    <button type="submit" name="Submit" onsubmit="validateForm()">Submit</button>
</form>

Javascript to replace ampersand before POST ing form

1 Answers1