Skip to main content
Ben Nadel at InVision In Real Life (IRL) 2019 (Phoenix, AZ) with: Rich Armstrong
Ben Nadel at InVision In Real Life (IRL) 2019 (Phoenix, AZ) with: Rich Armstrong

JavaScript Does Not Escape "+" And ColdFusion Does Not Like This One Bit

By
Published in , , Comments (8)

I have been working on a mini AJAX and ColdFusion powered Chat application so that I can help people debug their code in a real-time way. One bug that has popped up early on is that "+" symbols are getting lost. From what I narrowed down, the "+" is not even making it into the database. The error is on the way In, not the way Out.

After some debugging, I found this page on the Javascript Escape() method, which is what I use to build the URL for AJAX submission:

http://www.w3schools.com/jsref/jsref_escape.asp

It states that the Javascript Escape() method does NOT escape the "+" symbol. Ok, no problem, right? I mean the "+" isn't really a meaningful URL value as far as I know (URL uses the "&" to separate parameters). Wrong! The "+" symbol represents an encoded space " " in a URL. This is something that ought to be escaped by Javascript. I wonder why they made that decision.

Here is a demo. I created a simple page that took one URL parameter with a "+" symbol and then I dump out the URL structure. Here is the URL:

URL value with embedded + symbol

Here is the URL struct:

URL with embedded plus symbol removed in struct

As you can see, the "+" is getting stripped out of the URL message parameter. It looks like, coming from Javascript, I am going to have escape my "+" symbols manually. In order to do this, I am going to have to replace the "+" with its HEX equivalent, "%2B" after I have escaped the other values:

// Escape the URL parameters for this AJAX url request.
escape(
	objParams[ strKey ]

	// Escape the "+" manually.
	).replace(
		new RegExp( "\\+", "g" ),
		"%2B"
		)

Doing this and the "+" symbol work just fine. I am very curious as to why Javascript treats the "+" symbol as something special, not to be escaped (when it clearly has a very special URL representation that shouldn't be confused). Any thoughts?

Want to use code from this post? Check out the license.

Reader Comments

47 Comments

Ben, I read your blog regularly and found this on the web when searching for a chat client for a site that i'm working on. I like the idea and will read the post later when I get back. One thing I want to recommend is the form serializer from http://www.massimocorner.com. I have used some of Massimo's stuff in the past and his code is super clean and elegant, you may want to give that a look.

I tried to chat by clicking on the link and for some reason the cursor kept losing focus. I literally had one hand on the mouse and kept clicking back in and the other to type with.

Not sure if you knew about that little bug.

Look forward to talking to you soon!

1 Comments

Thanks heaps for this post, I nailed an issue with UTF8 characters in my web system development that had lingered for years.

Testiment to the value of blogging...

34 Comments

Ben,

Thanks for the post, finally got Google to give me the result I wanted.

How annoying this is and I came across this due to an email address.

I believe in love. I believe in compassion. I believe in human rights. I believe that we can afford to give more of these gifts to the world around us because it costs us nothing to be decent and kind and understanding. And, I want you to know that when you land on this site, you are accepted for who you are, no matter how you identify, what truths you live, or whatever kind of goofy shit makes you feel alive! Rock on with your bad self!
Ben Nadel