Canvas-Element mit und Bild von aws s3 geladen cors mit nicht funktioniert ersten paar Lasten

Question

So habe ich cors Setup auf meine AWS S3 Eimer:

<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/"> 
    <CORSRule> 
    <AllowedOrigin>*</AllowedOrigin> 
    <AllowedMethod>GET</AllowedMethod> 
    </CORSRule> 
</CORSConfiguration> 

In meinem html

<div id="explain_canvas"></div> 

In meinem Javascript Ich lade ein Bild und lege es in ein Leinwandbild.

var outlineImage = new Image(); 
outlineImage.crossOrigin = ''; 
outlineImage.src = drawing_image; 
outlineImage.onload = function() { 
    var canvasDiv = document.getElementById('explain_canvas'); 
    var canvas = document.createElement('canvas'); 
    canvas.setAttribute('width', 722); 
    canvas.setAttribute('height', 170); 
    canvas.setAttribute('id', 'canvas_'+canvas_element); 
    canvas.setAttribute('name', 'canvas_'+canvas_element); 
    canvasDiv.appendChild(canvas); 
    if(typeof G_vmlCanvasManager != 'undefined') { 
    canvas = G_vmlCanvasManager.initElement(canvas); 
    } 
    var context = canvas.getContext("2d"); 
    context.drawImage(outlineImage, 10, 10, 600, 150); 
} 

Ich lade den Kontext so, dass er mit dem Internet Explorer kompatibel ist.

Hier ist mein Problem. Wenn die Seite, um die ersten beiden Male lädt, kommt es mit diesem Fehler auf:

Cross-origin image load denied by Cross-Origin Resource Sharing policy. 

Allerdings, wenn ich der Seite ein paar Mal neu zu laden, wird es schließlich arbeiten und das Bild laden. Sobald dies erledigt ist, kann ich erfolgreichDataURL() auf dem Canvas-Element aufrufen.

Weiß jemand, warum das passiert? Habe ich einen Fehler gemacht? Ist es ein Problem mit AWS und ich muss nur auf Amazon warten, um die Kors zu reparieren?

Es passiert in allen Browsern, die ich getestet habe. In Chrome, Firefox, Safari, IE. Auf meinem Mac, PC und iPhone. Also ich glaube nicht, dass es Browser-bezogen ist. Auch passiert es lokal und in der Produktion.

Danke!

Answer 1

Anscheinend senden die Browser keinen Ursprungsheader in den Anforderungsheadern. Und aws erfordert die Herkunft gesendet werden. Ich bin nicht sicher, warum das der Fall sein würde. Der Ursprungsheader sollte auch mit einer einfachen HTTP-Anfrage gesendet werden. Leider ist es nicht.

Und here ist der Grund, warum die Herkunft Kopf nicht gesendet wurde.