Slash encoding

[ashgibson]

I am still getting the problem when trying to pass dates.

ui-sref="jobs-list({quote_due_from:'18/12/2014',quote_due_to:'18/12/2014'})"

The following URL is generated:

http://{mydomain}/#/jobs?quote_due_from=18%252F12%252F2014&quote_due_to=18%252F12%252F2014

This is my state provider code:

module.config(function($stateProvider) {
    $stateProvider
        .state('jobs-list', {
            url: '/jobs?quote_due_from&quote_due_to&quote_followup_from&quote_followup_to&start_date_from&start_date_to&quote_status_id',
            controller: 'JobsListCtrl',
            templateUrl: 'jobs/jobs.list.html'
        });
});

I am using the latest version of ui.router

"name": "angular-ui-router",
"version": "0.2.13",

[kcjmowright]

I got around this issue by explicitly configuring the parameter types to 'any'. Behind the scenes, ui router wraps search parameters into ArrayTypes but will use the encode/decode callbacks for the wrapped type. By default, it treats query parameters as strings. And for some reason ( scratching my head, why you'd ever want to double encode the forward slash ) it will double encode forward slashes.

module.config(function($stateProvider) {
    $stateProvider
        .state('jobs-list', {
            url: '/jobs?{quote_due_from:any}&{quote_due_to:any}&{quote_followup_from:any}&{quote_followup_to:any}&{start_date_from:any}&{start_date_to:any}&quote_status_id',
            controller: 'JobsListCtrl',
            templateUrl: 'jobs/jobs.list.html'
        });
});

[tweinerpq]

Hi,
I'm still experiencing double encoding when the string I'm sending in is part of the URL, like so:
example.com/id

I'm sending in this:
<a ui-sref="search.doc({ id: 'CBVPPYMD10.1017/S003329171400227X' })" ...

and on click I'm seeing on my browser

url.com/editor/CBVPPYMD10.1017%252FS003329171400227X

I'm also seeing this same doubly encoded string as the href attribute generated by ui-router on Inspect Element.

My real doc id is CBVPPYMD10.1017/S003329171400227X

I just updated to @Version v0.2.15 and I have latest angular (1.4)

Thanks.

[tweinerpq]

Oh, I see that this is being addressed here?
#2071

Is this supposed to be fixed?

[christianliebel]

@tweinerpq #2071 won’t change the “double encoding” of the slash in the URL, however it will fix the decoding, so the encoded slash from the URL (%252F) is correctly decoded to the slash character (/) in the state params, as soon as the PR is merged.

[JakobJingleheimer]

+1

The problem comes from UrlMatcherFactory.js:360. The value is encoded on line 338, and then that encoded value is passed to encodeURIComponent on line 360:

/* 338 */ var encoded = param.type.encode(value);
// …
/* 360 */ encoded = map(encoded, encodeURIComponent).join('&' + name + '=');

[zgmnkv]

I have made some research on this.
Actual problem is in valToString function urlMatcherFactory.js:572

  function valToString(val) { return val != null ? val.toString().replace(/\//g, "%2F") : val; }
  function valFromString(val) { return val != null ? val.toString().replace(/%2F/g, "/") : val; }

  var $types = {}, enqueue = true, typeQueue = [], injector, defaultTypes = {
    string: {
      encode: valToString,
      decode: valFromString,

This behavior was introduced in 3045e41 and 0c983a0 fixing #1119
Seems that it fixes path params, but breaks search params
Maybe we should encode/decode path params and search params differently

[zivc]

Solution here: #1119 (comment)