About URL as it is encoded and POST parameters

Navigation
2

The URL is always encoded, how is the encoding done, what does it encode, and what importance or need to encode a url?

I have a div, which is broken by lines and gets something printed like:

1

2

3

In HTML it gets:

1<br/>2<br/>3

Unfortunately, when I pass POST, it is not encoded to the point of receiving on the other side with line break, so I end up getting: 123 when passing POST.

How to pass a value from a DIV like I actually left it, with the line breaks in the case?

I've seen, that when the post respects the line break, it's coded getting something like this: mensagem=1%0A2%0A3 ..

    
asked by anonymous 26.03.2015 / 04:21

1 answer

3

When you submit a request, either GET or POST, the parameters are first encoded using the URL encoding (by default, if you explicitly want a encoding other than application/x-www-form-urlencoded , the encoding form is another). As far as I know, this is always done by the browser , and you do not need to do this manually (even trying to do it manually can leave you in a double coding situation).

What are encoded are all "non-reserved" characters. There is a set of characters called "reserved", which are: 

!   *   '   (   )   ;   :   @   &   =   +   $   ,   /   ?   #   [   ]

Another set called "non-reserved": 

letras ASCII maiúsculas e minúsculas
dígitos ASCII
-   _   .   ~

And the rest of the Unicode characters. Everything that is not on the "non-reserved" list is encoded.

I do not really understand the HTTP protocol, but it is easy to assume that the importance of coding is so that the data does not merge with the other protocol delimiters. For example, if you want to pass a&b as a value to the x field, you can not simply pass x=a&b , otherwise b would be interpreted as another field.

As for your specific problem, there are two steps here, both "right" but one that may be causing an unwanted result:

1) First of all the text of div is being used, not its HTML code. See the difference: 

var el = document.getElementById("teste");
var obj = {
  innerHTML: el.innerHTML,
  textContent: el.textContent,
  innerText: el.innerText // Não standard
};

document.querySelector("pre").innerHTML += JSON.stringify(obj, undefined, 4)
    .replace(/\</g, "&lt;");
<div id="teste">1<br/>2
   
 
  
      <br/>
  
  
  3
</div>
<hr/>
<pre></pre>

Please note:

  • innerHTML brought everything: tags and line breaks as they were in the source;
  • textContent removed tags, only brought text as it was in source ( 1 and 2 stayed together);
  • The innerText , in Firefox, did not bring anything ... In Chrome, I brought what's closest to what you see on the page: 1\n2 \n3 (where that space came from, I have no idea ...). And for what I read , other browsers have even more stubborn behaviors, so I do not I would trust this non-standard property ...

In the end, one way or another you'll have to deal with the content of your div before using it. I suggest using innerHTML (as it is the one that most preserves information) and removing / replacing what is left, so as to end with the text you really want to pass to the server.

2) Second, the data associated with the mensagem field is given the URL Encoding. In this case, 1%0A2%0A3 is the correct way to code 1\n2\n3 (since the ASCII code of \n is 0A in hexadecimal). If on your server you are not receiving this, the problem should be in the way it decodes the message, since the form of the browser send is correct.

    
26.03.2015 / 05:36
Retrieving jQuery instance within an iframe problems updating a table