XMLHttpRequest stalls on send() if I attempt to pass an encoded URL containing an ampersand

Question

I'm making an Ajax call that sends a URL to a PHP script. Oftentimes these URLs are complex and contain special characters. If I don't encode the URL before sending, the PHP script works, but the URL's values are interpreted as my values (which is expected).

If I do encode a URL that doesn't contain special characters, like 'http://google.com' for example, the XMLHttpRequest sends my parameters to my PHP script as expected and everything works fine.

The issue is when I encode a URL that does contain special characters, like 'http://google.com?this=that&that=this' -- send() doesn't ever reach my PHP script. It just hangs indefinitely. No errors or anything. I'm stumped.

Here's what I'm working with:

function getContent(content, sumbittedUrl){
  var postContent = encodeURIComponent(content);
  var postUrl = encodeURIComponent(submittedUrl);
  var postString = 'content=' + postContent + '&url_get=' + postUrl;

  var httpRequest;

  //create XMLHttpRequest
  .
  .
  .

  httpRequest.onreadystatechange = alertContents;
  httpRequest.open('POST', 'php/my_php_script.php', true);
  httpRequest.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
  httpRequest.send(postString);
}

I'm a JavaScript novice so it's possible (likely, even) that I overlooked something that someone with more experience would spot quickly. Any help would be appreciated. Thanks.

"It just hangs indefinitely." - How do you know that it hangs? Is it possible the request is just failing, but not hanging? — mbeckish, Jun 27 '13 at 20:47
How else am I supposed to format the values that I'd like to pass? I'm assuming it's hanging on send() since in other situations when requests have failed, I received errors in the console. In this situation, I can write console.log('before send() is called'); just above the send() method and the statement gets executed. If I place another console.log('whatever'); beneath send(), it doesn't get executed. — greg, Jun 27 '13 at 20:57
If your PHP script is expecting a GET request, then use GET and query string. If it is expecting POST, then use [POST](http://stackoverflow.com/q/4276226/21727). — mbeckish, Jun 27 '13 at 21:00
Whatever the issue is, it's happening before the PHP script is even called. Besides, I could be using $_REQUEST to retrieve the incoming values for all you know. That'd work for GET or POST. I don't see how my parameters are structured differently from the example you linked except that I'm trying to pass two values instead of one. — greg, Jun 27 '13 at 21:09
What gets passed in the `content` argument of your function? Can you give an example? — user1091949, Jun 27 '13 at 22:06
Sure. 'content' just determines which function to call when it gets to the PHP script. In all cases, it's just a simple string with no special characters that would make a difference I don't think (e.g. 'summary', 'server_details'). — greg, Jun 27 '13 at 22:37
@greg - I misread your question. I thought the query string was part of the URL to which you are POSTing. I didn't realize you were trying to encode a different URL with a query string and pass it as a POST parameter. — mbeckish, Jun 28 '13 at 13:00

greg · Answer 1 · 2013-06-29T01:30:42.097

0

I found a somewhat anti-climatic solution. I'm still unsure why encodeURIComponent() doesn't work as expected, but the less destructive encodeURI() is working fine. encodeURI() doesn't touch these characters: ; , / ? : @ & = + $ so the URL's form stays intact. Potentially dangerous characters (e.g. < >) are still encoded.

The downside is that since ampersands are among the characters that don't get encoded, it means more work server-side to sort out incoming values.

EDIT:

It turns out it was a server-side issue after all. I was retrieving the values fine the whole time. The issue was with a cURL request using the aforementioned values. Don't trust PHP errors/warnings (or lack of them).

edited Jun 29 '13 at 01:30

answered Jun 28 '13 at 17:15

greg

3
1
3

What about "console.log('whatever');" not executing? What caused that? – mbeckish Jul 01 '13 at 03:15
I'm really not sure. If PHP actually outputs an error, then the readyState and status of the XMLHttpRequest instance is updated. My PHP script was attempting to send XML-formatted data using cURL and failing (but without errors) and the status and readyState values never changed in JS. – greg Jul 02 '13 at 15:08

XMLHttpRequest stalls on send() if I attempt to pass an encoded URL containing an ampersand

1 Answers1