Receiving a request for access throughout the Angular2 domain and port To PHP

After running this quick example GET request from Angular2 to a PHP file that I keep getting -

Error 304

I am testing the difference between using node and PHP for the back of the Angular2 app . I have a simple GET request that tries to get a small amount of data from a PHP file.

The request seems to be going well, but the file is not provided in the application.

304 NOT MODIFIED A conditional GET or HEAD request was received and would give a 200 OK response if it were not for the fact that the condition evaluates to false.

In other words,

there is no need to give the server a representation of the target resource, since the request indicates that the client who made the request conditional already has a valid representation; therefore, the server redirects the client to use this stored view, as if it were a 200 OK response payload.

CORS

I have CORS allowed inside the express app.js file.

I have CORS allowed in a PHP file.

How can I solve this problem? I would like at least console.log data from ng2 .

Code examples

PHP // Launch on Apache port 80 @ api.example.com

 <?php header("Access-Control-Allow-Origin: *"); $data = array( array('id' => '1','first_name' => 'Cynthia'), array('id' => '2','first_name' => 'Keith'), array('id' => '3','first_name' => 'Robert'), array('id' => '4','first_name' => 'Theresa'), array('id' => '5','first_name' => 'Margaret') ); echo json_encode($data); ?> 

Angular2 // Running on Express Server @localhost: 4200

 import {Http, Response} from '@angular/http'; import {Injectable, Component } from '@angular/core'; @Component({ selector: 'my-app', template: `<ul> <li *ngFor="let person of data"> {{person.id}} - {{person.first_name}} </li> </ul>` }) export class AppComponent { private data; constructor(private http:Http){ } ngOnInit(){ this.getData(); } getData(){ this.http.get('api.example.com/index.php') .subscribe(res => this.data = res.json()); } } 

I tried to change the getData() none function, which worked. More recently,

  getData(){ let url = 'api.example.com/index.php'; let headers = new Headers({ 'Content-Type': 'application/json' }); let options = new RequestOptions({ headers: headers }); this.http.get(url, options) .subscribe(res => { this.data = res.json(); console.log(this.data); }); } 
+1
php angular
Feb 04 '17 at 7:20
source share
1 answer

I had a similar problem, but I was able to fix it by setting the following headers on the api script;

 if (isset($_SERVER['HTTP_ORIGIN'])) { header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}"); header('Access-Control-Allow-Credentials: true'); header('Access-Control-Max-Age: 86400'); // cache for 1 day} 

// Because Access-Control headers are accepted during OPTIONS requests

 if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') { if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD'])) header("Access-Control-Allow-Methods: GET, POST, OPTIONS"); if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS'])) header("Access-Control-Allow-Headers: {$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}"); exit(0); } 

Hope this helps

+1
Feb 15 '17 at 9:25
source share



All Articles