Merge pull request #58 from FarEastTZ/main

feat: add force use svg flag

.env.example

@@ -5,4 +5,5 @@ NEXT_PUBLIC_NezhaFetchInterval=5000
 NEXT_PUBLIC_ShowFlag=true
 NEXT_PUBLIC_DisableCartoon=false
 NEXT_PUBLIC_ShowTag=true
-NEXT_PUBLIC_ShowNetTransfer=false
+NEXT_PUBLIC_ShowNetTransfer=false
+NEXT_PUBLIC_ForceUseSvgFlag=false

README.md

@@ -22,6 +22,7 @@
 | NEXT_PUBLIC_DisableCartoon     | 是否禁用卡通人物                 | **默认**：false                  |
 | NEXT_PUBLIC_ShowTag            | 是否显示标签                     | **默认**：false                  |
 | NEXT_PUBLIC_ShowNetTransfer    | 是否显示流量信息                 | **默认**：false                  |
+| NEXT_PUBLIC_ForceUseSvgFlag    | 是否强制使用SVG显示旗帜          | **默认**：false                  |
 
 #### 多语言支持
 

components/ServerFlag.tsx

@@ -1,10 +1,19 @@
 import getUnicodeFlagIcon from "country-flag-icons/unicode";
 import { useEffect, useState } from "react";
+import { env } from "next-runtime-env";
 
 export default function ServerFlag({ country_code }: { country_code: string }) {
   const [supportsEmojiFlags, setSupportsEmojiFlags] = useState(false);
 
+  const useSvgFlag = env("NEXT_PUBLIC_ForceUseSvgFlag") === "true";
+
   useEffect(() => {
+    if (useSvgFlag) {
+      // 如果环境变量要求直接使用 SVG，则无需检查 Emoji 支持
+      setSupportsEmojiFlags(false); 
+      return;
+    }
+
     const checkEmojiSupport = () => {
       const canvas = document.createElement("canvas");
       const ctx = canvas.getContext("2d");
@@ -20,7 +29,7 @@ export default function ServerFlag({ country_code }: { country_code: string }) {
     };
 
     checkEmojiSupport();
-  }, []);
+  }, [useSvgFlag]); // 将 `useSvgFlag` 作为依赖，当其变化时重新触发
 
   if (!country_code) return null;
 
@@ -30,11 +39,11 @@ export default function ServerFlag({ country_code }: { country_code: string }) {
 
   return (
     <span className="text-[12px] text-muted-foreground">
-      {!supportsEmojiFlags ? (
+      {useSvgFlag || !supportsEmojiFlags ? (
         <span className={`fi fi-${country_code}`}></span>
       ) : (
         getUnicodeFlagIcon(country_code)
       )}
     </span>
   );
-}
+}

docker/.env.example

@@ -5,4 +5,5 @@ NEXT_PUBLIC_NezhaFetchInterval=5000
 NEXT_PUBLIC_ShowFlag=true
 NEXT_PUBLIC_DisableCartoon=false
 NEXT_PUBLIC_ShowTag=true
-NEXT_PUBLIC_ShowNetTransfer=false
+NEXT_PUBLIC_ShowNetTransfer=false
+NEXT_PUBLIC_ForceUseSvgFlag=false