在 AngularJS 中使用 $window 或 $location 重定向

Posted 2023-02-19

技术标签:

【中文标题】在 AngularJS 中使用 $window 或 $location 重定向【英文标题】：Using $window or $location to Redirect in AngularJS 【发布时间】：2014-09-07 18:26:34 【问题描述】：

我正在开发的应用程序包含各种状态（使用 ui-router），其中一些状态需要您登录，其他状态是公开可用的。

我创建了一个有效检查用户是否登录的方法，我目前遇到的问题实际上是在必要时重定向到我们的登录页面。需要注意的是，登录页面当前并未放置在 AngularJS 应用程序中。

app.run(function ($rootScope, $location, $window) 


    $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) 

        if (toState.data.loginReq && !$rootScope.me.loggedIn) 
            var landingUrl = $window.location.host + "/login";
            console.log(landingUrl);
            $window.open(landingUrl, "_self");
        
    );
);

console.log 正确显示了预期的 url。在那之后的那一行，我几乎尝试了从 $window.open 到 window.location.href 的所有内容，无论我尝试了什么，都不会发生重定向。

编辑（已解决）：

发现问题。

var landingUrl = $window.location.host + "/login";
$window.open(landingUrl, "_self");

变量landingUrl 被设置为'domain.com/login'，它不能与 $window.location.href （这是我尝试过的事情之一）。但是将代码更改为

var landingUrl = "http://" + $window.location.host + "/login";
$window.location.href = landingUrl;

现在可以了。

【问题讨论】：

应该补充一下，数据也有服务器端认证，所以上面不是唯一的认证，更多的是方便重定向到登录页面，而不是显示一个几乎是空的页面。你需要使用 $window.location=... 的原生 location 对象相反，您可以考虑将其全部设为 AngularJS，包括您的身份验证 - 请参阅此帖子 frederiknakstad.com/2013/01/21/… 计划最终将所有内容（包括登录）包含在 AngularJS 应用程序中，但由于我们目前正在过渡到 AngularJS，因此注册/登录屏幕似乎在这个阶段最不重要。 【参考方案1】：

我相信这样做的方法是$location.url('/RouteTo/Login');

为清晰而编辑

假设我的登录视图路径是/Login，我会说$location.url('/Login') 导航到该路径。

对于 Angular 应用程序之外的位置（即未定义路由），将使用普通的旧 javascript：

window.location = "http://www.my-domain.com/login"

【讨论】：

刚刚试过。不幸的是，这重定向到 www.domain.com/app/RouteTo/login 而不是 www.domain.com/login 对，这不是字面意思。我不知道您将什么定义为登录视图的路径。将任何可能的路由放在 $location.url() 方法的参数中。为了清楚起见，我已经编辑了答案。对了。这里的问题是 $location.url 仍然重定向到应用程序的子路径。所以使用 $location.url('/login') 重定向到 www.domain.com/app/login 而不是 www.domain.com/login 好吧，正如问题中所述，目前登录页面位于 AngularJS 应用程序之外。因此需要重定向到 www.domain.com/login 而不是应用程序内的路径。还值得一提的是，您可能应该使用$window 而不是window（来源：***.com/questions/28906180/…）【参考方案2】：

也许对你有帮助！ demo

AngularJs 代码示例

var app = angular.module('urlApp', []);
app.controller('urlCtrl', function ($scope, $log, $window) 
    $scope.ClickMeToRedirect = function () 
        var url = "http://" + $window.location.host + "/Account/Login";
        $log.log(url);
        $window.location.href = url;
    ;
);

html 代码示例

<div ng-app="urlApp">
    <div ng-controller="urlCtrl">
        Redirect to <a href="#" ng-click="ClickMeToRedirect()">Click Me!</a>
    </div>
</div>

【讨论】：

【参考方案3】：

似乎对于整页重新加载$window.location.href 是首选方式。