nyancat/ip-checker
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore(ui): refactor js again

Browse source
This commit is contained in:
Guanran Wang 2024-10-27 12:28:54 +08:00
parent 503aedbf37
commit ebbd49cce5
Signed by: nyancat
GPG key ID: 91F97D9ED12639CF
1 changed files with 69 additions and 78 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

145
ui/src/main.ts
View file

@ -1,85 +1,76 @@
async function main() { async function main() {
const [ny4, ipsb, speedtestcn, ipapiis] = await Promise.allSettled([ fetch("https://ip.ny4.dev/api/v1/ip")
fetchAsync("https://ip.ny4.dev/api/v1/ip"), .then((response) => {
fetchAsync("https://api.ip.sb/geoip"),
fetchAsync("https://api-v3.speedtest.cn/ip"),
fetchAsync("https://api.ipapi.is/"),
]);
if (ny4.status === "fulfilled") {
updateDom("check-ny4-ip", ny4.value.ip);
updateDom("check-ny4-location", [
ny4.value.city,
ny4.value.region,
ny4.value.country,
ny4.value.organization,
]);
} else {
updateDom("check-ny4-ip", "Fetch Failed");
updateDom("check-ny4-location", "Fetch Failed");
console.log("Fetch failed:", ny4.reason);
}
if (ipsb.status === "fulfilled") {
updateDom("check-ipsb-ip", ipsb.value.ip);
updateDom("check-ipsb-location", [
ipsb.value.city,
ipsb.value.region,
ipsb.value.country,
ipsb.value.isp,
]);
} else {
updateDom("check-ipsb-ip", "Fetch Failed");
updateDom("check-ipsb-location", "Fetch Failed");
console.log("Fetch failed:", ipsb.reason);
}
if (speedtestcn.status === "fulfilled") {
updateDom("check-speedtestcn-ip", speedtestcn.value.data.ip);
updateDom("check-speedtestcn-location", [
speedtestcn.value.data.city,
speedtestcn.value.data.province,
speedtestcn.value.data.country,
speedtestcn.value.data.isp,
]);
} else {
updateDom("check-speedtestcn-ip", "Fetch Failed");
updateDom("check-speedtestcn-location", "Fetch Failed");
console.log("Fetch failed:", speedtestcn.reason);
}
if (ipapiis.status === "fulfilled") {
updateDom("check-ipapiis-ip", ipapiis.value.ip);
updateDom("check-ipapiis-location", [
ipapiis.value.location.city,
ipapiis.value.location.state,
ipapiis.value.location.country,
ipapiis.value.company.name,
]);
} else {
updateDom("check-ipapiis-ip", "Fetch Failed");
updateDom("check-ipapiis-location", "Fetch Failed");
console.log("Fetch failed:", ipapiis.reason);
}
}
async function fetchAsync(url: string) {
try {
const response = await fetch(url);
if (!response.ok) { if (!response.ok) {
throw new Error(`HTTP error! Status: ${response.status}`); throw new Error(`HTTP error! Status: ${response.status}`);
} }
return await response.json(); return response.json();
} catch (error) { })
console.log("Fetch error:", error); .then((data) => {
throw error; document.getElementById("check-ny4-ip")!.innerHTML = data.ip;
} document.getElementById("check-ny4-location")!.innerHTML = [
} data.city,
data.region,
data.country,
data.organization,
].join(", ");
})
.catch((error) => console.log("Error fetching IP SB data:", error));
function updateDom(elementId: string, content: string | Array<string>) { fetch("https://api.ip.sb/geoip")
document.getElementById(elementId)!.innerHTML = Array.isArray(content) .then((response) => {
? content.join(", ") if (!response.ok) {
: content; throw new Error(`HTTP error! Status: ${response.status}`);
}
return response.json();
})
.then((data) => {
document.getElementById("check-ipsb-ip")!.innerHTML = data.ip;
document.getElementById("check-ipsb-location")!.innerHTML = [
data.city,
data.region,
data.country,
data.isp,
].join(", ");
})
.catch((error) => console.log("Error fetching IP SB data:", error));
fetch("https://api.ipapi.is/")
.then((response) => {
if (!response.ok) {
throw new Error(`HTTP error! Status: ${response.status}`);
}
return response.json();
})
.then((data) => {
document.getElementById("check-ipapiis-ip")!.innerHTML = data.ip;
document.getElementById("check-ipapiis-location")!.innerHTML = [
data.location.city,
data.location.state,
data.location.country,
data.company.name,
].join(", ");
})
.catch((error) => console.log("Error fetching IP API IS data:", error));
fetch("https://api-v3.speedtest.cn/ip")
.then((response) => {
if (!response.ok) {
throw new Error(`HTTP error! Status: ${response.status}`);
}
return response.json();
})
.then((data) => {
const v = data.data;
document.getElementById("check-speedtestcn-ip")!.innerHTML = v.ip;
document.getElementById("check-speedtestcn-location")!.innerHTML = [
v.city,
v.province,
v.country,
v.isp,
].join(", ");
})
.catch((error) => console.log("Error fetching Speedtest CN data:", error));
} }
window.onload = main; window.onload = main;