Question

好的，我已经在这几个小时了！我已经阅读了关于这个主题的所有可以想到的链接，但我仍然无法让它工作，这让我慢慢疯了。

我正在制作一个AJAX请求（从我的域名）到一个API（在另一个域上），但我不断回到控制台日志中（显然我已经修改了排除任何域名等）：

XMLHttpRequest无法加载https://[APIPROVIDER]/something.json?options。请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许原点“http://[MYDOMAIN].com”访问。

这是我的代码

$(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();
});

我试过，ajaxSetup（设置标题），没有帮助。我试过了，标题：{'Access-Control-Allow-Origin'：'*'}。我尝试过crossDomain：true。我试过删除dataType：'json'。

像我说的那样，这慢慢让我发疯。主要是因为这是阻止我继续前进并处理呈现响应的唯一因素。而且它如此接近，我只是不断得到那个错误，无论我做什么。我在头文件中读过几篇关于CORS，Access-Control-Allow-Origin的文章。我仍然不明白为什么我会收到这个错误。

非常感谢任何帮助！ /绝望

Answer 1

我不得不承认，我仍然对使用AJAX的整个CORS / Access-Control-Allow-Origin感到有点困惑（据我所知，这是使用jQuery进行客户端调用的结果。即因为服务器 - 域名不再“在游戏中”）。但我终于使用PHP代理工作了。这就是我最终得到的结果（对于我自己的符号，以及其他任何在同样问题上苦苦挣扎的人）。

注意！“关键”部分特定于我自己的需求（我只是想为所有可能是新手的人提供完整的代码）。即，这里解决的问题是代理部分，使呼叫服务器端和发送请求的头部正确。

的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密钥（服务器上公共accessabel文件夹之外）

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

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

    echo json_encode($arrvars);
?>

PHP代理

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

我想我只是需要一些睡眠......我一直盯着自己看这个很长时间。

Ajax API调用Access-Control-Allow-Origin。原产地不允许访问

1 个答案: