From 5d45b53bd404d368c86e052850b90cefbb10d7d5 Mon Sep 17 00:00:00 2001 From: Dnomd343 Date: Thu, 22 Apr 2021 22:39:26 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E4=BA=86ui=E6=A0=B7=E5=BC=8F?= =?UTF-8?q?,=E4=BC=98=E5=8C=96ajax=E8=BF=87=E7=A8=8B=E8=BF=94=E5=9B=9E,?= =?UTF-8?q?=E8=A7=A3=E5=86=B3=E4=BA=86=E5=9C=B0=E5=9B=BE=E6=97=A0=E6=B3=95?= =?UTF-8?q?=E7=A7=BB=E5=8A=A8=E7=9A=84bug?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- assets/js/main.js | 26 ++++++-- assets/js/main.min.js | 2 +- backend/queryInfo.php | 15 +++-- index.html | 152 +++++++++++++++++++++++------------------- 4 files changed, 115 insertions(+), 80 deletions(-) diff --git a/assets/js/main.js b/assets/js/main.js index fd7cf32..a05a3b7 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -1,23 +1,32 @@ -$(document).ready(function() { - $.get("/ip", function(data) { +$(document).ready(function () { + $.get("/ip", function (data) { $("#ip_default").val(data); getInfo(); }); $("table").hide(); - $("button").click(function() { + $("button").click(function () { $("button").text("Searching..."); $("table").hide(1000); getInfo(); }); }); - +$(document).keydown(function (event) { + if (event.keyCode == 13) { + $("button").click(); + } +}); function getInfo() { - $.get("/info/" + $("input").val(), function(data) { - console.log(data); + $.get("/info/" + $("input").val(), function (data) { + if (data.status == "F") { + $("button").text("Illegal IP"); + $("button").css({ 'border-color': '#ff406f', 'background-color': '#ff406f' }); + return 0; + } if (!$("input").val()) { $("input").val(data.ip); } $("button").text("Search"); + $("button").css({ 'border-color': '', 'background-color': '' }); $("table").show(1000); $("#ip").text(data.ip); $("#as").text(data.as); @@ -25,11 +34,14 @@ function getInfo() { $("#region").text(data.region); $("#country").text(data.country); $("#timezone").text(data.timezone); - $("#loc").text(data.loc); + var earth = "https://earth.google.com/web/@" + data.loc + ",0a,398836d,1y,0h,0t,0r"; + $("#loc").html('' + data.loc + ''); $("#isp").text(data.isp); $("#scope").text(data.scope); $("#detail").text(data.detail); draw(parseFloat(data.loc.split(',')[0]), parseFloat(data.loc.split(',')[1])); + + }); } diff --git a/assets/js/main.min.js b/assets/js/main.min.js index 37ddd93..9501fe1 100644 --- a/assets/js/main.min.js +++ b/assets/js/main.min.js @@ -1 +1 @@ -function getInfo(){$.get("/info/"+$("input").val(),(function(data){console.log(data),$("input").val()||$("input").val(data.ip),$("button").text("Search"),$("table").show(1e3),$("#ip").text(data.ip),$("#as").text(data.as),$("#city").text(data.city),$("#region").text(data.region),$("#country").text(data.country),$("#timezone").text(data.timezone),$("#loc").text(data.loc),$("#isp").text(data.isp),$("#scope").text(data.scope),$("#detail").text(data.detail),draw(parseFloat(data.loc.split(",")[0]),parseFloat(data.loc.split(",")[1]))}))}function draw(x,y){var map=new mapboxgl.Map({container:"map",style:"mapbox://styles/mapbox/streets-v11",center:[y,x],zoom:3}),size=100,pulsingDot={width:100,height:100,data:new Uint8Array(4e4),onAdd:function(){var canvas=document.createElement("canvas");canvas.width=this.width,canvas.height=this.height,this.context=canvas.getContext("2d")},render:function(){var duration=1e3,t=performance.now()%1e3/1e3,radius=15,outerRadius=35*t+15,context=this.context;return context.clearRect(0,0,this.width,this.height),context.beginPath(),context.arc(this.width/2,this.height/2,outerRadius,0,2*Math.PI),context.fillStyle="rgba(255, 200, 200,"+(1-t)+")",context.fill(),context.beginPath(),context.arc(this.width/2,this.height/2,15,0,2*Math.PI),context.fillStyle="rgba(255, 100, 100, 1)",context.strokeStyle="white",context.lineWidth=2+4*(1-t),context.fill(),context.stroke(),this.data=context.getImageData(0,0,this.width,this.height).data,map.triggerRepaint(),!0}};map.on("load",(function(){map.addImage("pulsing-dot",pulsingDot,{pixelRatio:2}),map.addLayer({id:"points",type:"symbol",source:{type:"geojson",data:{type:"FeatureCollection",features:[{type:"Feature",geometry:{type:"Point",coordinates:[y,x]}}]}},layout:{"icon-image":"pulsing-dot"}})}))}$(document).ready((function(){$.get("/ip",(function(data){$("#ip_default").val(data),getInfo()})),$("table").hide(),$("button").click((function(){$("button").text("Searching..."),$("table").hide(1e3),getInfo()}))})),mapboxgl.accessToken="pk.eyJ1Ijoic2hldm9ua3VhbiIsImEiOiJja20yMjlnNDYybGg2Mm5zNW40eTNnNnUwIn0.6xj6sgjWvdQgT_7OQUy_Jg"; \ No newline at end of file +function getInfo(){$.get("/info/"+$("input").val(),(function(data){if("F"==data.status)return $("button").text("Illegal IP"),$("button").css({"border-color":"#ff406f","background-color":"#ff406f"}),0;$("input").val()||$("input").val(data.ip),$("button").text("Search"),$("button").css({"border-color":"","background-color":""}),$("table").show(1e3),$("#ip").text(data.ip),$("#as").text(data.as),$("#city").text(data.city),$("#region").text(data.region),$("#country").text(data.country),$("#timezone").text(data.timezone);var earth="https://earth.google.com/web/@"+data.loc+",0a,398836d,1y,0h,0t,0r";$("#loc").html("'+data.loc+""),$("#isp").text(data.isp),$("#scope").text(data.scope),$("#detail").text(data.detail),draw(parseFloat(data.loc.split(",")[0]),parseFloat(data.loc.split(",")[1]))}))}function draw(x,y){var map=new mapboxgl.Map({container:"map",style:"mapbox://styles/mapbox/streets-v11",center:[y,x],zoom:3}),size=100,pulsingDot={width:100,height:100,data:new Uint8Array(4e4),onAdd:function(){var canvas=document.createElement("canvas");canvas.width=this.width,canvas.height=this.height,this.context=canvas.getContext("2d")},render:function(){var duration=1e3,t=performance.now()%1e3/1e3,radius=15,outerRadius=35*t+15,context=this.context;return context.clearRect(0,0,this.width,this.height),context.beginPath(),context.arc(this.width/2,this.height/2,outerRadius,0,2*Math.PI),context.fillStyle="rgba(255, 200, 200,"+(1-t)+")",context.fill(),context.beginPath(),context.arc(this.width/2,this.height/2,15,0,2*Math.PI),context.fillStyle="rgba(255, 100, 100, 1)",context.strokeStyle="white",context.lineWidth=2+4*(1-t),context.fill(),context.stroke(),this.data=context.getImageData(0,0,this.width,this.height).data,map.triggerRepaint(),!0}};map.on("load",(function(){map.addImage("pulsing-dot",pulsingDot,{pixelRatio:2}),map.addLayer({id:"points",type:"symbol",source:{type:"geojson",data:{type:"FeatureCollection",features:[{type:"Feature",geometry:{type:"Point",coordinates:[y,x]}}]}},layout:{"icon-image":"pulsing-dot"}})}))}$(document).ready((function(){$.get("/ip",(function(data){$("#ip_default").val(data),getInfo()})),$("table").hide(),$("button").click((function(){$("button").text("Searching..."),$("table").hide(1e3),getInfo()}))})),$(document).keydown((function(event){13==event.keyCode&&$("button").click()})),mapboxgl.accessToken="pk.eyJ1Ijoic2hldm9ua3VhbiIsImEiOiJja20yMjlnNDYybGg2Mm5zNW40eTNnNnUwIn0.6xj6sgjWvdQgT_7OQUy_Jg"; \ No newline at end of file diff --git a/backend/queryInfo.php b/backend/queryInfo.php index 3abb6e5..3811c5b 100644 --- a/backend/queryInfo.php +++ b/backend/queryInfo.php @@ -74,7 +74,8 @@ function getIPInfo($ip) { $cli .= "Detail: ".$info['detail'] . PHP_EOL; return $cli; } - + + $info['status'] = 'T'; header('Content-Type: application/json; charset=utf-8'); // 以JSON格式发送 return json_encode($info); } @@ -116,12 +117,18 @@ function tryCIDR($beginIP, $endIP) { // 给定IP范围，尝试计算CIDR function main() { $ip = $_GET['ip']; if (!filter_var($ip, \FILTER_VALIDATE_IP)) { // 输入IP不合法 - echo "Illegal IP format".PHP_EOL; + if ($_GET['cli'] == "true") { + echo "Illegal IP format" . PHP_EOL; + } else { + header('Content-Type: application/json; charset=utf-8'); + $reply = array(); + $reply['status'] = 'F'; + $reply['message'] = 'Illegal IP format'; + echo json_encode($reply); + } exit; } echo getIPInfo($ip); } main(); - -?> diff --git a/index.html b/index.html index 5c76c08..6304eca 100644 --- a/index.html +++ b/index.html @@ -32,86 +32,102 @@ margin-top: 0px; margin-bottom: 20px; } + + .positioncontrol { + position: absolute; + left: calc(100vw*0.8 - 190px); + } + + @media screen and (max-width: 600px) { + .positioncontrol { + position: absolute; + left: 0; + right: 0; + } + } + + a { + text-decoration: none; + }
-
-
-
-
-

echoIP

-
-
-
-
- -
-
+
+
+

echoIP

+
+
+
+
+
-
-
-
- -
-
+
+
+
+
+
+
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
IP - - -
AS - - -
City - - -
Region - - -
Country - - -
Timezone - - -
Location - - -
ISP
Scope
Detail
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
IP + + +
AS + + +
City + + +
Region + + +
Country + + +
Timezone + + +
Location + + +
ISP
Scope
Detail
+