Как прочитать ответ JSON, созданный PHP с использованием Angular 2

Я использую Angular 2 в качестве внешнего интерфейса и PHP, MySQL для моего внутреннего интерфейса.

PHP правильно создает данные json, но angular 2 не может прочитать содержимое файла. Я получаю ошибку ниже.

XMLHttpRequest cannot load http://localhost:81/login.json.
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://localhost:4200' is therefore not allowed access. The response had HTTP status code 404.

JSON-файл доступен по адресу HTTP: // локальный: 81 / login.json место нахождения. Я использую XAMPP для запуска моего php-файла.

Мой угловой код 2 ниже.

import { Component, OnInit, Input } from '@angular/core';
import { Http, Response } from '@angular/http';

@Component({
moduleId: module.id,
selector: 'app-header-modal',
templateUrl: './header-modal.component.html',
styleUrls: ['./header-modal.component.css']
})export class HeaderModalComponent implements OnInit {

private data;

constructor(private http:Http){
}

ngOnInit(){

}
ngAfterViewInit() {
this.getData();
}
getData(){
this.http.get('http://localhost:81/login.json')
.subscribe(res => this.data = res.json());

console.log('User Data: '+this.data);
}}

Мой код PHP ниже.

<?php
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Headers: X-Requested-With");

include 'connect.php';

$username       = str_replace(" ", "", $_POST['username']);
$password       = str_replace(" ", "", $_POST['password']);$query      =   mysql_query("select username, password, id from registration where username='".$username."' and password='".$password."'");
$result     =   mysql_fetch_array($query);
if($result){
$data = array(
array('userId' => $result['id'],'userName' => $result['username'])
);

$fp = fopen('login.json', 'w');
fwrite($fp, json_encode($data));
fclose($fp);

?>
<script>
history.go(-1);
</script>
<?php}

?>

Может кто-нибудь помочь!