chore(ui): use typescript
This commit is contained in:
parent
aaaddb46ca
commit
2254ffb1d0
3 changed files with 189 additions and 80 deletions
12
tsconfig.json
Normal file
12
tsconfig.json
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"target": "es2016",
|
||||||
|
"lib": ["es2020", "dom"],
|
||||||
|
"module": "commonjs",
|
||||||
|
"esModuleInterop": true,
|
||||||
|
"forceConsistentCasingInFileNames": true,
|
||||||
|
"strict": true,
|
||||||
|
"skipLibCheck": true,
|
||||||
|
"rootDir": "./ui"
|
||||||
|
}
|
||||||
|
}
|
172
ui/script.js
172
ui/script.js
|
@ -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
85
ui/script.ts
Normal 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;
|
Loading…
Reference in a new issue