Question

我使用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.

http://localhost:81/login.json位置提供的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


}

?>

有人可以帮忙！

Answer 1

这似乎是您尝试使用的php服务器后端的CORS问题。你有角度的应用程序没有能力因为CORS而向php服务器发出请求。

一旦你正确配置了php服务器，请求就应该开始工作了。

More information on CORS

如何使用角度2

1 个答案: