Ionic2/Angular 2 - Wordpress從應用程序生成cookie身份驗證

Question

我試圖從離子應用程序生成一個cookie身份驗證作爲前端，和Wordpress作爲後端（我使用this JSON API USER插件） 。

的第一步是產生隨機數：MYURLBASE/API/get_nonce /控制器=用戶&方法= generate_auth_cookie

然後生成的cookie：MYURLBASE/API /用戶/ generate_auth_cookie /隨機數= 375034fjwfn39u8 &用戶名= john & passsword = PASSWORD-HERE

我可以得到隨機數，但我在建立處理請求的服務時遇到了問題。

這裏是我的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值，因爲不是一個對象？ 有沒有更好的方式來實現登錄認證？

感謝您的幫助，因爲我在這裏相當迷茫... Yin。

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"} 

因此，然後通過只有 「隨機數」 屬性，而不是整個對象：result.nonce

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