Ajax/Jqueryリクエストがクッキーを送信していません

Question

私はクロスドメイン（サブドメイン）アップロードのためにblueimp/jQuery-File-Uploadスクリプトを使用しています。メインページはwww.example.comで、ファイルをst2.example.comにアップロードします。

すべて問題なく動作しますが、問題は各AjaxリクエストでCookieを送信する必要があり、何らかの理由でそれができないことです。このスクリプトのドキュメントは言う：

$('#fileupload').fileupload('option', { 
xhrFields: { 
withCredentials: true 
} 
}); 

：

あなたが（認証用など）をクッキーに沿って送信する必要がある場合は、ファイルアップロードウィジェットオプションとして設定 withCredentials $アヤックス（）を設定これは私のためには機能しません。私は、3つの異なる場所でライン

withCredentials: true 

を追加しようとしました：。。$（ '＃のファイルアップロード'）に

• ファイルアップロード（$（ '＃のファイルアップロード'）に{
• ファイルアップロードを（ 'オプション'、{$アヤックスへ
• （{

第2は全く動作しません。だけための第三作品HEADリクエスト。 HEADリクエストはCookieを送信しますが、オプションとPOSTではありません。 FirefoxとChromeのブラウザコンソールでこれを確認しました。

私の質問は次のとおりです。OPTIONSリクエストとPOSTリクエストがクッキーを送信しない問題はどこですか？

以下は私のスクリプトです。この例では、私がテストした3つの場所すべてに "withCredentials：true"が含まれています。 st2.example.com上

<script> 
    var defaultthumbnail = '<img class="thum5" src="/upload.png">'; 
    $(function() { 
    var formData = $('#fileupload').serializeArray(); 
    'use strict'; 
    $('#fileupload').fileupload({ 
xhrFields: {withCredentials: true}, 
    url:'//st2.example.com/', 
    }); 

    $('#fileupload').fileupload('option', { 
    acceptFileTypes: /(\.|\/)(jpe?g)$/i, 
    autoUpload:true, 
    maxNumberOfFiles:20, 
    maxFileSize:4000000, 

    xhrFields: {withCredentials: true}, 

    disableImageResize: /Android(?!.*Chrome)|Opera/ 
    .test(window.navigator.userAgent) 
    }); 

    if ($.support.cors) { 
    $.ajax({ 
xhrFields: {withCredentials: true}, 
    url: $('#fileupload').fileupload('option', 'url'), 
    type: 'HEAD' 
    }).fail(function() { 
    $('<div class="error"/>') 
    .text('Server is not available') 
    .appendTo('#fileupload'); 
    }); 
    } 
    }); 
    </script> 

ファイルが含まれています

header('Access-Control-Allow-Origin: http://www.example.com'); 
header("Access-Control-Allow-Credentials: true"); 
header('Access-Control-Allow-Methods: HEAD, GET, PUT, POST, OPTIONS'); 
header('Access-Control-Allow-Headers: Content-Type, Content-Range, Content-Disposition, Content-Description'); 

Answer 1

問題がCloudFlareのです。最初に、ブラウザはOPTIONS要求をサーバーに送信して、ファイルをアップロードできるかどうかを確認します。 OPTIONSリクエストは常にクッキーなしで送られます。そのため、Cloudflareはリクエストをサーバーに転送するのではなく、別のキャプチャチャレンジページを発行します。