URI that UnfortunatelyHasBrackets[]=thisalsohas:acolon in JS

kungpung · 03-13-2013, 07:02 PM

My HTML page loads with a sent visitor. The request looks like this:

http://mydomain.com/index.html?success_url[]=http://www.google.com

(sometimes browsers seem to request this instead

http://mydomain.com/index.html?success_url[]=http%3A%2F%2Fwww.google.com

And I need to do some differing Javascript stuff depending on what URL is passed as an URI string. I got it working in my own installation of IE, Chrome & Firefox, but when I pushed it live it apparently did not work for a lot of people. I have not been able to replicate any problems but I know it didn't work for one person running Chrome on a Mac.

Here is the code I was running:

Code:

<script language="JavaScript">
var qsParm = new Array();
function qs() {
var query = window.location.search.substring(1);
query = query.replace('[]', '');
var parms = query.split('&');
for (var i=0; i<parms.length; i++) {
var pos = parms[i].indexOf('=');
if (pos > 0) {
var key = parms[i].substring(0,pos);
var val = parms[i].substring(pos+1);
qsParm[key] = val;
}
}
}
qsParm['success_url'] = null;
qs();

var suxess;

suxess = qsParm['success_url'];
suxess = decodeURIComponent(suxess);

switch(suxess)
{
case 'http://google.com':   
sitename = 'Google';
break;
case 'http://facebook.com': 
sitename = 'Facebook';
break;
}
</script>

I'm not sure how to proceed with this. My google powers failed to yield anything beyond producing the code above. I can't find anything specific regarding brackets in URI string names, and colons, slashes in URIs.. And I've learned everything backwards so I don't know what I should read up on.

Can anyone see any reason as to why this would fail for anyone?

PS. I have no influence over the URI content.

PPS. Is it possible it fails because the brackets gets encoded for some and is therefore not removed in line 5 of the posted code?

Old Pedant · 03-13-2013, 09:05 PM

Well, seeing brackets in a URL like that is common: PHP requires those if the <form> field in question can have multiple values, as is the case with checkboxes. That is, a PHP <form> might look like this:

Code:

<form action="whatever.php" method="get">
<input type="checkbox" name="food[]" value="apple" />
<input type="checkbox" name="food[]" value="banana" />
<input type="checkbox" name="food[]" value="canteloupe" />
...
</form>

So clearly browsers need to be able to handle field names with brackets.

(Usually, PHP forms would be method="post", but there is certainly no requirement that they be.)

My question to you: Why do you try to remove the []? Are you saying that sometimes they are *NOT* present?

rnd me · 03-13-2013, 09:30 PM

i recommend a true parser:

Code:

function parseQS(str){
  var ob={}, float="", key="", dc=decodeURIComponent;

for( var i=0, mx=str.length; i<mx;i++){
  var it=str[i];
    if(it==="="){ key=float; float=""; continue;}
    if(!it.search(/^[?&]/)){ 
        if(it==="&" && str.slice(i+1,i+5)==="amp;"){ i=(i+4);float+="&"; continue;}
        if(key){ob[key]=dc(float);} key=""; float="";  continue;
    }
    float+=it;
}
ob[key]=dc(float);
return ob;
}

var u="http://mydomain.com/index.html?success_url[]=http://www.google.com"
var ob=parseQS( u.split("[]").join("") );

alert(ob.success_url);

which shows the same for http://mydomain.com/index.html?success_url[]=http://www.google.com as for http://mydomain.com/index.html?success_url[]=http%3A%2F%2Fwww.google.com

Old Pedant · 03-13-2013, 09:59 PM

This version has the advantage that it leaves the key value alone. I still don't see why you want to convert success_url[] to success_url. It also handles multiple occurrences of the key value, whether PHP style (with the brackets) or JSP/ASP/ASP.NET style (without brackets).

Code:

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
* { font-size: x-large; }
span { color: red; font-weight: bold; }
</style>
</head>
<body>
<div>
<a href="junk2.html?success_url[]=http%3A%2F%2Fwww.google.com">test 1</a><br/>
<a href="junk2.html?success_url[]=http://www.google.com">test 2</a><br/>
<a href="junk2.html?success_url[]=http://www.google.com&other=fun%20stuff">test 3</a><br/>
<a href="junk2.html?success_url[]=http://www.google.com&other=fun%20stuff&other=and%20more">test 4</a><br/>
<a href="junk2.html?success_url[]=http://www.google.com&success_url[]=http://www.yahoo.com">test 5</a><br/>
<hr/>
success_url[] is <span id="found"></span><br/>
other is <span id="other"></span><br/>
</div>

<script type="text/javascript">
(
  function( )
  {
      var qs = [];
      if ( location.search.length > 1 )
      {
          var pairs = location.search.substring(1).split("&");
          for ( var p = 0; p < pairs.length; ++p )
          {
              var pair = pairs[p].split("=");
              var name = pair[0];
              if ( qs[name] == null ) { qs[name] = []; }
              qs[name].push( decodeURIComponent(pair[1]) );
          }
      }
      document.getElementById("found").innerHTML = qs["success_url[]"];
      document.getElementById("other").innerHTML = qs["other"];
  }
)();
</script>
</body>
</html>

Yes, it always returns an array, just in case the name is multiply-defined. But if you convert the one-element array to a string, then you get just the one value.

kungpung · 03-14-2013, 03:39 AM

Thanks for your answers OP and rnd me!

Quote:

Originally Posted by Old Pedant

Well, seeing brackets in a URL like that is common: (..) So clearly browsers need to be able to handle field names with brackets. (..)

My question to you: Why do you try to remove the []? Are you saying that sometimes they are *NOT* present?

Good lesson. The reason I am removing them is because this didn't work for me:

Code:

qsParm['success_url[]'] = null;

but this did

Code:

qsParm['success_url'] = null;

not sure why this would occur, I might have made a mistake here, looking at the code you wrote above it looks like you wrote something similar so I guess I mistook something.

And also, I noticed that on Mac, the brackets become %-encoded, so earlier today I added another row to the code and pushed to production, but still no improvement:

Code:

query = query.replace('[]', '');
query = query.replace('%5B%5D', '');

I hoped that that was the problem, but it still didn't work.

Quote:

Originally Posted by rnd me

i recommend a true parser
which shows the same for http://mydomain.com/index.html?success_url[]=http://www.google.com as for http://mydomain.com/index.html?success_url[]=http%3A%2F%2Fwww.google.com

Quote:

Originally Posted by Old Pedant

This version has the advantage that it leaves the key value alone. I still don't see why you want to convert success_url[] to success_url. It also handles multiple occurrences of the key value, whether PHP style (with the brackets) or JSP/ASP/ASP.NET style (without brackets).
Yes, it always returns an array, just in case the name is multiply-defined. But if you convert the one-element array to a string, then you get just the one value.

Thank you so much for the code suggestions you have written, I will try these with some visitors and see if they remedy my problem. If it does not I must be missing something elsewhere.