2017-07-04 36 views
0

私のサーバに投稿要求を送信しようとしているときにエラーが発生しました
これを解決するには?角2 http投稿の問題

エラー

XMLHttpRequestがhttp://localhost/posttest.phpをロードすることはできません。要求 ヘッダーフィールドのContent-Typeは によって許可されていません。プリフライト応答のアクセス制御許可ヘッダー。

PHPコード http://localhost/posttest.php

header("Access-Control-Allow-Origin: *");<br> 
$data = array("token"=>"","l_date"=>"");<br> 
$data_json = json_encode($data);<br> 
echo $data_json; 

角度2 HTTPポストコードPHPで

import {Injectable} from '@angular/core'; 
import { Http, RequestOptions,Headers,Response } from '@angular/http'; 
import 'rxjs/add/operator/map'; 

@Injectable() 
export class PostsService{ 
constructor(private http:Http){ 
    console.log("post service initialized ... "); 

} 
getPosts(id:number){ 
    return this.http.get('https://jsonplaceholder.typicode.com/posts/'+id).map(res=>res.json()); 
} 
postexample(){ 
    var json=JSON.stringify({milla:"hi",login2:"milla"}); 
    var param="json="+json; 
    let headers1 = new Headers({ 'Accept': 'application/json','Content-Type': 'application/json' }); 
    let options = new RequestOptions({ headers: headers1 }); 
    let body = JSON.stringify(json); 
    return this.http.post('http://localhost/posttest.php', body, options).map((res: Response) => res.json()); 
} 
} 
+0

このようにallow-headersも追加する必要があります:header( "Access-Control-Allow-Origin:*"); ヘッダー( "Access-Control-Allow-Headers:*"); –

+0

ブラウザはメソッドタイプが 'OPTIONS'のプリフライトリクエストを送信して、サーバーが別のドメインからアクセスできるかどうかを確認します。 'ヘッダー("アクセス制御許可ヘッダー "、"アクセス制御許可ヘッダー、発信元、受け入れ、X要求済み、コンテンツタイプ、アクセス制御許可ヘッダー ")をプレフライト要求に応答して、あなたのPHPの ブラウザは、それ以上の呼び出しを行うことがOKであることを理解し、実際のGET/POSTコールに対して有効な応答を得るでしょう。 – crowchirp

答えて

0

追加別のアクセス制御ヘッダー:

http://localhost/posttest.php 
header("Access-Control-Allow-Origin: *"); 
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept"); 
$data = array("token"=>"","l_date"=>""); 
$data_json = json_encode($data); 
echo $data_json; 
+1

ありがとうございます、それは動作します –