jQuery Ajax跨站点脚本

我知道这个问题以前已经被问过(很多次)，但我似乎仍然不能正确回答。

我想在jQuery中执行AJAX请求并获得"任意"内容-例如，它可能是html, text, json, img

当我执行如下操作时，我得到了臭名昭著的结果请求的资源上没有'Access-Control-Allow-Origin'标头。因此，不允许访问源'http://mydomain.com'。

$.ajax({
            url: "http://www.pureexample.com/jquery/cross-domain-ajax.html",
            // dataType: "jsonp",
            crossDomain: true,   
            success: function (data) {
                        console.log('success');
                         console.log(data);
           },
            error: function(request, status, error) {
                    console.log('Error on request. ' + request.responseText);
                    alert('Error on request. ' + request.responseText);
                }
        });

我没有提供数据，所以我不能在服务器端做任何事情来允许跨域请求。我相信指定JSONP(注释掉)假设JSON正在返回?不管有没有，它都不能工作。

所以，底线-是否有一种"简单"的方式来跨域请求，以便我可以得到结果并插入标签(例如html到DIV)

任何帮助，或进一步的解释，都是非常感谢的。

谢谢。Rob

不久前，当使用外部web服务检索巴西的邮政编码数据(地址等)时，我遇到了这个问题。和我用了和你一样的方法。

有几点需要强调:

1) Ajax不允许安全协议差异。这意味着，如果您的页面使用安全协议(HTTPS)进行保护，那么您的浏览器将而不是允许外部服务器通过不安全的协议(HTTP)返回。(我在开发后期发现了这一点，结果是使用。net的webrequest)

2)将数据类型设置为"JSONP"不会将转换为JSON响应。它允许这样被接收。

JSONP是跨域请求接受的唯一的数据类型。您所描述的错误信息可能是由于这个原因造成的。

总结一下:

当使用ajax讨论跨域请求时，"任意"内容被限制为JSON(p)。并且接收到的数据必须是JSON。

同样，在jQuery 1.5之前，如果响应没有正确地键入JSON， 不会引发错误。

我希望我在开始开发之前就知道这些问题…在不知道从ssl层服务器请求存储在HTTP中的数据的情况下将组件上传到生产服务器是相当尴尬的. ...(尽管实际上还是可以预测的)

更多信息:http://api.jquery.com/jquery.ajax/

您需要使用Ajax-cross-origin的jQuery插件。

这个插件允许你使用jQuery.ajax()跨域。

像这样使用:

$.ajax({
    crossOrigin: true,
    url: url,
    success: function(data) {
        console.log(data);
    }
});

您可以在这里阅读更多内容:http://www.ajax-cross-origin.com/

感谢您的回复。很有帮助。我决定使用代理方法，我找到了一个简单的解决方案:http://www.paulund.co.uk/make-cross-domain-ajax-calls-with-jquery-and-php

为了便于剪切和粘贴，我在这里添加了我的代码。

我创建了一个名为crossdomain.html的文件。包括jquery库。创建以下Javascript函数:

function requestDataByProxy()
    {
        var url = "http://UrlYouWantToAcccess.html";
        var data = "url=" + url + "&parameters=1&para=2";    
        $.ajax({
            url: "our_domain_url.php",
            data: data,
            type: "POST",
            success: function(data, textStatus, jqXHR){
                console.log('Success ' + data);
                $('#jsonData').html(data);
            },
            error: function (jqXHR, textStatus, errorThrown){
                console.log('Error ' + jqXHR);
            }
        });
    }

我还在HTML中添加了一个简单的按钮和预标记来加载结果:

<button onclick="requestDataByProxy()">Request Data By Proxy</button>
<h3>Requsted Data</h3>
<pre id="jsonData"></pre>

然后，PHP文件our_domain_url.php使用cURL(确保您已启用此功能!)

<?php
//set POST variables
$url = $_POST['url'];
unset($_POST['url']);
$fields_string = "";
//url-ify the data for the POST
foreach($_POST as $key=>$value) { 
    $fields_string .= $key.'='.$value.'&'; 
}
$fields_string = rtrim($fields_string,'&');
//open connection
$ch = curl_init();
//set the url, number of POST vars, POST data
curl_setopt($ch,CURLOPT_URL,$url);
curl_setopt($ch,CURLOPT_POST,count($_POST));
curl_setopt($ch,CURLOPT_POSTFIELDS,$fields_string);
//execute post
$result = curl_exec($ch);
//close connection
curl_close($ch);
?>

对我来说，这是一个相当直接的解决方案。

希望这对其他人有帮助!

Rob

相关内容

最新更新

热门标签：