Cross-Origin-Anfrage Blockierter Fehler beim Senden von Post an eine API mit Javascript

Question

Hallo, ich habe eine wie diese https://rdkportal.ccp.xcal.tv/build_images/cdl beim Senden einer Post-Anfrage, ich werde in der Lage sein, einige Informationen in JSON als Antwort zu bekommen. Diese ist das Format für das Senden es Linux mit

curl -u username:password https://rdkportal.ccp.xcal.tv/build_images/cdl -H "Content-Type: application/json" -H "Accept: application/json" -X POST -d '{"image_name": "MX011AN_VBN_master_20160118234003sdy_NG", "recipients_list": "some_user@.com", "cdl": "PROD", "type": "tftp", "stb": { "ip4_address": "0.0.0.0", "ip6_address": "2001:558:4030:2:96d4:feff:fe7c:7500", "mac_address": "", "serial_number": "" }}' 

Ich war Erfolg voll in eine POST-Anforderung das Senden und Empfangen der Antwort durch die obige curl Befehl in einer Linux-Maschine ausgeführt wird.

Ich versuche, eine ähnliche Sache in Javascript mit Ajax zu tun, aber ich bekomme den folgenden Fehler.

Cross-Origin-Anforderung blockiert: Die Richtlinie "Gleiche Herkunft" lässt das Lesen der Remote-Ressource unter https://rdkportal.ccp.xcal.tv/build_images/cdl nicht zu. (Grund: CORS-Header 'Access-Control-Allow-Origin' fehlt).

Hier ist mein Code

$.ajax({ 
     type: 'POST', 
     url: 'https://rdkportal.ccp.xcal.tv/build_images/cdl', 
     crossDomain: true, 
     data: '{"some":"json"}', 
     dataType: 'json', 
     xhrFields: { 
      withCredentials: true 
     }, 
     success: function(responseData, textStatus, jqXHR) { 
      var value = responseData.someKey; 
      alert('POST success'); 
     }, 
     error: function (responseData, textStatus, errorThrown) { 
      alert('POST failed.'); 
     } 
    }); 

ich nicht auch wissen, wie die Anmeldeinformationen mit der Bitte, in Ajax zu senden. Bitte helfen Sie mir, hier zu arbeiten. Danke im Voraus.

Answer 1

Sie können diese Dinge auf 3 Arten acheive:

1) Sie Chrom-Plugin installieren kann, wenn serverseitige Code nicht in Ihrer Kontrolle bedeutet, dass Sie Jungs sind Handling es nicht.

-Link:

https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?utm_source=chrome-ntp-icon

2). Sie können einen Proxy-Server erstellen und mit diesen neuen URLs/api kommunizieren.

3). Die dritte und letzte und beste Möglichkeit ist, Access-Control-Allow-Origin: * entweder * (um Zugriff auf alle URLs von jeder Domäne zu gewähren) oder Access-Control-Allow-Origin: 'Ihre System-IP, wenn sie lokal ausgeführt wird Hostname '(um Zugriff nur auf diesen bestimmten Host zu gewähren)

Answer 2

Sie müssen die Kopfzeile hinzufügen, um Anfragen von anderen Orten in den Endpunkt zuzulassen.

"Access-Control-Allow-Origin: *"

Dieser sendet den Header mit den autorisierten Domänen, die Anforderungen an diesen Endpunkt machen, (* bedeutet alle).

CORS erwartet zu wissen, ob Sie berechtigt sind, Anforderungen auf diesem Server zu stellen, so dass das Senden des Headers dieses Problem löst.

Wie Sie dies in der Kopfzeile hinzufügen, hängt von der Sprache ab, die Sie verwenden (node ​​php ruby ​​java).

Wenn Sie auf das Backend eingehen, kann ich Ihnen helfen.

Answer 3

Sie müssen die folgenden Header auf die Anforderung hinzuzufügen:

Access-Control-Allow-Origin: * 

oder

Access-Control-Allow-Origin: root-url-here.com 

Aber vor allem, der Server diesen Header wieder in der Reaktion mit der schicken muss identische URL (zB root-url-here.com).

Wenn Sie nicht der Entwickler der Serverseite sind, sollten Sie sie bitten, Ihre Anfrage-URL zu der Liste der akzeptierten Anfrageursprünge hinzuzufügen.