Question

我正在尝试从离子应用程序生成cookie auth作为前端，而Wordpress作为后端（我使用this JSON API USER插件）。

第一步是生成随机数：MYURLBASE / api / get_nonce /？controller = user＆amp; method = generate_auth_cookie

然后生成cookie：MYURLBASE / api / user / generate_auth_cookie /？nonce = 375034fjwfn39u8＆amp; username = john＆amp; passsword = PASSWORD-HERE

我可以获得nonce，但是我在构建处理请求的服务时遇到了麻烦。

这是我的login.html：

<form [ngFormModel]="loginForm" (submit)="login(username, password)" style="padding-top: 50px">
        <ion-list>
            <ion-item>
                <ion-label  stacked-label>Nom d'utilisateur ou Email</ion-label>
                <ion-input type="text" [(ngFormControl)]="username" value=""></ion-input>
            </ion-item>

            <ion-item>
                <ion-label stacked-label>Mot de passe</ion-label>
                <ion-input type="password" [(ngFormControl)]="password" value=""></ion-input>
            </ion-item>

        </ion-list>
        <div>
            <button block type="submit">Connexion</button>
        </div>
    </form>

这是我的login.ts：

import {Page, NavController, Alert} from 'ionic-angular';
import { FORM_DIRECTIVES, FormBuilder,  ControlGroup, Validators, AbstractControl, Control } from 'angular2/common';
import { Http, Headers, RequestOptions, Request, RequestMethod, Response } from 'angular2/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/Rx';
import {LoginService} from './login.service';
import {WooPage} from '../woo/woo';

@Page({
  templateUrl: 'build/pages/ecommerce/login/login.html',
  providers:[LoginService],
})

export class LoginPage {

  loginForm: ControlGroup;
  username: AbstractControl;
  password: AbstractControl;
  response;

  constructor(private loginService:LoginService, public nav: NavController,
    fb: FormBuilder){
      this.loginForm = fb.group({
        username: ['', Validators.required],
        password: ['', Validators.required]
      });
      this.username = this.loginForm.controls['username'],
      this.password = this.loginForm.controls['password']
    }

// For test purposes
    getNonce() {
      this.loginService.getNonce()
      .subscribe(
        response => this.response = response,
        error => console.log(error));
      }
// For test purposes
      generateCookie() {
        this.loginService.generateCookie(this.loginService.getNonce())
        .subscribe(
          response => this.response = response,
          error => console.log(error));
        }

        login(
            username:string,
            password:string) :void {

          this.loginService.login(
              username = this.username.value,
              password = this.password.value
          )
          .subscribe(
            response => this.response = response,
            error => console.log(error)
          );
        }
      }

最后我的login.service.ts：

import {Injectable,Inject} from 'angular2/core';
import {Http,Headers,Response} from 'angular2/http';
import {Observable} from 'rxjs/Observable';
import {NavController, Alert} from 'ionic-angular';

@Injectable()

export class LoginService {

  private nonceUrl = 'https://MYURL/api/get_nonce/?controller=user&method=generate_auth_cookie'
  private cookieUrlBase = 'https://MYURL/api/user/generate_auth_cookie/?nonce='

  constructor(private http:Http) {}

getNonce() {
  let nonce = this.http.get(this.nonceUrl).map(res => res.json().nonce);
  return nonce;
}

generateCookie(nonce) {
  return this.http.get(this.cookieUrlBase+nonce+'&username='+'chuckNorris'+'&password='+'chuckchuck')
}


// TODO:  login(
//       username: string,
//       password: string):Observable<any> {
// 
//     const body = JSON.stringify(username + password);
//     let headers = new Headers();
// 
//     headers.append('Content-Type', 'application/x-www-form-urlencoded');
//     return this.http.post(, body, {
//       headers : headers
//     }).map(res => res.json());
//   }
}

当我调用generateCookie函数时，我会生成以下url： https://MYURL/api/user/generate_auth_cookie/?nonce=[object%20Object]&username=chuckNorris&password=chuckchuck

如何传递nonce值，而不是对象？有没有更好的方法来实现登录验证？

感谢您的帮助，因为我在这里迷失了...... 阴

Answer 1

尝试：

getNonce() {
  return new Promise(resolve => {
    this.http.get(this.nonceUrl)
        .map(res => res.json())
        .subscribe(data => {
            console.log(data);
        });
    });
}

然后，结果如下：

{"status":"ok","controller":"user","method":"generate_auth_cookie","nonce":"66e6054397"}

所以，然后只传递＆＃34; nonce＆＃34;属性而不是整个对象：result.nonce

this.cookieUrlBase+result.nonce+'&username='+'chuckNorris'+'&password='+'chuckchuck'

Ionic2 / Angular 2 - Wordpress从应用程序生成cookie auth

1 个答案: