0

我正在尝试使用 IPInfoDB 来获取应用程序中的 IP 地理位置,但我遇到了无法解决的问题。我创建了一个 HTML 文件并完成了从 IPInfoDB 获取信息的非常基本的要求,它工作正常。当我尝试在应用程序中运行完全相同的代码时,它在第一次尝试时在控制台中给出错误“加载资源失败”,然后在此之后的任何尝试都会引发指向第 8516 行的 jquery 文件的 GET 错误(开发人员版本jquery-1.10.2.js)。任何帮助将不胜感激。下面是在 html 文件中完美运行但在应用程序内部引发错误的代码。

<!DOCTYPE html>
<html>
<head>

<style>
.IPinfoTableDiv
{
    width:900px;
    margin:auto;
}
.IPinfoTable
{
    width:100%;
}
table thead tr td, table tbody tr td
{
    border: solid 1px lightgrey;
}
</style>

<script src="jquery-1.10.2.js"></script>

<script>
var geoLocationUrl = 'http://api.ipinfodb.com/v3/ip-city/?key=MyKey&format=json';

$(document).ready(function() 
{
function handleData(data)
{
    var newTR = $("<tr/>")
    .append($('<td/>').text(data.cityName))
    .append($('<td/>').text(data.countryCode))
    .append($('<td/>').text(data.countryName))
    .append($('<td/>').text(data.ipAddress))
    .append($('<td/>').text(data.latitude))
    .append($('<td/>').text(data.longitude))
    .append($('<td/>').text(data.regionName))
    .append($('<td/>').text(data.timeZone))
    .append($('<td/>').text(data.zipCode));

    $("#IPInfoBody").append(newTR);
}

jQuery.ajax(
{
    type : 'GET',
    url : geoLocationUrl,
    crossDomain: true,
    dataType : 'jsonp',
    success : function(data)
    {
        console.log("Success");
        console.log(data);
        handleData(data);
    }
});
});
</script>
</head>
<body>
<div class="IPinfoTableDiv">
<table>
    <thead>
        <tr>
            <td>City</td>
            <td>Country Code</td>
            <td>Country Name</td>
            <td>IP Address</td>
            <td>Latitude</td>
            <td>Longitude</td>
            <td>Region</td>
            <td>Time Zone</td>
            <td>Zipcode</td>
        </tr>
    </thead>
    <tbody id="IPInfoBody">
    </tbody>
</table>
</div>
</body>
</html>

我注意到我第一次尝试在应用程序中加载页面时,它会抛出“加载资源失败”,它会提供一个链接,当打开该链接时,会显示我想要使用的 JSON。附上图片来显示我在说什么。

初始失败与链接: 初始失败

单击链接会显示我想要的 JSON: JSON链接

如果我多次尝试,指向 jquery 文件第 8516 行的 GET 错误: 在此处输入图像描述

我正在阅读 JSONP 并且无法理解它。我读过一些关于它返回包装在函数中的数据的内容,这就是我假设第二张图片中链接中的内容。我不确定为什么普通的 HTML 页面可以正常工作,但应用程序在初始尝试时无法加载资源,然后只是出现指向 jQuery 的 GET 错误。该应用程序位于使用 tomcat 服务的 eclipse 环境中。

更新:在 Firefox 中,它工作正常(在应用程序中也是如此)。在谷歌浏览器中,没有那么多。我将对此进行更多研究,看看我是否可以确定原因并相应地进行更新。

更新 2:所以我在 Firefox 和 IE(10) 中进行了测试,这两个都没有问题。它似乎是特定于 Chrome 的。即使使用 Kevin B 发布的 jsfiddle,问题也只发生在 chrome 中。

4

1 回答 1

0

问题最终是 AdBlock Plus 扩展因某种原因阻止了 JSONP 的加载。禁用 AdBlock Plus 后,Chrome 中的一切正常。

于 2013-10-30T20:51:06.243 回答