Appending newlines characters (i.e. \r\n) to a form field sent in a post request

Question

I'm writing some web forms which test servers written by students as an exercise. Some of the servers don't quite work to specification, as expected with class work. It would be useful to append a Windows new line character (i.e. \r\n) to a POST request generated by a browser, as some servers are doing a ReadLine rather than using the Content-Length: header count.

I'm looking at generating the following request (from IE):

POST /Brian HTTP/1.1
Accept: text/html, application/xhtml+xml, */*
Accept-Language: en-GB
User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; rv:11.0) like Gecko
Content-Type: application/x-www-form-urlencoded
Accept-Encoding: gzip, deflate
Host: localhost:43
Content-Length: 8
DNT: 1
Connection: Keep-Alive
Cache-Control: no-cache

location

but appending a \r\n to the end. My attempt at doing this so far is:

<form> 
Username: <input type="text" name="url" id="url4"
    onChange="document.getElementById('update4').setAttribute('action', 
    'http://localhost:43/' + document.getElementById('url4').value);"> </input> 
</form>
<form id="update4" method="post" action="http://localhost:43/">
Location: <input type="text" name="isindex" id="location5" 
 onChange="document.getElementById('location5').value = 
             document.getElementById('location5').value + '\\\r\\\n'"> </input>
<input id="mysubmit3" type="submit" value="go" ></input>
</form>

I know that appending newlines to things can be tricky, so I'm looking for guidance. I don't want the newline characters encoded as part of the POST. I just want to send a raw \r\n after the POST command to flush the post through.

why are you escaping `\ ` in your string concat? Shouldn't `+ '\r\n'` work? — Jared Hooper, Jun 23 '16 at 13:41
Do not believe `` element has a `textarea` `type`? `d` should be lowercase at `document.getElementByID('location5')` — guest271314, Jun 23 '16 at 13:41
@JDHooper I saw in another SO answer (which I can't locate now) that some browsers strip the `\` and extra escapes are needed; but it fails either way! — Brian Tompsett - 汤莱恩, Jun 23 '16 at 15:18
@guest271314 Thanks. Those were typos that I missed. Fixing them does not make it functional — Brian Tompsett - 汤莱恩, Jun 23 '16 at 15:19
Updated question to clarify it a bit and correcting the typos made in error. — Brian Tompsett - 汤莱恩, Jun 23 '16 at 15:28
Hello good sir, I was wondering if you could accept the top voted answer. It will helpful to those that stumble on this post and are looking for answer to have more confidence in the answer. Thank you :D — user1984, Dec 09 '21 at 09:31
@BrianTompsett-汤莱恩 If none of the answers here satisfy you, could you please [edit] your question to clarify what exactly you are looking for in an answer? — tripleee, Jan 19 '23 at 08:48

Sᴀᴍ Onᴇᴌᴀ · Answer 1 · 2023-08-24T23:21:58.630

Text input elements only allow single lines of text. Per the W3C Working Draft for text input:

input type=text – text-input field

type = "text"
Specifies that its input element is a one-line plain-text edit control for the input element’s value.

...

value = string without line breaks
Specifies a value for this input element.
value: Any string that contains no line feed (U+000A, “LF”) or carriage return (U+000D, “CR”) characters.

¹

And per the MDN documentation for <input> where attribute type = 'text':

| Type | Description | | -------- | --------------------------- | | text | The default value. A single-line text field. Line-breaks are automatically removed from the input value.| ²

So adding new line characters to the value of the text input element is basically superfluous.

Alternative solutions might include:

adding a hidden text area and set the value of the text area to contain the value of the text field with the new line character, though it may be difficult to prevent students from un-hiding the textarea and altering the value. See this demonstrated in this phpfiddle.
use FormData to store the values of the form, add the new line characters and then submit the form using the formdata with that altered value. This may only work by having the form be submitted asynchronously (e.g. with AJAX, to a different target like an iframe, other window, etc.).

New lines can be added via JavaScript with a couple different techniques, including:

new line characters: \n:

console.log("Bob\nis\ncool");

template literals (refer to this answer)

console.log(`Bob 
is 
cool.`);

String.fromCharCode()

console.log('line 1'+String.fromCharCode(10, 13)+'line 2')

¹_{https://www.w3.org/TR/2012/WD-html-markup-20120315/input.text.html#input.text}

²_{https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input}

score 4 · Answer 2 · answered Jun 23 '16 at 13:42

4

have you tried using an actual textarea and not type textarea?

also getElementByID is incorrect (the D isn't capitalized) and I fixed your escaping.

instead of:

<input type="textarea" name="isindex" id="location5" 
 onChange="document.getElementByID('location5').value = 
             document.getElementById('location5').value + '\\\r\\\n'"> </input>

try this

<form> 
 Username: <input type="text" name="url" id="url4"
    onChange="document.getElementById('update4').setAttribute('action', 
    'http://localhost:43/' + document.getElementById('url4').value);"> </input> 
</form>
<form id="update4" method="post" action="http://localhost:43/">
Location: <textarea name="isindex" id="location5" 
 onChange="document.getElementById('location5').value = 
             document.getElementById('location5').value + '\r\n'"> </textarea>
<input id="mysubmit3" type="submit" value="go" ></input>
</form>

answered Jun 23 '16 at 13:42

imvain2

15,480
1
16
21

Close, but not quite. I get: `isindex=location%0D%0A%0D%0A%0D%0A` – Brian Tompsett - 汤莱恩 Jun 23 '16 at 15:22
are you using `input text` or an actual `textarea`? I wasn't aware that `input text` allowed new lines, but an actual `textarea` tag does. – imvain2 Jun 23 '16 at 15:33
I was using a `input text`. I am aware that `textarea` permits newlines, but it encodes them as part of the post. I want them to be unencoded; a real `\r` and not `%0D` and a real `\n` and not `%0A`. This is to overcome poor implementation of the servers I am testing; thus I have to break the HTTP spec... – Brian Tompsett - 汤莱恩 Jun 23 '16 at 15:49
have you tried a server side post like using php for example? – imvain2 Jun 23 '16 at 16:42
I mean have you tried running a script that sends posts instead of sending client side. – imvain2 Jun 23 '16 at 16:45

Appending newlines characters (i.e. \r\n) to a form field sent in a post request

2 Answers2

input type=text – text-input field