时间戳

首页 > 解决方案 > 如何在 JavaScript 中发送和请求 HTTP 方法？

javascript - 如何在 JavaScript 中发送和请求 HTTP 方法？

问题描述

我正在尝试根据 IP 地址访问一些信息，并希望使用 JavaScript 在我的网页中显示它。我正在根据 IP 地址获取数据，但是当我尝试使用 JavaScript 执行此操作时，我没有收到任何错误，同时没有输出。

下面我发布我的代码。请给我一些关于此的有价值的信息，并尝试更正我的代码。

<!DOCTYPE html>
<html>
<head>
    <title>JS Get Request</title>
</head>
<body>
<center>JavaScript Get Request Test</center>

statusCode : <p id="statusCode"></p><br/>
stausMessage : <p id="statusMessage"></p><br/>
ipAddress : <p id="ipAddress"></p><br/>
countryCode : <p id="countryCode"></p><br/>
countryName : <p id="countryName"></p><br/>
regionName : <p id="regionName"></p><br/>
cityName : <p id="cityName"></p><br/>
zipCode : <p id="zipCode"></p><br/>
latitude : <p id="latitude"></p><br/>

<script type="text/javascript">
    var HttpClient = function(){
        this.get = function(aUrl, aCallback){
            var anHttpRequest = new XMLHttpRequest();
            anHttpRequest.onreadystatechange = function() {
                if(anHttpRequest.readyState == 4 && anHttpRequest.status ==200)
                    aCallback(anHttpRequest.responseText);
            }

            anHttpRequest.open("GET", aUrl, true);
            anHttpRequest.send(null);
        }
    }
    var theurl = 'http://api.ipinfodb.com/v3/ip-city/?key=c7b0a48b0232ec3a0154bac3af7707170dd8268116543d6719262d49724bfc38&ip=106.51.76.69&format=json';
    var client = new HttpClient();
    client.get(theurl, function(resonse){
        var response1 = JSON.parse(response);
        //alert(response);
        });

    document.getElementById("statusCode").innerHTML = response1.statusCode;
    document.getElementById("statusMessage").innerHTML = response1.statusMessage;
    document.getElementById("ipAddress").innerHTML = response1.ipAddress;
    document.getElementById("countryCode").innerHTML = response1.countryCode;
    document.getElementById("countryName").innerHTML = response1.countryName;
    document.getElementById("regionName").innerHTML = response1.regionName;
    document.getElementById("cityName").innerHTML = response1.cityName;
    document.getElementById("zipCode").innerHTML = response1.zipCode;
    document.getElementById("latitude").innerHTML = response1.latitude;

</script>
</body>
</html>

标签： javascripthtml

解决方案

这是一个有效的示例jsFiddle：https ://jsfiddle.net/nsqpv5rr/单击运行以获取
您有2个错误的数据：
1-错字响应<=>响应，
2-移动所有document.getElementById ....在客户端内。 get(theurl, function(response){...} 这应该可以工作：

<!DOCTYPE html>
<html>
<head>
    <title>JS Get Request</title>
</head>
<body>
<center>JavaScript Get Request Test</center>
<button  onClick="test()">run</button><br>

statusCode : <p id="statusCode"></p><br/>
stausMessage : <p id="statusMessage"></p><br/>
ipAddress : <p id="ipAddress"></p><br/>
countryCode : <p id="countryCode"></p><br/>
countryName : <p id="countryName"></p><br/>
regionName : <p id="regionName"></p><br/>
cityName : <p id="cityName"></p><br/>
zipCode : <p id="zipCode"></p><br/>
latitude : <p id="latitude"></p><br/>

<script type="text/javascript">
    var HttpClient = function(){
        this.get = function(aUrl, aCallback){
            var anHttpRequest = new XMLHttpRequest();
            anHttpRequest.onreadystatechange = function() {
                if(anHttpRequest.readyState == 4 && anHttpRequest.status ==200)
                    aCallback(anHttpRequest.responseText);
            }

            anHttpRequest.open("GET", aUrl, true);
            anHttpRequest.send(null);
        }
    }
    var theurl = 'http://api.ipinfodb.com/v3/ip-city/?key=c7b0a48b0232ec3a0154bac3af7707170dd8268116543d6719262d49724bfc38&ip=106.51.76.69&format=json';
    function test(){ 
    var client = new HttpClient();
    client.get(theurl, function(response){
        var response1 = JSON.parse(response);
         document.getElementById("statusCode").innerHTML = response1.statusCode;
    document.getElementById("statusMessage").innerHTML = response1.statusMessage;
    document.getElementById("ipAddress").innerHTML = response1.ipAddress;
    document.getElementById("countryCode").innerHTML = response1.countryCode;
    document.getElementById("countryName").innerHTML = response1.countryName;
    document.getElementById("regionName").innerHTML = response1.regionName;
    document.getElementById("cityName").innerHTML = response1.cityName;
    document.getElementById("zipCode").innerHTML = response1.zipCode;
    document.getElementById("latitude").innerHTML = response1.latitude;
        });


}
</script>
</body>
</html>

推荐阅读