Ajax-API-Aufruf Access-Control-Allow-Origin. Herkunft nicht erlaubt Zugang

Question

OK, ich bin schon seit Stunden hier! Und ich habe jede erdenkliche Verbindung gelesen, die ich zu dem Thema finden kann, aber ich kann es immer noch nicht zur Arbeit bringen, und es macht mich langsam wahnsinnig.

Ich mache eine AJAX-Anfrage (von meiner Domain) zu einer API (auf einer anderen Domain), aber alles, was ich immer wieder in der Konsole Log bekommen ist (offensichtlich habe ich die ausgeschlossenen Domänen etc):

XMLHttpRequest kann https://[APIPROVIDER]/something.json?options nicht geladen werden. Kein 'Access-Control-Allow-Origin'-Header ist auf der angeforderten Ressource vorhanden. Origin 'http://[MYDOMAIN].com' ist daher nicht erlaubt.

Das ist mein Code

ist

$(document).ready(function() { 
function step1(){ 
    $.ajax({ 
     url: 'getit.php', 
     method: 'get', 
     dataType : 'json', 
     success: function(data){ 
      step2(data.url); 
     }, 
     error: function(jqXHR, status, error) { 
      console.log(error); 
     } 
    }); 
} 
function step2(url){ 
    $.ajax({ 
     url: url, 
     type: 'get', 
     dataType : 'json', 
     success: function(data){ 
      console.log(data); 
     }, 
     error: function(xhr, status, error) { 
      console.log(error); 
     } 
    }); 
} 
step1(); 
}); 

Ich habe versucht, ajaxSetup (Header setzen), hilft nicht. Ich habe versucht, Kopfzeilen: {'Access-Control-Allow-Origin': '*'}. Ich habe crossDomain versucht: wahr. Ich habe versucht, dataType zu entfernen: 'json'.

Wie gesagt, das treibt mich langsam in den Wahnsinn. Vor allem, weil das das einzige ist, was mich daran hindert weiterzumachen und daran zu arbeiten, die Antwort zu präsentieren. Und es ist so nah, ich bekomme immer diesen Fehler, egal was ich mache. Ich habe mehrere Artikel über CORS, Access-Control-Allow-Origin in Kopfzeilen gelesen. Ich verstehe immer noch nicht, WARUM ich diesen Fehler bekomme.

Jede Hilfe hier wird sehr geschätzt!/verzweifelt

Answer 1

Ich muss zugeben, ich bin immer noch ein wenig verwirrt über die gesamte CORS/Access-Control-Allow-Origin mit AJAX (nach meinem Verständnis ist dies ein Ergebnis der Client-Seite mit jQuery aufrufen. Ie weil die serverseitige Domain nicht mehr "im Spiel" ist). Aber ich habe es endlich mit einem PHP-Proxy zum Laufen gebracht. Dies ist, was ich (für meine eigene Notation, und jeder andere, der mit den gleichen Problemen kämpft) endete.

HINWEIS! Der "Schlüssel" -Teil ist spezifisch für meine eigenen Bedürfnisse hier (ich wollte nur den Code im Ganzen für jeden vorstellen, der zu all dem neu sein könnte). Das Problem, das hier gelöst wird, ist der Proxy-Teil, der den Aufruf serverseitig macht und die Anfrage mit korrekten Headern sendet.

jQuery/AJAX

$(document).ready(function() { 
    function step1(){ 
     $.ajax({ 
      url: 'key.php', //get the API key. Remember to check path for key 
      method: 'get', 
      dataType : 'json', 
      success: function(data){ 
       step2(data.key); //start step2 and send the key 
      }, 
      error: function(jqhxr, status, error) { 
       console.log(error); 
      } 
     }); 
    } 
    function step2(key){ 
     var apiCall = '[APIURL]'; 
     $.ajax({ 
      beforeSend: function(jqxhr, settings) { //send request via PHP proxy. Remember to check path for proxy 
       settings.url = 'proxy.php?r=' + encodeURIComponent(settings.url); 
      }, 
      url: apiCall, 
      type: 'get', 
      dataType : 'json', 
      data: { 
       apikey: key 
      }, 
      success: function(data){ 
       // do something with response 
      }, 
      error: function(xhr, status, error) { 
       console.log(error); 
      } 
     }); 
    } 
    step1(); //initiate everything 
}); 

PHP getKey

<?php 
    require_once('[MY_ABS_PATH_ON_SERVER]/key.php'); //Store API Key outside of public domain for security purposes 
?> 

PHP Schlüssel (außerhalb des öffentlich accessabel Ordner auf dem Server)

<?php 
    $key = '[MY_API_KEY]'; 

    $arrvars = array(
     'key' => $key 
    ); 

    echo json_encode($arrvars); 
?> 

PHP proxy

<?php 

    $url = $_GET["r"]; 

    $ch = curl_init($url); 
    $options = array(
     CURLOPT_SSL_VERIFYPEER => false, 
     CURLOPT_RETURNTRANSFER => true 
    ); 
    curl_setopt_array($ch, $options); 
    $response = curl_exec($ch); 
    curl_close($ch);  

    header("Content-Type: application/json; charset=utf-8"); 
    header("Access-Control-Allow-Headers: X-Requested-With"); 
    header("Access-Control-Allow-Methods: GET, OPTIONS"); 
    header("Access-Control-Allow-Origin: [MYDOMAIN]"); 


    echo($response); 
?> 

Ich glaube, ich brauchte nur etwas Schlaf ... Ich hatte mich zu lange blind gefühlt.