Удалить Facebook OAuth хэш с Angular JS

Facebook любит добавлять #_=_ в конец URL-адреса обратного вызова OAuth, который мы ему даем. Хотя мы не используем навигацию на основе hash, она выглядит раздражающей, и я хотел бы избавиться от нее.

location.hash = ''; вызывает бесконечный цикл в $watch (это также происходит с $window.location.hash = '';). Angular способ $location.hash(''); ничего не меняет. $location.path(''); дает нам часть пути туда, в результате добавляя /#/ к нашему URL-адресу.

Я также играл с $locationProvider.html5Mode и не получал ничего, кроме ошибок. (Error: [$injector:unpr] Unknown provider: $locationProviderProvider <- $locationProvider), хотя это может быть моей собственной ошибкой.

Как я могу удалить хеш OAuth без ошибок?

Ответ 1

Как и для свойства поиска нужно начинать с?, свойство hash должно начинаться С#.

Вместо того, чтобы указывать location.hash равным пустой строке, установите ее в '#'.

location.hash = '#';

P.S.

Вы можете получить голоса из-за этого

Пока мы не используем навигацию на основе хэшей, она выглядит раздражающей, и я хотел бы избавиться от нее.

Несмотря на то, что у меня нет сомнений в этом, вопрос - это вопрос, независимо от причины, некоторые могут посчитать это пустой тратой времени, поскольку единственная воспринимаемая причина заключается в том, что вы находите это раздражающим.

Ответ 2

Я предполагаю, что вы говорите о https://www.facebook.com/dialog/oauth?client_id=...&redirect_uri=... OAuth call. В моем коде я предоставляю им URI с кодировкой URI с перекодировкой URI, который уже включает хэш, такой как myserver.com/myapp/#/login/facebook, поэтому их перенаправление будет обрабатываться в пределах маршрута AngularJS $routeProvider моего приложения. Как ни странно, Facebook присоединяется к '&' к пути после хэша, поэтому моя конфигурация $routeProvider выглядит как

myApp.config(['$routeProvider', function($routeProvider) {
  $routeProvider.
  when('/login/facebook', {
    templateUrl: 'dialogs/login/facebook.html',
    controller: 'LoginFacebookCtrl'
  }).
  when('/login/facebook&', { // Facebook seems to attach an & at the end
    templateUrl: 'dialogs/login/facebook.html',
    controller: 'LoginFacebookCtrl'
  })
  ...
}]);

Работает для меня.

Ответ 3

У меня нет опыта работы с FB, но мы делаем довольно много обработки URL-адресов, используя Angular http interceptors. Вы можете реализовать простую замену регулярных выражений на входящие данные таким образом (адаптированные из документов):

// register the interceptor as a service
$provide.factory('myHttpInterceptor', function($q, dependency1, dependency2) {
    return {
        'response': function(response) {
            // alter the response
            var loc = response.headers.location;
            response.headers.location = loc.replace(/#_=_$/,'');

            // pass along the altered response
            return response;
        }
    };
});
$httpProvider.interceptors.push('myHttpInterceptor');

Это относится к модулю .config вашего приложения Angular. Он будет работать прозрачно под всеми запросами через службу $http, поэтому вы можете захотеть выполнить дополнительную обработку, если вам нужно оставить только некоторые URL.

Ответ 4

Попробуйте добавить перенаправление, если оно вам подходит:

app.config(['$routeProvider', function ($routeProvider) {
  $routeProvider.when('/_=_', { redirectTo: '/' });
}]);

Ответ 5

Кажется, что Angular изменяет #_=_ на #/_=_, поэтому мы можем reset с $location.path('/').

Это приведет к /#/, который является обычным hashbang, который мы можем отключить, используя html5 mode.

myApp.config(['$locationProvider',
    function ($locationProvider) {
        $locationProvider.html5Mode(true);
    }]);

Вам нужно добавить тег <base href="/"> в разделе <head> в соответствии с его doc.