npm - vite-plugin-sw-offline - Versions diffs - 1.0.2 → 1.0.4 - Mend

vite-plugin-sw-offline 1.0.2 → 1.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/package.json +1 -1
package/runtime/sw.js +48 -20
package/src/index.js +20 -0
package/templates/default/offline-i18n.json +145 -0
package/templates/default/offline.html +157 -6

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-sw-offline",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "description": "Vite 插件：Service Worker、离线页模板与构建注入（适用于 Vite H5 / uni-app H5 等）",
   "main": "src/index.js",
   "files": [

package/runtime/sw.js CHANGED Viewed

@@ -96,6 +96,9 @@ const NETWORK_PROBE_URL = '__NETWORK_PROBE_URL__';
 /** 网络探测超时时间（毫秒，构建时注入） */
 const NETWORK_PROBE_TIMEOUT = __SW_RT_NETWORK_PROBE_TIMEOUT__;
+/** 离线页文案（构建时注入 JSON，与 offline.html 同源） */
+const OFFLINE_I18N = __OFFLINE_I18N_INJECT__;
 // ============================================
 // 二、工具函数
 // ============================================
@@ -216,23 +219,26 @@ async function purgeStaleApiEntries() {
   }
 }
+function stringifyOfflineI18nForInlineScript() {
+  try {
+    return JSON.stringify(OFFLINE_I18N).replace(/</g, '\\u003c');
+  } catch (e) {
+    return '{}';
+  }
+}
 /**
- * 返回离线页面
- * 优先从缓存读取完整的 offline.html，
- * 若缓存中也没有（极端情况），则返回一个内联兜底页面（文案与 offline.html 保持一致）
+ * SW 内联兜底离线页 HTML（无 search-bar；语言逻辑与 offline.html 一致）
  */
-async function getOfflineResponse() {
-  const cache = await caches.open(CACHE_NAMES.STATIC);
-  const offlineResponse = await cache.match(OFFLINE_PAGE);
-  if (offlineResponse) {
-    return offlineResponse;
-  }
-  // 内联兜底：仅在 offline.html 完全无法从缓存获取时才使用
-  // 注意：文案和按钮需与 offline.html 保持一致，避免用户体验割裂
-  console.warn('[SW] offline.html not in cache, using inline fallback');
-  return new Response(
+function buildInlineOfflineFallbackHtml() {
+  const messagesJson = stringifyOfflineI18nForInlineScript();
+  const script =
+    '(function(){var M=' +
+    messagesJson +
+    ';var SHORT={en:"en_US",zh:"zh_CN",ja:"ja_JP",ko:"ko_KR",ar:"ar_SA",hi:"hi_IN",pt:"pt_BR",ru:"ru_RU",th:"th_TH",tr:"tr_TR",vi:"vi_VN",es:"es_MX"};function norm(s){if(!s||typeof s!=="string")return "";s=s.trim().replace(/-/g,"_");if(s.indexOf("_")===-1)return SHORT[s.toLowerCase()]||"";var i=s.indexOf("_");return s.slice(0,i).toLowerCase()+"_"+s.slice(i+1).toUpperCase();}function resolveKey(){var u="";try{u=new URLSearchParams(location.search).get("locale")||"";}catch(e){}var st="";try{var raw=localStorage.getItem("common");if(raw){var o=JSON.parse(raw);if(o&&typeof o.locale==="string")st=o.locale;}}catch(e){}return norm(u)||norm(st)||"zh_CN";}var key=resolveKey();if(!M[key])key="zh_CN";var t=M[key]||M.zh_CN;if(!t)return;document.documentElement.setAttribute("lang",key.replace("_","-"));if(key.indexOf("ar_")===0)document.documentElement.setAttribute("dir","rtl");document.title=t.title;var el=document.getElementById("oh");if(el)el.textContent=t.heading;el=document.getElementById("ob");if(el)el.textContent=t.body;el=document.getElementById("oc");if(el)el.textContent=t.contact;el=document.getElementById("or");if(el)el.textContent=t.reload;window.__offlineContactHint=t.contactOfflineHint;})();';
+  return (
     '<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">' +
-    '<title>网络连接失败</title>' +
+    '<title></title>' +
     '<style>*{margin:0;padding:0;box-sizing:border-box}' +
     'body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;background:#131529;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 20px;color:#fff}' +
     '.c{text-align:center;max-width:400px;width:100%}' +
@@ -245,18 +251,40 @@ async function getOfflineResponse() {
     '.p{background:linear-gradient(180deg,#6591FD 0%,#3D75FF 100%);color:#fff;box-shadow:0 4px 16px rgba(74,124,255,0.3);border-radius:100px}' +
     '</style></head>' +
     '<body><div class="c">' +
-    '<h1>网络连接失败</h1>' +
-    '<p>请检查网络设置后重试，或联系客服获取帮助，若无法重启，请您耐心等待并稍后再进行尝试。</p>' +
+    '<h1 id="oh"></h1>' +
+    '<p id="ob"></p>' +
     '<div class="btns">' +
-    '<a class="btn s" href="javascript:void(0)" onclick="var u=localStorage.getItem(\'customerServiceUrl\');u?window.open(u,\'_blank\'):alert(\'请在网络恢复后联系客服\')">联系客服</a>' +
-    '<button class="btn p" onclick="location.reload()">重新加载</button>' +
+    '<a class="btn s" href="javascript:void(0)" id="oc" onclick="var u=localStorage.getItem(\'customerServiceUrl\');u?window.open(u,\'_blank\'):alert(window.__offlineContactHint||\'\')"></a>' +
+    '<button class="btn p" type="button" id="or" onclick="location.reload()"></button>' +
     '</div></div>' +
+    '<script>' +
+    script +
+    '</script>' +
     '<script>window.addEventListener("online",function(){location.reload()});</script>' +
-    '</body></html>',
-    { status: 503, headers: { 'Content-Type': 'text/html; charset=utf-8' } }
+    '</body></html>'
   );
 }
+/**
+ * 返回离线页面
+ * 优先从缓存读取完整的 offline.html，
+ * 若缓存中也没有（极端情况），则返回一个内联兜底页面（文案与 offline.html 保持一致）
+ */
+async function getOfflineResponse() {
+  const cache = await caches.open(CACHE_NAMES.STATIC);
+  const offlineResponse = await cache.match(OFFLINE_PAGE);
+  if (offlineResponse) {
+    return offlineResponse;
+  }
+  // 内联兜底：仅在 offline.html 完全无法从缓存获取时才使用
+  // 注意：文案和按钮需与 offline.html 保持一致，避免用户体验割裂
+  console.warn('[SW] offline.html not in cache, using inline fallback');
+  return new Response(buildInlineOfflineFallbackHtml(), {
+    status: 503,
+    headers: { 'Content-Type': 'text/html; charset=utf-8' }
+  });
+}
 /**
  * 预缓存离线页 HTML（STATIC）+ 背景图（IMAGE），与 fetch 分发策略一致
  */

package/src/index.js CHANGED Viewed

@@ -8,6 +8,7 @@ const path = require('path');
 const PKG_ROOT = path.join(__dirname, '..');
 const RUNTIME_DIR = path.join(PKG_ROOT, 'runtime');
 const DEFAULT_OFFLINE_HTML = path.join(PKG_ROOT, 'templates', 'default', 'offline.html');
+const DEFAULT_OFFLINE_I18N_JSON = path.join(PKG_ROOT, 'templates', 'default', 'offline-i18n.json');
 /** 默认离线页背景（与模板、runtime/sw.js 中 /static/offline-bg.jpg 一致） */
 const DEFAULT_OFFLINE_BG_JPG = path.join(PKG_ROOT, 'assets', 'offline-bg.jpg');
@@ -43,7 +44,25 @@ function normalizeOfflineLogoPath(raw) {
   return withSlash + query;
 }
+function loadOfflineI18nMessages() {
+  try {
+    const raw = fs.readFileSync(DEFAULT_OFFLINE_I18N_JSON, 'utf-8');
+    return JSON.parse(raw);
+  } catch (e) {
+    console.warn(LOG, 'offline-i18n.json missing or invalid:', e.message);
+    return {};
+  }
+}
+function injectOfflineI18nPlaceholder(content) {
+  const messages = loadOfflineI18nMessages();
+  const raw = JSON.stringify(messages);
+  const safe = raw.replace(/</g, '\\u003c');
+  return content.replace(/__OFFLINE_I18N_INJECT__/g, safe);
+}
 function injectOfflineHtml(content, swConfig) {
+  content = injectOfflineI18nPlaceholder(content);
   const logo = normalizeOfflineLogoPath((swConfig && swConfig.offlineLogoPath) || '');
   if (logo) {
     content = content.replace(/__OFFLINE_LOGO__/g, logo);
@@ -116,6 +135,7 @@ function injectServiceWorkerPlaceholders(content, swConfig) {
 }
 function applySwJsPlaceholders(content, swConfig) {
+  content = injectOfflineI18nPlaceholder(content);
   content = injectServiceWorkerPlaceholders(content, swConfig);
   const apiPathsJson = JSON.stringify(resolveCacheableApiPaths(swConfig));
   content = content.replace(

package/templates/default/offline-i18n.json ADDED Viewed

@@ -0,0 +1,145 @@
+{
+  "ar_SA": {
+    "title": "فشل الاتصال بالشبكة",
+    "heading": "فشل الاتصال بالشبكة",
+    "body": "يرجى التحقق من إعدادات الشبكة ثم المحاولة مرة أخرى، أو الاتصال بخدمة العملاء للمساعدة. إذا تعذّر إعادة الاتصال، يرجى الانتظار قليلاً والمحاولة لاحقًا.",
+    "contact": "خدمة العملاء",
+    "reload": "إعادة التحميل",
+    "copyAria": "نسخ اسم النطاق",
+    "copySuccess": "تم النسخ!",
+    "copyFail": "فشل النسخ، يرجى النسخ يدويًا.",
+    "contactOfflineHint": "يرجى التواصل مع خدمة العملاء بعد عودة الاتصال."
+  },
+  "en_US": {
+    "title": "Network connection failed",
+    "heading": "Network connection failed",
+    "body": "Please check your network settings and try again, or contact customer support for help. If the connection cannot be restored, please wait and try again later.",
+    "contact": "Contact support",
+    "reload": "Reload",
+    "copyAria": "Copy domain",
+    "copySuccess": "Copied!",
+    "copyFail": "Copy failed. Please copy manually.",
+    "contactOfflineHint": "Please contact customer support after your connection is restored."
+  },
+  "hi_IN": {
+    "title": "नेटवर्क कनेक्शन विफल",
+    "heading": "नेटवर्क कनेक्शन विफल",
+    "body": "कृपया अपनी नेटवर्क सेटिंग जाँचकर पुनः प्रयास करें, या सहायता के लिए ग्राहक सेवा से संपर्क करें। यदि कनेक्शन बहाल नहीं हो पाता है, कृपया प्रतीक्षा करें और बाद में फिर कोशिश करें।",
+    "contact": "ग्राहक सेवा",
+    "reload": "पुनः लोड करें",
+    "copyAria": "डोमेन कॉपी करें",
+    "copySuccess": "कॉपी हो गया!",
+    "copyFail": "कॉपी विफल। कृपया मैन्युअली कॉपी करें।",
+    "contactOfflineHint": "कनेक्शन बहाल होने के बाद कृपया ग्राहक सेवा से संपर्क करें।"
+  },
+  "ja_JP": {
+    "title": "ネットワーク接続に失敗しました",
+    "heading": "ネットワーク接続に失敗しました",
+    "body": "ネットワーク設定を確認してから再度お試しいただくか、カスタマーサポートまでお問い合わせください。接続が復旧しない場合は、しばらく時間をおいてから再度お試しください。",
+    "contact": "サポートに連絡",
+    "reload": "再読み込み",
+    "copyAria": "ドメインをコピー",
+    "copySuccess": "コピーしました！",
+    "copyFail": "コピーに失敗しました。手動でコピーしてください。",
+    "contactOfflineHint": "接続が復旧しましたら、カスタマーサポートにお問い合わせください。"
+  },
+  "ko_KR": {
+    "title": "네트워크 연결 실패",
+    "heading": "네트워크 연결 실패",
+    "body": "네트워크 설정을 확인한 뒤 다시 시도하거나 고객 지원에 문의해 주세요. 연결이 복구되지 않으면 잠시 후 다시 시도해 주세요.",
+    "contact": "고객 지원",
+    "reload": "새로고침",
+    "copyAria": "도메인 복사",
+    "copySuccess": "복사되었습니다!",
+    "copyFail": "복사에 실패했습니다. 직접 복사해 주세요.",
+    "contactOfflineHint": "연결이 복구된 후 고객 지원에 문의해 주세요."
+  },
+  "pt_BR": {
+    "title": "Falha na conexão de rede",
+    "heading": "Falha na conexão de rede",
+    "body": "Verifique as configurações de rede e tente novamente ou entre em contato com o suporte ao cliente para obter ajuda. Se a conexão não for restaurada, aguarde e tente mais tarde.",
+    "contact": "Suporte",
+    "reload": "Recarregar",
+    "copyAria": "Copiar domínio",
+    "copySuccess": "Copiado!",
+    "copyFail": "Falha ao copiar. Copie manualmente.",
+    "contactOfflineHint": "Entre em contato com o suporte após a conexão ser restaurada."
+  },
+  "ru_RU": {
+    "title": "Ошибка сетевого подключения",
+    "heading": "Ошибка сетевого подключения",
+    "body": "Проверьте настройки сети и повторите попытку или обратитесь в службу поддержки. Если подключение не восстанавливается, подождите немного и попробуйте снова позже.",
+    "contact": "Поддержка",
+    "reload": "Обновить",
+    "copyAria": "Копировать домен",
+    "copySuccess": "Скопировано!",
+    "copyFail": "Не удалось скопировать. Скопируйте вручную.",
+    "contactOfflineHint": "Обратитесь в поддержку после восстановления соединения."
+  },
+  "th_TH": {
+    "title": "การเชื่อมต่อเครือข่ายล้มเหลว",
+    "heading": "การเชื่อมต่อเครือข่ายล้มเหลว",
+    "body": "โปรดตรวจสอบการตั้งค่าเครือข่ายแล้วลองอีกครั้ง หรือติดต่อฝ่ายบริการลูกค้าเพื่อขอความช่วยเหลือ หากยังเชื่อมต่อไม่ได้ โปรดรอสักครู่แล้วลองใหม่ภายหลัง",
+    "contact": "ติดต่อฝ่ายบริการ",
+    "reload": "โหลดใหม่",
+    "copyAria": "คัดลอกโดเมน",
+    "copySuccess": "คัดลอกแล้ว!",
+    "copyFail": "คัดลอกไม่สำเร็จ โปรดคัดลอกด้วยตนเอง",
+    "contactOfflineHint": "โปรดติดต่อฝ่ายบริการหลังจากเชื่อมต่อกลับมาได้"
+  },
+  "tr_TR": {
+    "title": "Ağ bağlantısı başarısız",
+    "heading": "Ağ bağlantısı başarısız",
+    "body": "Lütfen ağ ayarlarınızı kontrol edip yeniden deneyin veya yardım için müşteri desteğiyle iletişime geçin. Bağlantı kurulamazsa lütfen bekleyip daha sonra tekrar deneyin.",
+    "contact": "Destek",
+    "reload": "Yeniden yükle",
+    "copyAria": "Alan adını kopyala",
+    "copySuccess": "Kopyalandı!",
+    "copyFail": "Kopyalanamadı. Lütfen elle kopyalayın.",
+    "contactOfflineHint": "Bağlantı düzeldiğinde müşteri desteğiyle iletişime geçin."
+  },
+  "vi_VN": {
+    "title": "Kết nối mạng thất bại",
+    "heading": "Kết nối mạng thất bại",
+    "body": "Vui lòng kiểm tra cài đặt mạng và thử lại, hoặc liên hệ bộ phận hỗ trợ khách hàng để được giúp đỡ. Nếu không khôi phục được kết nối, hãy đợi một lúc rồi thử lại sau.",
+    "contact": "Liên hệ hỗ trợ",
+    "reload": "Tải lại",
+    "copyAria": "Sao chép tên miền",
+    "copySuccess": "Đã sao chép!",
+    "copyFail": "Sao chép thất bại. Vui lòng sao chép thủ công.",
+    "contactOfflineHint": "Vui lòng liên hệ hỗ trợ sau khi mạng đã khôi phục."
+  },
+  "zh_CN": {
+    "title": "网络连接失败",
+    "heading": "网络连接失败",
+    "body": "请检查网络设置后重试，或联系客服获取帮助，若无法重启，请您耐心等待并稍后再进行尝试。",
+    "contact": "联系客服",
+    "reload": "重新加载",
+    "copyAria": "复制域名",
+    "copySuccess": "复制成功！",
+    "copyFail": "复制失败，请手动复制",
+    "contactOfflineHint": "请在网络恢复后联系客服"
+  },
+  "zh_TW": {
+    "title": "網路連線失敗",
+    "heading": "網路連線失敗",
+    "body": "請檢查網路設定後重試，或聯絡客服取得協助；若無法重新連線，請耐心等候並稍後再試。",
+    "contact": "聯絡客服",
+    "reload": "重新載入",
+    "copyAria": "複製網域",
+    "copySuccess": "複製成功！",
+    "copyFail": "複製失敗，請手動複製",
+    "contactOfflineHint": "請在網路恢復後聯絡客服"
+  },
+  "es_MX": {
+    "title": "Error de conexión de red",
+    "heading": "Error de conexión de red",
+    "body": "Verifica tu configuración de red e inténtalo de nuevo o contacta a soporte para obtener ayuda. Si la conexión no se restablece, espera un momento y vuelve a intentarlo más tarde.",
+    "contact": "Contactar soporte",
+    "reload": "Volver a cargar",
+    "copyAria": "Copiar dominio",
+    "copySuccess": "¡Copiado!",
+    "copyFail": "No se pudo copiar. Cópialo manualmente.",
+    "contactOfflineHint": "Contacta a soporte cuando se restaure la conexión."
+  }
+}

package/templates/default/offline.html CHANGED Viewed

@@ -86,6 +86,8 @@
       display: flex;
       align-items: center;
       justify-content: center;
+      cursor: pointer;
+      -webkit-tap-highlight-color: transparent;
     }
     .search-bar-btn svg {
@@ -164,6 +166,27 @@
       color: #ffffff;
       box-shadow: 0 4px 16px rgba(74, 124, 255, 0.3);
     }
+    .copy-toast {
+      position: fixed;
+      left: 50%;
+      bottom: 48px;
+      transform: translateX(-50%);
+      padding: 10px 20px;
+      border-radius: 8px;
+      background: rgba(0, 0, 0, 0.78);
+      color: #ffffff;
+      font-size: 14px;
+      line-height: 1.4;
+      opacity: 0;
+      pointer-events: none;
+      transition: opacity 0.2s ease;
+      z-index: 1000;
+    }
+    .copy-toast.show {
+      opacity: 1;
+    }
   </style>
 </head>
 <body>
@@ -178,7 +201,7 @@
       <div class="search-bar-input">
         <span id="typingText"></span><span class="typing-cursor">|</span>
       </div>
-      <div class="search-bar-btn">
+      <div class="search-bar-btn" id="copyDomainBtn" role="button" tabindex="0" aria-label="">
         <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round">
           <circle cx="11" cy="11" r="7"></circle>
           <line x1="21" y1="21" x2="16.65" y2="16.65"></line>
@@ -186,19 +209,88 @@
       </div>
     </div>
-    <h1>网络连接失败</h1>
-    <p>请检查网络设置后重试，或联系客服获取帮助，若无法重启，请您耐心等待并稍后再进行尝试。</p>
+    <h1 id="offline-heading">网络连接失败</h1>
+    <p id="offline-body">请检查网络设置后重试，或联系客服获取帮助，若无法重启，请您耐心等待并稍后再进行尝试。</p>
     <div class="buttons">
       <a class="btn btn-secondary" href="javascript:void(0)" id="contactBtn">联系客服</a>
-      <button class="btn btn-primary" onclick="location.reload()">重新加载</button>
+      <button type="button" class="btn btn-primary" id="reloadBtn" onclick="location.reload()">重新加载</button>
     </div>
   </div>
+  <div class="copy-toast" id="copyToast" aria-live="polite"></div>
   <script>
+    window.__OFFLINE_I18N__ = __OFFLINE_I18N_INJECT__;
+    var offlineDomainText = '__OFFLINE_DOMAIN__';
+    (function applyOfflineLocale() {
+      var M = window.__OFFLINE_I18N__ || {};
+      var SHORT_TO_FULL = {
+        en: 'en_US',
+        zh: 'zh_CN',
+        ja: 'ja_JP',
+        ko: 'ko_KR',
+        ar: 'ar_SA',
+        hi: 'hi_IN',
+        pt: 'pt_BR',
+        ru: 'ru_RU',
+        th: 'th_TH',
+        tr: 'tr_TR',
+        vi: 'vi_VN',
+        es: 'es_MX'
+      };
+      function normalizeLocaleKey(s) {
+        if (!s || typeof s !== 'string') return '';
+        s = s.trim().replace(/-/g, '_');
+        if (s.indexOf('_') === -1) return SHORT_TO_FULL[s.toLowerCase()] || '';
+        var i = s.indexOf('_');
+        return s.slice(0, i).toLowerCase() + '_' + s.slice(i + 1).toUpperCase();
+      }
+      function resolveOfflineLocaleKey() {
+        var fromUrl = '';
+        try {
+          fromUrl = new URLSearchParams(window.location.search).get('locale') || '';
+        } catch (e) {}
+        var fromStorage = '';
+        try {
+          var rawCommon = localStorage.getItem('common');
+          if (rawCommon) {
+            var parsed = JSON.parse(rawCommon);
+            if (parsed && typeof parsed.locale === 'string') fromStorage = parsed.locale;
+          }
+        } catch (e) {}
+        return normalizeLocaleKey(fromUrl) || normalizeLocaleKey(fromStorage) || 'zh_CN';
+      }
+      var loc = resolveOfflineLocaleKey();
+      if (!M[loc]) loc = 'zh_CN';
+      var t = M[loc] || M.zh_CN;
+      if (!t) return;
+      document.documentElement.setAttribute('lang', loc.replace('_', '-'));
+      if (loc.indexOf('ar_') === 0) document.documentElement.setAttribute('dir', 'rtl');
+      document.title = t.title;
+      var el = document.getElementById('offline-heading');
+      if (el) el.textContent = t.heading;
+      el = document.getElementById('offline-body');
+      if (el) el.textContent = t.body;
+      el = document.getElementById('contactBtn');
+      if (el) el.textContent = t.contact;
+      el = document.getElementById('reloadBtn');
+      if (el) el.textContent = t.reload;
+      el = document.getElementById('copyDomainBtn');
+      if (el) el.setAttribute('aria-label', t.copyAria);
+      el = document.getElementById('copyToast');
+      if (el) el.textContent = t.copySuccess;
+      window.__offlineUiStrings = {
+        copySuccess: t.copySuccess,
+        copyFail: t.copyFail,
+        contactOfflineHint: t.contactOfflineHint
+      };
+    })();
     // 打字机动画
     (function() {
-      var text = '__OFFLINE_DOMAIN__';
+      var text = offlineDomainText;
       var el = document.getElementById('typingText');
       var i = 0;
       var isDeleting = false;
@@ -232,13 +324,72 @@
       setTimeout(tick, 600);
     })();
+    // 搜索按钮：复制域名到剪贴板
+    (function() {
+      var copyBtn = document.getElementById('copyDomainBtn');
+      var toast = document.getElementById('copyToast');
+      var toastTimer = null;
+      function showCopyToast() {
+        if (window.__offlineUiStrings && window.__offlineUiStrings.copySuccess) {
+          toast.textContent = window.__offlineUiStrings.copySuccess;
+        }
+        toast.classList.add('show');
+        if (toastTimer) clearTimeout(toastTimer);
+        toastTimer = setTimeout(function() {
+          toast.classList.remove('show');
+        }, 2000);
+      }
+      function copyToClipboard(text) {
+        if (navigator.clipboard && navigator.clipboard.writeText) {
+          return navigator.clipboard.writeText(text);
+        }
+        return new Promise(function(resolve, reject) {
+          var ta = document.createElement('textarea');
+          ta.value = text;
+          ta.setAttribute('readonly', '');
+          ta.style.position = 'fixed';
+          ta.style.left = '-9999px';
+          document.body.appendChild(ta);
+          ta.select();
+          try {
+            var ok = document.execCommand('copy');
+            document.body.removeChild(ta);
+            ok ? resolve() : reject(new Error('copy failed'));
+          } catch (err) {
+            document.body.removeChild(ta);
+            reject(err);
+          }
+        });
+      }
+      function handleCopy() {
+        var text = (offlineDomainText || '').trim();
+        if (!text) return;
+        copyToClipboard(text).then(showCopyToast).catch(function() {
+          var msg = (window.__offlineUiStrings && window.__offlineUiStrings.copyFail) || '';
+          alert(msg);
+        });
+      }
+      copyBtn.addEventListener('click', handleCopy);
+      copyBtn.addEventListener('keydown', function(e) {
+        if (e.key === 'Enter' || e.key === ' ') {
+          e.preventDefault();
+          handleCopy();
+        }
+      });
+    })();
     // 尝试从 localStorage 获取客服链接
     document.getElementById('contactBtn').addEventListener('click', function() {
       var customerServiceUrl = localStorage.getItem('customerServiceUrl');
       if (customerServiceUrl) {
         window.open(customerServiceUrl, '_blank');
       } else {
-        alert('请在网络恢复后联系客服');
+        var msg = (window.__offlineUiStrings && window.__offlineUiStrings.contactOfflineHint) || '';
+        alert(msg);
       }
     });