angular-ui replace'?' with '#' on redirect from facebook oauth
You can add this resolve function to your state, which will replace a hash url with the query string url:
resolve: { 'urlFix': ['$location', function($location){ $location.url($location.url().replace("#","?")); }]}
- So a url of
/fbauth#access_token=123456&code=abcde&expires_in=99999999
would be redirected automatically - Becoming
/fbauth?access_token=123456&code=abcde&expires_in=99999999
$stateParams
would be populated correctly.- The value would be
{access_token: "123456", code: "abcde", expires_in: "99999999"}
$location.url()
doesn't update if the location matches already, so the state won't redirect when there is no#
present.
Full example code:
<!DOCTYPE html><html><head> <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.js"></script> <meta charset="utf-8"> <title>FBAUTH</title></head><body ng-app="app"> <base href="/"> <div ui-view></div> <script> angular.module('app', ['ui.router']) .controller('publicCtrl', ['$scope','$stateParams', function($scope, $stateParams) { // $stateParams should be correctly set (even for hash route) console.log($stateParams); }]) .config(['$locationProvider','$stateProvider', function($locationProvider, $stateProvider){ $stateProvider .state("fbauth", { url: '/fbauth?access_token&code&expires_in', templateUrl: 'fbauth.html', controller: 'publicCtrl', resolve: { 'urlFix': ['$location', function($location){ $location.url($location.url().replace("#","?")); }] } }); $locationProvider.html5Mode(true); }]); </script></body></html>
I would not prefer passing query parameters(using ? mark) in client side routing. Instead you can use route/state params as follows:
http://localhost/#/fbauth/access_token/:access_token/code/:code
and you can access these values using $stateParams
. e.g. ($stateParams.access_token
)