クロスサイトなAjaxで、ヘッダーを取得する際にちょっとはまったのでメモ。
例えば、
Ajax
$.ajax({ type: "GET", url: "http://url", dataType: "text", ifModified: true, cache: true, success: function(data, status, xhr) { var etag = xhr.getResponseHeader("ETag"); alert(etag); }, });
こんな感じでETagヘッダーを取得したいAjaxがあるとして、
下記のようなレスポンスヘッダーだと、Javascriptで取得出来るヘッダーがかなり限られたものだけになります。
レスポンスヘッダー
Access-Control-Allow-Headers: ETag Access-Control-Allow-Origin: http://url Access-Control-Allow-Credentials: true
つまり、レスポンス自体はされていてブラウザも受け取っているのですが、
Javascriptに渡されるヘッダーが限られたものになります。
ということで、ブラウザに対してJavascriptに渡してよいヘッダーを、Access-Control-Expose-Headersヘッダーで指定します。
Access-Control-Allow-Headers: ETag Access-Control-Allow-Origin: http://url Access-Control-Allow-Credentials: true Access-Control-Expose-Headers: ETag
これでJavascriptから指定したヘッダーが取得出来るようになります。
尚、*(アスタリスク)の指定も可能です。