如何使用UI路由器在angularjs中实现密码重置 [英] How to implement password reset in angularjs with UI router

问题描述

在我的AngularJS应用程序中，我具有登录，注册和忘记密码功能，这些功能使用JWT并使用UI路由器实现状态.

In my AngularJS application, I have login, registration and forgot password functionality implemented using JWT and using UI Router for states.

当用户单击忘记密码"时，将向用户发送一封电子邮件，其中包含用于重置密码的链接.我们如何在AngularJS应用程序中将此链接映射到特定状态(密码重置)?

When a user clicks forgot password, an email will be sent to the user with the link to reset the password. How do we map this link to a particular state (password reset) in our AngularJS application?

密码重置链接的格式为 http://myapp.com/reset/token.我还需要检索该令牌.

The password reset link will be in the format of http://myapp.com/reset/token. I will need to retrieve that token also.

谢谢.

推荐答案

您可以在 https:中找到干净的实现://github.com/meanjs/mean/(在此回购模块/users/client/config/users.client.routes.js中)

You can find a clean implementation in https://github.com/meanjs/mean/ (in this repo modules/users/client/config/users.client.routes.js)

在此示例中，重置网址将类似于localhost:3000/password/reset/:token

in this example reset url will be like localhost:3000/password/reset/:token

angular.module('users').config(['$stateProvider',
  function ($stateProvider) {
    // Users state routing
    $stateProvider
      .state('password', {
        abstract: true,
        url: '/password',
        template: '<ui-view/>'
      })
      .state('password.forgot', {
        url: '/forgot',
        templateUrl: 'modules/users/client/views/password/forgot-password.client.view.html'
      })
      .state('password.reset', {
        abstract: true,
        url: '/reset',
        template: '<ui-view/>'
      })
      .state('password.reset.invalid', {
        url: '/invalid',
        templateUrl: 'modules/users/client/views/password/reset-password-invalid.client.view.html'
      })
      .state('password.reset.success', {
        url: '/success',
        templateUrl: 'modules/users/client/views/password/reset-password-success.client.view.html'
      })
      .state('password.reset.form', {
        url: '/:token',
        templateUrl: 'modules/users/client/views/password/reset-password.client.view.html'
      });
  }
]);

这篇关于如何使用UI路由器在angularjs中实现密码重置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！