Basic authentication with WordPress RESTful service from external client app

Try this -

import {Component} from 'angular2/core';import {AppState} from '../app.service';import {Http, Headers, RequestOptions, Request, RequestMethod, Response} from 'angular2/http';@Component({  selector: 'login',  template: `    <div class="container">      <div class="login">        <div class="login-triangle"></div>        <h2 class="login-header">Log in</h2>        <form class="login-container">          <p><input type="email" placeholder="Email"></p>          <p><input type="password" placeholder="Password"></p>          <p><input type="submit" value="Log in"></p>        </form>      </div>    </div>  `,  styles: [require('./login.scss')]})export class LoginCmp{  constructor(private state: AppState){  }  login(username: string, password: string){    let token = btoa(username + ':' + password);    <!--this.state.set('token', token);-->        this.headers = new Headers(); //Set header for authunetication        this.headers.append('Content-Type', 'application/json');        this.headers.append('Authorization', 'Basic ' + token); //pass here your encoded string of username and password        this.requestoptions = new RequestOptions({            method: RequestMethod.Get, //Chose method you wish to use Get, Post, bla bla            url: url,            headers: this.headers        })     this.http.request(new Request(this.requestoptions))            .map(res => {                let json;                if (res.status == 200) {                    json = res.json();                }                else if (res.status == 401) {                    json = null;                }                 console.log(res.status, json);            });  }}

see also -

• Using http rest apis with angular 2

try something like this:

$http({method: 'POST',url: api_url + 'auth/generate_auth_cookie/?nonce=' + data.nonce + '&username=' + encodeURIComponent(username) + '&password=' + encodeURIComponent(password)}).success(function(data, status, headers, config) {}).error(function(data, status, headers, config) {});

Then you have an auth cookie to perform every remote call (you pass it simply through the header)

I hope it helps