2017-11-16 76 views
1

私はサーバーからのターゲットURLを持っており、AjaxChromeブラウザに特定のCookieを含むパラメータを送信したいとします。私はそれのために始めたカスタムクッキーを使用してAjaxリクエストを別のドメインに送信する

Cache-Control:max-age=600, private, must-revalidate 
Cache-Control:no-store, no-cache, must-revalidate, post-check=0, pre-check=0 
Connection:keep-alive 
Content-Encoding:gzip 
Content-Length:6821 
Content-Type:text/html 
Date:Thu, 16 Nov 2017 22:50:17 GMT 
Expires:Thu, 19 Nov 1981 08:52:00 GMT 
Pragma:no-cache 
Server:Apache 
Vary:Accept-Encoding 
X-Powered-By:PHP/5.5.38 

:ターゲットURL (私は変更の設定のためのサーバーへのアクセス権を持っているか、それにスクリプトを変更しないでください)のサーバーの

レスポンスヘッダ!
まず、テストアクセス用にCURLを試します。

curl 'http://www.foo.com/bar.php' \ 
    -H 'Cookie: PHPSESSID=vjjuo34g4gh46ajd471lt8pvn7;' \ 
    --data 'x=1&y=2' --compressed -s 

PHPSESSIDクッキーが送信されることだけが重要である:サーバーへのアクセスが必要であると特定のヘッダを設定する必要はありませんので、これは動作します。

応答:正しい、アクセス権があります。

参照:
pic01

は、今私がしようとAjaxとローカルChromeブラウザ:

Failed to load http://www.foo.com/bar.php : No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin ' http://localhost:8888 ' is therefore not allowed access.

参照:
私は次のエラーメッセージが表示さ

$.ajax({ 
    type: "POST", 
    ContentType: "application/json; charset=UTF-8", 
    dataType: "json", 
    data: {x : '1', y: '2'}, 
    url: 'http://www.foo.com/bar.php', 
    complete: function(data) { 
     console.log('RESPONSE TEXT>>>>>>>>', data.responseText); 
    } 
}); 

Allow-Control-Allow-Originクロムエクステンションを有効にしてもう一度実行します。
今回は動作します。しかし、クッキーが送信されないため、アクセスはありません。

応答:間違っており、アクセスできません。

参照:
pic03

Ajaxリクエストヘッダにクッキーを追加します。

beforeSend : function(xhr) { 
    xhr.setRequestHeader('Cookie', 'PHPSESSID=vjjuo34g4gh46ajd471lt8pvn7;'); 
}, 

クッキーが設定され、エラーがコンソールに表示されていないが、エラー:

Refused to set unsafe header "Cookie"

応答:間違っており、アクセスできません。

参照:
pic04

私たちは、私たちはクッキーを追加できるようにするために、Ajaxリクエストにこれを追加します。

xhrFields: { 
    withCredentials: true, 
}, 

何が起こることは、私の優先クッキーが設定されていないことです。しかし、あらかじめ設定されたクッキーは、要求されたドメインの私のドメインに設定されています。
(これは問題ではないCookieと同じものとみなします)。)
しかし、この時間は、次のメッセージがコンソールに表示されます。

Failed to load http://www.foo.com/bar.php : The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin ' http://localhost:8888 ' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

は応答:正しいが、空を返します!なぜ?!

を参照してください:あなたは、要求が必要とされたクッキーが含まれていることがわかり
pic06
pic05

。しかし、data.responseTextとJavaScriptでは正解が返ってこなかった。
しかし、Developer Tools> Network> Responseの応答テキストが正しく表示されるのは奇妙です。

どうしてこのようなことが起こり、最終的に最初のイメージのCURL要求のような正しい応答を得ることができますか?

EDIT:
console.log(data)コマンドの出力。ここをクリックしてください:
pic07
この時間に赤いメッセージが変更されたようです!また、応答データの読み込みに時間がかかるようで、Responseクロムのタブに失敗しました!

+0

'データ型:「JSONは」' AJAX自動オブジェクトにJSONレスポンスを解析します。 console.log(data)とあなたが持っているものを参照してください。 – Taplar

+2

はCORSをバイパスしている方が**サーバーのCORSを適切に有効にするよりもはるかに難しいです。** –

+0

PHPでcorsを有効にするための良いリソースhttps://stackoverflow.com/a/9866124/1175966 – charlietfl

答えて

1

ヘッダーAccess-Control-Allow-Originがサーバーに設定されています。 AJAXを使用してサーバーから応答を受け取るには、Access-Control-Allow-Originヘッダーにワイルドカード*ではない値を追加する必要があります。

ローカルホストからテストを行っているのがわかります。 Access-Control-Allow-Origin: http://localhost/を設定すると動作しません。サーバーからテストすることができれば、動作する可能性があります。

あなたができることは、ドメインを持っているサイトからのテストです。応答にAccess-Control-Allow-Origin: domainを追加します。このトピックに関する詳細情報が必要な場合は

私はあなたにこのサイトをお勧めします。

https://developer.mozilla.org/es/docs/Web/HTTP/Access_control_CORS

+0

私は変更設定やスクリプトを変更するためのサーバへのアクセス権を持っていませんし、私は質問の投稿の最初にサーバのサンプル応答ヘッダを追加します。また、stackoverflowと最初の答えに歓迎: - D –

関連する問題