Question
I'm trying to parse for the access_token from Foursquare where the URL is like this:
https://mywebsite.com/4sqredirect/#access_token=1234567890XXXXX
I've tried $routeParams and $location and get nothing returned. Only after I tried $route, I did get an object back with the following attribute in it:
https://stackoverflow.com/questions/20878335
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russiancurrent: {
params: { }
pathParams: { }
loadedTemplateUrl: partials/4sqredirect
locals: { }
scope: {
this: {
$ref: $["current"]["scope"]
}
route: {
$ref: $
}
location: { }
token: null
}
}
Does this mean there's no way to get it using native AngularJS functions cause of the hash?
UPDATE:
my controller looks like as follows:
angular.module('myApp')
.controller('4sqredirectCtrl', function ($scope, $route, $location, $routeParams) {
$scope.route = $route;
$scope.location = $location;
$scope.token = $routeParams.access_token;
});
my main js looks like as follows:
angular.module('myApp', [
'ngCookies',
'ngResource',
'ngSanitize',
'ngRoute'
])
.config(function ($routeProvider, $locationProvider) {
$locationProvider.html5Mode(true);
$routeProvider
.when('/', {
templateUrl: 'partials/main',
controller: 'MainCtrl'
})
.when('/4sqredirect/', {
templateUrl: 'partials/4sqredirect',
controller: '4sqredirectCtrl'
})
.otherwise({
redirectTo: '/'
});
});
Solution
From angular location service $location.hash() method return #after-hash
so if your url is look like
https://mywebsite.com/4sqredirect/#access_token=1234567890XXXXX
then
$location.hash() return access_token=1234567890XXXXX
you need to split it split('=')[1]
see this plunker when you click 4Square then $location.url() return
/4sqredirect/#access_token=123456
$location.hash().split('=')[1]
return 123456
OTHER TIPS
Use $location.search()
//e.g. url https://www.example.com/#!?name=123
var s = $location.search();
// {name: '123'}
http://docs.angularjs.org/api/ng.$location
Search:
Returns search part (as object) of current url when called without any parameter.
I'm not aware of a "native angular" way to do it, but you do have access to the hash via location.hash as a string type. it's probably not ideal, but it's workable.
There is in fact no direct support from Angular JS to do this. I wouldn't use ngRoute, because it already might expect the # at a different place. A simple solution to your problem is to use the location.hash and the substring() function:
<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="http://code.angularjs.org/1.2.6/angular.js"></script>
<link href="style.css" rel="stylesheet" />
<script>
angular.module('app', [])
.controller('AppCtrl', ['$scope', '$window', function($scope, $window) {
$scope.accessToken = $window.location.hash.substring(14);
}]);
</script>
</head>
<body ng-controller="AppCtrl">
<h1>Access Token</h1>
<p>{{accessToken}}</p>
</body>
</html>
