2016-12-08 16 views
0

Ich habe es untersucht und meine Syntax sieht korrekt aus, aber ich kann nicht herausfinden, was falsch läuft. Wenn ich die Optionsparams nicht eingeschlossen habe, funktioniert alles gut außer CORS ist eingeschaltet, was ich nicht will.Deaktivieren von CORS mit js fetch

Nach dem Hinzufügen der Optionen mit Modus in der Anfrage, die ich jetzt immer diese Fehlermeldung mit allen Bildern angefordert:

Bild-Cropper-modal.js: 73 Daten GET: net :: ERR_INVALID_URL

haben versucht, schon hier auf der Suche: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch und hier:

: https://jakearchibald.com/2015/thats-so-fetch/

hier mein Code

const options = { 
     method: 'GET', 
     mode: 'no-cors' 
    }; 

    fetch(url, options).then(response => response.blob()) 
    .then(blob => { 
     let reader = new FileReader(); 
     reader.onload =() => { 
     const type = blob.type; 
     const [image, dataUrl] = [new Image(), reader.result]; 
     image.src = dataUrl; 
     const [width, height] = [image.width, image.height]; 
     const {minWidth, minHeight} = props.opt; 
     const isWithinBounds = (width >= minWidth) && (height >= minHeight); 
     callback({ 
      dataUrl, 
      height, 
      minHeight, 
      minWidth, 
      width 
     }); 
     } 
     reader.readAsDataURL(blob) 
    }); 
+0

Haben Sie Zugriff auf die Serverseite? Im Dev-Modus verwende ich, um dies zu vermeiden CORS response.header ("Access-Control-Allow-Origin", "*"); response.header ("Zugriffssteuerung-Erlauben-Header", "Ursprung, X-Requested-With, Content-Type, Accept"); –

+0

FYI - in Ihrem zweiten Link, über No-Cors es Staaten ** Natürlich können Sie nicht den Inhalt der Antwort ** lesen, die es ziemlich klar, dass Ihr Code die Antwort nicht lesen würde (auch wenn Corse-Header sind anwesend, glaube ich) –

Antwort

2

Mit der no-cors Option wird nicht geben Sie eine lesbare Antwort:

no-cors - Verhindert, dass das Verfahren von etwas zu sein als andere HEAD, GET oder POST. Wenn ServiceWorkers diese Anfragen abfangen, dürfen sie außer diesen keine Header hinzufügen oder außer Kraft setzen. Darüber hinaus kann JavaScript auf keine Eigenschaften der resultierenden Antwort zugreifen. Dadurch wird sichergestellt, dass ServiceWorker die Semantik des Webs nicht beeinflussen und Sicherheits- und Datenschutzprobleme verhindern, die durch das Auslaufen von Daten über Domains entstehen. (source, Hervorhebung von mir)

Mit anderen Worten, wenn Sie eine Anfrage von JavaScript machen wollen, müssen Sie CORS aktiviert sein. Wenn Sie die CORS-Unterstützung nicht selbst auf dem Server einrichten können, besteht die einzige Möglichkeit darin, Ihre Anfrage über einen Server zu übertragen, um in Ihrem Namen Nicht-CORS-Anfragen zu stellen (entweder durch Nutzung Ihres eigenen Servers oder durch Verwendung eines dritten Servers). Party-Service wie crossorigin.me oder cors-anywhere, oder eine Reihe anderer ähnlicher Dienste).

Für Kontext ist die no-cors Option verfügbar, da es einige Fälle gibt, in denen Sie möglicherweise eine Nicht-CORS-Anforderung vornehmen möchten, ohne die Antwort lesen zu müssen. Zum Beispiel kann service workers diese Option verwenden, um Anforderungen abzufangen (z. B. umzuleiten oder zu cachen, aber nicht zu lesen oder zu modifizieren), die durch den Browser gemacht werden (wie Tags oder HTML-Seiten, nicht nur JavaScript-Code).

+0

Gibt es einen Weg um dies? – Anchalee

+0

@Anchalee Nicht eine, die den Benutzer von Proxies nicht einbezieht; Ich habe jedoch einige öffentliche CORS-Proxies in meiner Antwort verlinkt. – Frxstrem