2

我有以下代码

function exista(word) {
    alert(word);
    var exists = 1;
    jQuery.ajax({
        async: false, 
        url: "http://api.wordreference.com/0.8/key/json/roen/" + word,
        dataType: 'json',
        method: "GET",
        success: function(transport) {
            if (transport.Error || transport.Response)
                exists = 0;
        }

    });
    return exists;
}

它验证字典中是否存在单词。问题是它给出了 Access-Control-Allow-Origin 错误。从我收集的信息来看，我似乎必须使用 JSONP，但我无法真正弄清楚如何使用（抱歉，我才刚刚开始学习 JavaScript 等等）。那么，对如何修改上述代码有任何想法吗？

谢谢你。

4

2 回答 2

3

你dataType应该是jsonp，而不是'json'。

更新

根据http://www.wordreference.com/docs/api.aspx：

此外，对于 JSPONp，JSON API 可以在查询字符串中采用可选的回调函数；只需将“?callback={yourCallback}”添加到 URL 的末尾。

所以 API 确实支持 JSONP。

此外，JSONP 表示“带有填充的 JSON”，因此您将收到 JSON 响应。JSONP 仅允许使用CORS。

通过将您更改dataType为jsonp：

“jsonp”：使用 JSONP 加载到 JSON 块中。添加一个额外的“？callback =？” 到 URL 的末尾以指定回调。通过将查询字符串参数“_=[TIMESTAMP]”附加到 URL 来禁用缓存，除非缓存选项设置为 true。

您可以通过使用设置指定一个来覆盖默认回调jsonpCallback。

最后，您还应该添加一个错误处理程序并设置async为true：

jQuery.ajax({
    "async": true, //cannot be false for JSONP
    "url": "http://api.wordreference.com/0.8/key/json/roen/" + word,
    "dataType": 'jsonp',
    "method": "GET",
    "error": function (jqXHR, textStatus, errorThrown) {
        //included so you can see any errors
        console.log(textStatus + ': ' + errorThrown);
    },
    "success": function (data, textStatus, jqXHR) {
        //According to API documentation
        //data will not likely contain either Error, or Response
        //so, exists will likely not change to 0
        if (data.Error || data.Response) {
            exists = 0;
        }
    }
});

更新：

错误和“需要同步”的解决方案将是Pointy之前指出的。您必须创建一个与您的脚本在同一域上运行的服务器端代理。

服务器端代理可以返回 JSONP，但坦率地说，简单地返回 JSON 或 XML 更简单，因为CORS不是问题，并且代理可以是同步的。对于 PHP 示例脚本，Yahoo! Developer Network托管一个简单代理的源代码。

对于有关服务器端 Web 服务代理的任何其他内容，您需要指定您正在使用的服务器语言（它可能更适合作为不同的问题）。

于 2013-01-13T15:55:25.463 回答
0

要使 JSONP 正常工作，您不仅需要为它编写代码，而且您的目标站点也必须期望以这种方式使用，并相应地响应请求。

如果其他站点还没有 JSONP API，并且您无法控制它，那么 JSONP 不是一个答案。您必须创建自己的服务器端代理。

编辑——根据网站，他们确实支持 JSONP。您只需要添加“？callback =？” 到 URL 的末尾。

于 2013-01-13T15:55:18.380 回答