AJAX POST and Plus Sign ( + ) -- How to Encode?

Question

I'm POSTing the contents of a form field via AJAX to a PHP script and using JavaScript to `escape(field_contents)`. The problem is that any plus signs are being stripped out and replaced by spaces. How can I safely 'encode' the plus sign and then appropriately 'decode' it on the PHP side?

Accepted Answer

Use `encodeURIComponent()` in JS and in PHP you should receive the correct values.

Note: When you access `$_GET`, `$_POST` or `$_REQUEST` in PHP, you are retrieving values that have already been decoded.

Example:

In your JS:

```
// url encode your string
var string = encodeURIComponent('+'); // "%2B"
// send it to your server
window.location = 'http://example.com/?string='+string; // http://example.com/?string=%2B
```

On your server:

```
echo $_GET['string']; // "+"
```

It is only the raw HTTP request that contains the url encoded data.

For a GET request you can retrieve this from the `URI. $_SERVER['REQUEST_URI']` or `$_SERVER['QUERY_STRING']`. For a urlencoded POST, `file_get_contents('php://stdin')`

NB:

`decode()` only works for single byte encoded characters. It will not work for the full UTF-8 range.

eg:

```
text = "\u0100"; // Ā
// incorrect
escape(text); // %u0100 
// correct
encodeURIComponent(text); // "%C4%80"
```

Note: `"%C4%80"` is equivalent to: `escape('\xc4\x80')`

Which is the byte sequence (`\xc4\x80`) that represents `Ā` in UTF-8. So if you use `encodeURIComponent()` your server side must know that it is receiving UTF-8. Otherwise PHP will mangle the encoding.

AJAX POST and Plus Sign ( + ) -- How to Encode?

Solution

Problem