Question

我写了一个脚本，通过Prototype的AJAX方法调查Twitter，抓取JSON结果，篡改它们然后用格式化的推文更新div。一切都运行良好的测试（在OS 10.6.1机器上的Safari 4.0.3），直到我将脚本加载到服务器上，它失败了。该脚本包含所有客户端项目并引用相同的Prototype.js文件，因此我无法弄清楚它为什么在本地工作但不是远程工作。

我将脚本剥离到其裸露的本质 - 只需将我的时间轴上的最新推文返回到警告框中 - 并以上述相同的方式工作/中断，以及在Firefox中。我确定我犯了一个愚蠢的错误，但找不到我的方式的错误。

这是我的整个页面。在本地工作，而不是在服务器或Firefox中：

<!DOCTYPE html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Test</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.2/prototype.js"></script>


    <script type="text/javascript" charset="utf-8">
    document.observe("dom:loaded", function(){
        var tweetAddress = "http://twitter.com/status/user_timeline/hellbox.json?count=1";
        new Ajax.Request( tweetAddress, { 
            method: 'get',
            onSuccess: function (transport) {
                var tweets = transport.responseText.evalJSON();
                alert(tweets[0].text);
            }
        });
    });
    </script> 
</head>
<body> 
</body>
</html>

Answer 1

你正在触及“同源政策”墙。您无法从另一个域加载的页面向twitter.com执行AJAX请求。

尝试JSONP而不是JSON：

http://jquery-howto.blogspot.com/2009/04/twitter-jsonjsonp-api-url.html

使用JSON，<script>标记将被注入到您的页面中，随后，加载的脚本将调用回调函数。从外部域加载脚本没有域名限制。

Answer 2

如果我没有记错，您正在尝试向twitter.com域发出Ajax请求。

如果您的应用程序本身未托管在该twitter.com域上，则无法向其发出Ajax请求：您只能向托管应用程序的域执行Ajax请求。

这意味着如果您的网站位于“www.mydomain.com”，则只能向“www.mydomain.com”发送Ajax请求。
不是“test.mydomain.com”也不是“www.anotherdomain.com”

这是因为在网络浏览器中实施了一项安全限制，称为Same Origin Policy （引用）：

策略允许运行脚本来自同一网站的网页访问彼此的方法和属性没有具体限制 - 但阻止访问大多数方法和属性不同网站上的网页。

该问题的可能解决方案可能是在您自己的域上使用代理，该代理将代理到twitter.com;这样，您的网站就可以向您的域发送查询，而这些查询实际上会重新发送到Twitter; SOP没问题，这样。

作为旁注，当你说“它在本地工作”时：你是说你的本地机器上有一个网络服务器，它是从该服务器提供的吗？在这种情况下它不应该有效。

你的意思是“在浏览器的地址栏中用文件：//.../myfile.html”在本地打开文件 - 好吧，也许Safari没有本地文档的同源策略？
（不确定 - 只是一种可能性）

简单的AJAX JS在Safari本地工作正常，在服务器和Firefox中失败（evalJSON（）问题）？

2 个答案: