如何使用loopback框架和sdk builder客户端实现重置密码？

Question

我创建了以下表单来收集电子邮件信息以重置密码：

<div class="container-scroller background-picture">
<div class="container-fluid page-body-wrapper full-page-wrapper">
  <div class="content-wrapper d-flex align-items-center auth login-full-bg">
      <!-- <div class="row w-100"> -->
      <div class="col-lg-6 mx-auto">
          <div class="auth-form-dark text-left p-5">
              <h2 i18n="@@RESETPASSWORD">RESETPASSWORD</h2>
              <form name="form-signin" (ngSubmit)="f.form.valid && resetPwd()" #f="ngForm" novalidate>
                  <span id="reauth-email" class="reauth-email"></span>
                  <div class="form-group">
                      <label for="mail" i18n="@@email">EMAIL</label>
                      <input type="text" class="form-control" id="mail" name="email" [(ngModel)]="user.email"
                             #mail="ngModel" required/>
                  </div>
                  <div class="mt-5">
                    <button class="btn btn-lg btn-warning btn-block btn-signin font-weight-medium"
                            type="submit" i18n="@@RESETPASSWORDDEMAND">RESETPASSWORDDEMAND
                    </button>
                  </div>
                  <div class="mt-3 text-center" style="margin-top:15px">
                    <a [routerLink]="['/login']" class="auth-link text-white" i18n>BACK</a>
                  </div>
              </form>
              <!-- </div> -->
          </div>
      </div>
  </div>

我使用mean-sdk-builder生成的sdk创建了以下组件：

import { Component, OnInit } from '@angular/core';
import { Client, AccessToken } from '../shared/sdk/models';
import { ClientApi } from '../shared/sdk/services';
import { Router } from '@angular/router';

@Component({
  selector: 'app-password-reset',
  templateUrl: './password-reset.component.html',
  styleUrls: ['./password-reset.component.css']
})
 export class PasswordResetComponent implements OnInit {

  public user: Client = new Client();

  constructor(
      private clientApi: ClientApi,
      private router: Router
  ) {

 }

  ngOnInit() {}

  resetPwd() {
    this.clientApi.resetPassword(this.user.email).subscribe(
      () => this.router.navigate(['/login']),
      err => this.router.navigate(['/resetFailed'])
  );
}
}

提交表单时，我收到400错误：

这是server.js代码：

 var loopback = require('loopback');
 var boot = require('loopback-boot');
 var path = require('path');
 var bodyParser = require('body-parser');
 var app = module.exports = loopback();

// configure view handler
 app.set('view engine', 'ejs');
 app.set('views', path.join(__dirname, 'views'));

// configure body parser for http session
 app.use(bodyParser.urlencoded({ extended: true }));

// Set the server render engine
 app.set('view engine', 'ejs');

 app.all('/category', function (req, res) {
   res.sendFile('../client/index.html');
});

 app.start = function () {
  // start the web server
   return app.listen(function () {
     app.emit('started');
     var baseUrl = app.get('url').replace(/\/$/, '');
     console.log('Web server listening at: %s', baseUrl);
     if (app.get('loopback-component-explorer')) {
      var explorerPath = app.get('loopback-component-          explorer').mountPath;
      console.log('Browse your REST API at %s%s', baseUrl, explorerPath);
    }
  });
};

// Bootstrap the application, configure models, datasources and middleware.
// Sub-apps like REST API are mounted via boot scripts.

 boot(app, __dirname, function (err) {
  if (err) throw err;

  // start the server if `$ node server.js`
  if (require.main === module)
    app.start();
});

这是请求：

有什么好主意吗？我真的不明白会发生什么。

我提前感谢你的帮助。

Answer 1

我将假设Clients是Users模型的扩展模型。如果是这种情况，API的Clients/reset端点接受一个具有“email”属性的内联对象。

因此，在您的情况下，您需要更改您的resetPwd方法以反映这一点，即：

resetPwd() {
    this.clientApi.resetPassword({ email: this.user.email }).subscribe(
      () => this.router.navigate(['/login']),
      err => this.router.navigate(['/resetFailed'])
  );

这解释了为什么您收到有关意外令牌的错误，因为当resetPassword函数需要一个对象时，您传递一个字符串（'[email protected]'）。位置0的预期令牌应该是{，但是你传递的是p。

我希望这有帮助。