chore(ui): use typescript

This commit is contained in:
Guanran Wang 2024-10-26 14:20:54 +08:00
parent aaaddb46ca
commit 2254ffb1d0
Signed by: nyancat
GPG key ID: 91F97D9ED12639CF
3 changed files with 189 additions and 80 deletions

12
tsconfig.json Normal file
View file

@ -0,0 +1,12 @@
{
"compilerOptions": {
"target": "es2016",
"lib": ["es2020", "dom"],
"module": "commonjs",
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"strict": true,
"skipLibCheck": true,
"rootDir": "./ui"
}
}

View file

@ -1,85 +1,97 @@
async function main() { "use strict";
const [ny4, ipsb, speedtestcn, ipapiis] = await Promise.allSettled([ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
fetchAsync("https://ip.ny4.dev/api/v1/ip"), function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
fetchAsync("https://api.ip.sb/geoip"), return new (P || (P = Promise))(function (resolve, reject) {
fetchAsync("https://api-v3.speedtest.cn/ip"), function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
fetchAsync("https://api.ipapi.is/"), function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
]); function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
if (ny4.status === "fulfilled") { });
updateDom("check-ny4-ip", ny4.value.ip); };
updateDom("check-ny4-location", [ function main() {
ny4.value.city, return __awaiter(this, void 0, void 0, function* () {
ny4.value.region, const [ny4, ipsb, speedtestcn, ipapiis] = yield Promise.allSettled([
ny4.value.country, fetchAsync("https://ip.ny4.dev/api/v1/ip"),
ny4.value.organization, fetchAsync("https://api.ip.sb/geoip"),
]); fetchAsync("https://api-v3.speedtest.cn/ip"),
} else { fetchAsync("https://api.ipapi.is/"),
updateDom("check-ny4-ip", "Fetch Failed"); ]);
updateDom("check-ny4-location", "Fetch Failed"); if (ny4.status === "fulfilled") {
console.log("Fetch failed:", ny4.reason); updateDom("check-ny4-ip", ny4.value.ip);
} updateDom("check-ny4-location", [
ny4.value.city,
if (ipsb.status === "fulfilled") { ny4.value.region,
updateDom("check-ipsb-ip", ipsb.value.ip); ny4.value.country,
updateDom("check-ipsb-location", [ ny4.value.organization,
ipsb.value.city, ]);
ipsb.value.region, }
ipsb.value.country, else {
ipsb.value.isp, updateDom("check-ny4-ip", "Fetch Failed");
]); updateDom("check-ny4-location", "Fetch Failed");
} else { console.log("Fetch failed:", ny4.reason);
updateDom("check-ipsb-ip", "Fetch Failed"); }
updateDom("check-ipsb-location", "Fetch Failed"); if (ipsb.status === "fulfilled") {
console.log("Fetch failed:", ipsb.reason); updateDom("check-ipsb-ip", ipsb.value.ip);
} updateDom("check-ipsb-location", [
ipsb.value.city,
if (speedtestcn.status === "fulfilled") { ipsb.value.region,
updateDom("check-speedtestcn-ip", speedtestcn.value.data.ip); ipsb.value.country,
updateDom("check-speedtestcn-location", [ ipsb.value.isp,
speedtestcn.value.data.city, ]);
speedtestcn.value.data.province, }
speedtestcn.value.data.country, else {
speedtestcn.value.data.isp, updateDom("check-ipsb-ip", "Fetch Failed");
]); updateDom("check-ipsb-location", "Fetch Failed");
} else { console.log("Fetch failed:", ipsb.reason);
updateDom("check-speedtestcn-ip", "Fetch Failed"); }
updateDom("check-speedtestcn-location", "Fetch Failed"); if (speedtestcn.status === "fulfilled") {
console.log("Fetch failed:", speedtestcn.reason); updateDom("check-speedtestcn-ip", speedtestcn.value.data.ip);
} updateDom("check-speedtestcn-location", [
speedtestcn.value.data.city,
if (ipapiis.status === "fulfilled") { speedtestcn.value.data.province,
updateDom("check-ipapiis-ip", ipapiis.value.ip); speedtestcn.value.data.country,
updateDom("check-ipapiis-location", [ speedtestcn.value.data.isp,
ipapiis.value.location.city, ]);
ipapiis.value.location.state, }
ipapiis.value.location.country, else {
ipapiis.value.company.name, updateDom("check-speedtestcn-ip", "Fetch Failed");
]); updateDom("check-speedtestcn-location", "Fetch Failed");
} else { console.log("Fetch failed:", speedtestcn.reason);
updateDom("check-ipapiis-ip", "Fetch Failed"); }
updateDom("check-ipapiis-location", "Fetch Failed"); if (ipapiis.status === "fulfilled") {
console.log("Fetch failed:", ipapiis.reason); 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);
}
});
} }
function fetchAsync(url) {
async function fetchAsync(url) { return __awaiter(this, void 0, void 0, function* () {
try { try {
const response = await fetch(url); const response = yield 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 yield response.json();
} catch (error) { }
console.log("Fetch error:", error); catch (error) {
throw error; console.log("Fetch error:", error);
} throw error;
}
});
} }
function updateDom(elementId, content) { function updateDom(elementId, content) {
document.getElementById(elementId).innerHTML = Array.isArray(content) document.getElementById(elementId).innerHTML = Array.isArray(content)
? content.join(", ") ? content.join(", ")
: content; : content;
} }
window.onload = main; window.onload = main;

85
ui/script.ts Normal file
View file

@ -0,0 +1,85 @@
async function main() {
const [ny4, ipsb, speedtestcn, ipapiis] = await Promise.allSettled([
fetchAsync("https://ip.ny4.dev/api/v1/ip"),
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) {
throw new Error(`HTTP error! Status: ${response.status}`);
}
return await response.json();
} catch (error) {
console.log("Fetch error:", error);
throw error;
}
}
function updateDom(elementId: string, content: string | Array<string>) {
document.getElementById(elementId)!.innerHTML = Array.isArray(content)
? content.join(", ")
: content;
}
window.onload = main;