diff --git a/src/components/CheckItem.tsx b/src/components/CheckItem.tsx index 7b5ef14..1a6318b 100644 --- a/src/components/CheckItem.tsx +++ b/src/components/CheckItem.tsx @@ -12,7 +12,7 @@ const icon = { ok: ( ), loading: , @@ -25,13 +25,13 @@ const icon = { error: ( ), } -export default function CheckItem({ url, content }: CheckItemProps) { - const { data, error, isLoading } = useSWRImmutable(url, fetcher) +export default function CheckItem({ name, url, content }: CheckItemProps) { + const { data, error, isLoading } = useSWRImmutable(url, fetcher) return ( <> @@ -44,7 +44,17 @@ export default function CheckItem({ url, content }: CheckItemProps) { ? icon[content(data).state] : null} - {data != undefined ? {content(data).text} : null} +
+ {name} + + + {data != undefined + ? content(data).text + : error != null + ? `无法获取: ${error.name}` + : null} + +
) diff --git a/src/components/Checker.tsx b/src/components/Checker.tsx index a896475..0777910 100644 --- a/src/components/Checker.tsx +++ b/src/components/Checker.tsx @@ -4,22 +4,37 @@ import { CheckItemType } from "@/types/CheckItem" const checkList: CheckItemType[] = [ { + name: "公网 IPv6 地址", url: "https://6.ipv6test.online/ip/myip", content: (data) => { - const isIPv6 = data?.version == 6 + const success = data?.version == 6 return { - state: isIPv6 ? "ok" : "error", - text: "公网 IPv6 地址: " + (isIPv6 ? `${data?.address}` : "未检测到"), + state: success ? "ok" : "error", + text: (success ? `${data?.address}` : "未检测到"), } }, }, { + name: "公网 IPv4 地址", url: "https://4.ipv6test.online/ip/myip", content: (data) => { - const isIPv4 = data?.version == 4 + const success = data?.version == 4 return { - state: isIPv4 ? "ok" : "error", - text: "公网 IPv4 地址: " + (isIPv4 ? `${data?.address}` : "未检测到"), + state: success ? "ok" : "error", + text: (success ? `${data?.address}` : "未检测到"), + } + }, + }, + { + name: "双协议栈测试", + url: "https://test.ipv6test.online/ip/myip", + content: (data) => { + const isIPv6 = data?.version == 6 + const isIPv4 = data?.version == 4 + + return { + state: isIPv6 ? "ok" : "error", + text: isIPv6 ? "你的网络IPv6访问优先" : isIPv4 ? "你的网络IPv4访问优先" : "未检测到", } }, }, @@ -29,7 +44,7 @@ export default function Checker() { return ( <> {checkList.map((item, i) => { - return + return })} ) diff --git a/src/types/CheckItem.ts b/src/types/CheckItem.ts index 40d84c8..9202268 100644 --- a/src/types/CheckItem.ts +++ b/src/types/CheckItem.ts @@ -1,4 +1,5 @@ export interface CheckItemType { + name: string url: string content: (data: any) => {state: CheckItemIconState, text: string} }