Как реализовать сброс пароля с помощью loopback framework и sdk builder на стороне клиента?

#angular #loopbackjs

#angular #loopbackjs

Вопрос:

Я создал следующую форму для сбора информации электронной почты для сброса пароля:

 <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 amp;amp; 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>
  

и я создал следующий компонент, используя sdk, созданный mean-sdk-builder:

 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();
});
  

Вот запрос:
Запрос

Есть идеи, пожалуйста? Я не совсем понимаю, что происходит.

Заранее благодарю вас за помощь.

Комментарии:

1. предоставьте нам некоторый серверный код, потому что это означает, что у вас ошибка на сервере, а также что ошибка возвращается в формате, отличном от json

2. Можете ли вы поделиться телом запроса, который вы отправляете? потому что кажется, что тело вашего запроса является недопустимым json.

3. Просто добавил запрос в вопрос.

4. Как я вижу на скриншоте вашего запроса, вы не отправляете действительный json в полезной нагрузке.

Ответ №1:

Я собираюсь предположить Clients , что это ваша модель расширения для Users модели. Если это так, Clients/reset конечная точка API принимает встроенный объект с одним свойством ’email’.

Итак, в вашем случае вам нужно изменить свой resetPwd метод, чтобы отразить это, т.Е.:

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

Это объясняет, почему вы получаете ошибку, касающуюся неожиданного токена, потому что вы передаете строку (‘philippe-correges@io-software.com ‘), когда функция resetPassword ожидает объект. Ожидаемый токен в позиции 0 должен быть a { , но вы передаете a p .

Надеюсь, это поможет.

Комментарии:

1. Нет проблем. Рад помочь.