使用forgotpassword参数在angularjs中回调url

时间:2015-12-30 03:21:40

标签: asp.net angularjs url asp.net-web-api angularjs-routing

试图在互联网上寻找解决方案,但现在没有运气了几天。我正在尝试使用web api实现忘记密码功能,但在将重置电子邮件链接发送给用户后,我仍然遇到了回调。

目前在我的控制器中我有

var callbackUrl = new Uri(Url.Link("ResetPasswordRoute", new { userId = cUser.Id, code = code }));

此回调会发送到用户的电子邮件中。我希望用户点击此链接并为他打开一个重置页面,该页面也会传递用户ID和代码。所以输入新密码的视图。一旦他们提交,我希望它进入下面显示的httpGet resetPassword方法,下面显示了代码,用户ID和新通道。

 [HttpGet]
    [Route("ResetPassword", Name = "ResetPassword")]
    public async Task<IHttpActionResult> ResetPassword(string userId = "", string code = "")
    {
        if (string.IsNullOrWhiteSpace(userId) ||        string.IsNullOrWhiteSpace(code))
        {
            ModelState.AddModelError("", "User Id and Code are required");
            return BadRequest(ModelState);
        }
        IdentityResult result = await _repo.ResetPasswordRoute(userId,code);

        if (result.Succeeded)
        {
            return Ok();
        }
        else
        {
            return GetErrorResult(result);
        }
    }

所以问题是我在设置ResetPasswordRoute以便在点击链接时在webapi中推送视图时感到很困惑。以及angularjs如何捕获参数,因为url是一个阴影网址,因为它需要另一个路由页面。

我创建了一条路线:

}).when("/pages/reset", {
            templateUrl: "app/views/pages/reset-password.html"

我意识到我无法真正使用$ routeparameters。我已经阅读了大部分指南,但都是针对MVC的,它们返回基于字符串代码的View()!= null而webapi不使用View()。任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:1)

我不熟悉asp.net,但对Angular和REST API非常熟悉。希望这有助于......

在您的Angular应用中,您有一个用户重置密码的链接。这应该使用$http来调用您的网络API,它会生成某种令牌并通过电子邮件发送给用户。

应该由API来生成URL,其中包括带有userId和重置令牌的路由或查询参数。类似的东西:

https://example.com/reset-password/123456/ABCDEF

-OR -

https://example.com/reset-password?userId=123456&token=ABCDEF

你的Angular应用程序应该有这样的路线。假设您正在使用ngRoute,您的路由配置将如下所示:

.when('/reset-password', {
  controller: 'ResetPasswordController',
  controllerAs: 'reset',
  templateUrl: 'path/to/template.html'
})

此路线的控制器应如下所示:

function ResetPasswordController($http, $routeParams) {
  var reset = this;
  var userId = $routeParams.userId;
  var token = $routeParams.token;

  reset.submit = function(newPassword) {
    var data = {...};
    var config = {...};
    $http.post('https://api.example.com/reset-password', data, config)
      .then(function onSuccess(res) {...}, function onError(err) {...});
  };
}

当提交密码表单时,重置页面的模板会调用reset.submit()

此时,您拥有userId,重置令牌和新密码。您需要决定是在auth标头,请求正文还是两者的某种组合中传递此信息。您还应该使用$http配置中的withCredentials选项。

此Web API端点需要验证令牌和userId,如果有效则重置用户密码。

如果API以200的状态代码响应,您可以将用户重定向到登录页面。否则,处理错误。

这会回答你的问题吗?