在 angularjs 中使用忘记密码的参数回调 url

Question

尝试在互联网上搜索以找到解决方案，但现在已经好几天没有运气了。我正在尝试通过网络 api 实现忘记密码功能，但在向用户发送重置电子邮件 link 后，我遇到了回调问题。

目前在我的控制器中我有

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

此回调将发送到用户的电子邮件。我希望用户单击此 link 并为他打开一个重置页面，该页面还传递用户 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);
        }
    }

所以问题是，当单击 link 时，我真的很困惑如何设置 ResetPasswordRoute 以在 webapi 中推送视图。以及 angularjs 将如何捕获参数，因为 url 是阴影线 url 并且它需要另一个路由页面。

我创建了一条路线：

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

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

Answer 1

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

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

应该由 API 来生成 URL，其中将包含带有 userId 和重置令牌的路由或查询参数。类似于：

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

-或-

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()。

此时，您已拥有用户 ID、重置令牌和新密码。您需要决定是在 auth header 中传递此信息，还是在请求 body 中传递此信息，或者两者的某种组合。您还应该在 $http 配置中使用 withCredentials 选项。

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

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

这是否回答了您的问题？

在 angularjs 中使用忘记密码的参数回调 url

Callback url in angularjs with parameters for forgotpassword

asp.net

url

asp.net-web-api

angularjs

angularjs-routing