Angular $http params encoding issue

Question

I have an Angular 1.4 service that makes an $http.get() request to the MapQuest API. If I pass my API key as part of the url directly then it works however if I add it as part of the params field then it does not.

Working:

var url = 'http://open.mapquestapi.com/geocoding/v1/address?key=Gmjtd%7Cluub2d08nh%2C2s%3Do5-2u2gh4';

$http.get(url);

// Key actually sent
Gmjtd%7Cluub2d08nh%2C2s%3Do5-2u2gh4

Not working:

var url = 'http://open.mapquestapi.com/geocoding/v1/address';

$http.get(url, { 
  params: { 
    key: 'Gmjtd%7Cluub2d08nh%2C2s%3Do5-2u2gh4'
  }
});

// Key actually sent
 Gmjtd%257Cluub2d08nh%252C2s%253Do5-su2gh4

Not working either:

var url = 'http://open.mapquestapi.com/geocoding/v1/address';

$http.get(url, { 
  params: { 
    key: encodeURIComponent('Gmjtd%7Cluub2d08nh%2C2s%3Do5-2u2gh4');
  }
});

// Key actually sent
Gmjtd%25257Cluub2d08nh%25252C2s%25253Do5-2u2gh4

It appears that passing the key in the params field causes it to undergo some kind of encoding process which renders it invalid.

How can I maintain the original key when using the params method?

Andy Gaskell · Accepted Answer · 2015-06-10 18:30:21Z

1

Angular does indeed encode params. You should call decodeURIComponent since the key is already encoded.

$http.get(url, { 
  params: { 
    key: decodeURIComponent('Gmjtd%7Cluub2d08nh%2C2s%3Do5-2u2gh4');
  }
});

answered Jun 10, 2015 at 18:30

Andy Gaskell

31.8k6 gold badges79 silver badges84 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular $http params encoding issue

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related