2016-04-05 7 views
0

Ich verwende blueimp/jQuery-File-Upload Skript für Cross-Domain (Subdomain) Uploads. Die Hauptseite ist www.example.com und ich lade Dateien auf st2.example.com hoch.Ajax/Jquery Anfrage sendet keine Cookies

Alles funktioniert gut, aber das Problem ist, dass ich Cookies mit jeder Ajax Anfrage senden muss und aus irgendeinem Grund ist es nicht möglich. Die Dokumentation dieses Skript sagt:

Wenn Sie auf Cookies (zB für Authentifizierung) senden müssen, stellen Sie die withCredentials $ Schnipsel() Einstellung als Fileupload-Widget Option:

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

Das funktioniert nicht für mich. Ich habe versucht, die Linie

withCredentials: true 

in drei verschiedenen Stellen hinzuzufügen:..

  • zu $ ​​('# Fileupload') Fileupload ({
  • zu $ ​​('# Fileupload') Fileupload ('Option', {
  • bis $ Schnipsel ({

Erste 2 nicht bei allen. Die dritte Werk nur für HEAD Anfragen. HEAD Anfragen senden Cookies aber OPTIONEN und POST nicht. Ich habe dies in der Browser-Konsole in Firefox und Chrome überprüft.

Meine Frage ist: Wo ist das Problem, dass OPTIONS und POST-Anfragen keine Cookies senden?

Unten ist mein Skript. Dieses Beispiel enthält "withCredentials: true" an allen 3 Stellen, an denen ich es getestet habe.

<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> 

Datei auf st2.example.com enthält:

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'); 

Antwort

1

Das Problem Cloudflare ist. Zunächst sendet der Browser die OPTIONS-Anfrage an den Server, um zu sehen, ob Dateien hochgeladen werden können. OPTIONEN-Anfragen kommen immer ohne Cookies, deshalb gibt Cloudflare eine andere Captcha-Challenge-Seite aus, anstatt die Anfrage an den Server weiterzuleiten.