138

我的 AngularJS 应用程序需要有权访问用户的 LinkedIn 个人资料。为此，我需要将用户重定向到包含回调 redirect_uri 参数的 LinkedIn URL，该参数将告诉 LinkedIn 将用户重定向回我的 web 应用程序并在 URL 中包含“代码”查询参数。这是一个传统的 Oauth 2.0 流程。

除了 LinkedIn 将用户重定向回以下 URL 之外，一切都很好：

http://localhost:8080/?code=XXX&state=YYY#/users/123/providers/LinkedIn/social-sites

我想?code=XXX&state=YYY从 URL 中删除以使其干净。用户不需要查看我从 LinkedIn 重定向收到的查询参数。

我试过$location.absUrl($location.path() + $location.hash()).replace()了，但它将查询参数保留在 URL 中。

我也无法提取查询参数，例如“代码”，使用($location.search()).code. 好像有？上面 URL 中的 # 之前是在欺骗 Angular。

4

15 回答 15

154

我用

$location.search('key', null)

因为这不仅会删除我的密钥，还会将其从 URL 的可见性中删除。

于 2014-08-22T13:22:49.607 回答
108

我最终从 AngularJS 论坛得到了答案。有关详细信息，请参阅此线程

该链接指向一个 Google Groups 线程，该线程难以阅读并且没有提供明确的答案。要删除 URL 参数，请使用

$location.url($location.path());
于 2013-07-03T23:34:22.850 回答
77

要删除所有查询参数，请执行以下操作：

$location.search({});

要删除一个特定的查询参数，请执行以下操作：

$location.search('myQueryParam', null);
于 2016-01-13T06:32:38.787 回答
29

要清除项目，请将其删除并调用 $$compose

    if ($location.$$search.yourKey) {
        delete $location.$$search.yourKey;
        $location.$$compose();
    }

源自 angularjs 来源：https ://github.com/angular/angular.js/blob/c77b2bcca36cf199478b8fb651972a1f650f646b/src/ng/location.js#L419-L443

于 2014-01-31T04:55:14.413 回答
27

您可以使用以下方法删除特定查询参数：

delete $location.$$search.nameOfParameter;

或者，您可以通过将 search 设置为空对象来清除所有查询参数：

$location.$$search = {};
于 2013-10-06T20:24:56.320 回答
27

在撰写本文时，正如@Bosh 之前提到的那样，html5mode必须true能够设置$location.search()并将其反映回窗口的可视 URL。

有关更多信息，请参阅https://github.com/angular/angular.js/issues/1521。

但是如果 html5mode 是true，您可以使用以下命令轻松清除 URL 的查询字符串：

$location.search('');

或者

$location.search({});

这也将改变窗口的视觉 URL。

1.3.0-rc.1（用AngularJS 版本测试html5Mode(true)。）

于 2014-10-13T08:46:20.117 回答
12

html5mode需要在=时使其工作false？

所有其他答案仅在 Angularhtml5mode为true. 如果您在 之外工作html5mode，则$location仅指存在于您的哈希中的“假”位置——因此$location.search无法查看/编辑/修复实际页面的搜索参数。

这是一个解决方法，在角度加载之前插入到页面的 HTML 中：

<script>
  if (window.location.search.match("code=")){
    var newHash = "/after-auth" + window.location.search;
    if (window.history.replaceState){
      window.history.replaceState( {}, "", window.location.toString().replace(window.location.search, ""));
    }
    window.location.hash = newHash;
  }
</script>
于 2014-06-09T21:26:47.543 回答
5

只需使用

$location.url();

代替

$location.path();
于 2015-12-20T16:09:49.400 回答
4

如果您想移动到另一个 URL 并清除查询参数，只需使用：

$location.path('/my/path').search({});
于 2017-08-23T20:45:38.183 回答
1

如果您使用路由参数，只需清除 $routeParams

$routeParams= null;
于 2014-10-22T04:06:26.777 回答
1

将位置哈希设置为空怎么样

$location.hash(null);
于 2015-04-24T14:59:31.053 回答
0

如果您立即处理参数然后转到下一页，您可以在新位置的末尾打一个问号。

例如，如果你会做 $location.path('/nextPage');

你可以这样做： $location.path('/nextPage?');

于 2015-10-25T22:50:40.630 回答
0

我已经尝试了上述答案，但无法让它们工作。唯一对我有用的代码是$window.location.search = ''

于 2016-02-09T00:49:14.503 回答
0

我可以用这一行替换所有查询参数：$location.search({});
易于理解和清除它们的简单方法。

于 2016-06-28T08:39:29.833 回答
0

接受的答案对我有用，但我需要更深入地挖掘以解决后退按钮的问题。

我注意到的是，如果我使用 链接到一个页面<a ui-sref="page({x: 1})">，然后使用 删除查询字符串$location.search('x', null)，我的浏览器历史记录中没有额外的条目，所以后退按钮将我带回到我开始的地方。虽然我觉得这是错误的，因为我认为 Angular 不应该为我自动删除这个历史记录，但这实际上是我特定用例的期望行为。

问题是，如果我改为使用链接到页面<a href="/page/?x=1">，然后以相同的方式删除查询字符串，我的浏览器历史记录中确实有一个额外的条目，所以我必须点击两次后退按钮才能回到我开始的地方. 这是不一致的行为，但实际上这似乎更正确。

我可以通过使用轻松解决href链接问题$location.search('x', null).replace()，但是当您通过链接登陆页面时，这会破坏页面ui-sref，所以这不好。

经过大量的摆弄，这是我想出的解决方法：

在我的应用程序的run功能中，我添加了这个：

$rootScope.$on('$locationChangeSuccess', function () {
    $rootScope.locationPath = $location.path();
});

然后我使用此代码删除查询字符串参数：

$location.search('x', null);

if ($location.path() === $rootScope.locationPath) {
    $location.replace();
}
于 2016-11-11T13:28:45.040 回答