refactor(api): streamline API requests with requestJson and requestBlob functions

Replaced direct fetch calls with requestJson and requestBlob utility functions across multiple components for improved consistency and error handling. This change enhances the maintainability of the codebase by centralizing API request logic and ensuring uniform handling of authentication and response parsing.

.gitea/workflows/docker.yml

@@ -61,7 +61,16 @@ jobs:
           STAGING=".ci/docker/backend"
           rm -rf "$STAGING"
           mkdir -p "$STAGING/packages/contracts" "$STAGING/backend"
-          cp package.json package-lock.json "$STAGING/"
+          cp package-lock.json "$STAGING/"
+          node <<'NODE'
+          const fs = require("node:fs")
+          const pkg = JSON.parse(fs.readFileSync("package.json", "utf8"))
+          pkg.workspaces = ["packages/*", "backend"]
+          pkg.dependencies = {}
+          pkg.devDependencies = {}
+          delete pkg.scripts
+          fs.writeFileSync(".ci/docker/backend/package.json", `${JSON.stringify(pkg, null, 2)}\n`)
+          NODE
           cp packages/contracts/package.json packages/contracts/tsconfig.json "$STAGING/packages/contracts/"
           cp -R packages/contracts/src "$STAGING/packages/contracts/"
           cp backend/package.json backend/tsconfig.json "$STAGING/backend/"
@@ -70,6 +79,7 @@ jobs:
             cp -R backend/drizzle "$STAGING/backend/"
           fi
 
+
       - name: Set up Docker Buildx
         uses: docker/setup-buildx-action@v3
 

README.md

@@ -135,6 +135,7 @@ sequenceDiagram
 - **Node.js 22** (как в `Dockerfile.frontend` и `backend/Dockerfile`).
 - **npm** с workspaces; установка из корня: `npm ci` или `npm install`.
 - Для нативной сборки `better-sqlite3` на Linux может понадобиться toolchain (`python3`, `make`, `g++`); в Docker-образе backend они уже ставятся.
+- Backend Docker-образ ставит только workspaces `backend` + `contracts` (без корневых Next/React deps); в production логи — JSON без `pino-pretty`.
 
 ### Запуск
 

app/(main)/backups/page.tsx

@@ -28,6 +28,7 @@ import { useDataSource } from "@/lib/data-source"
 import { listServers } from "@/shared/api/servers"
 import { toFrontendServer } from "@/entities/server/model/mappers"
 import { createBackupsAsync, deleteBackup, getBackupJob, getBackupScheduleSettings, listBackups, putBackupScheduleSettings, type BackupItem } from "@/shared/api/backups"
+import { requestBlob } from "@/shared/api/http-client"
 import { toast } from "sonner"
 import {
   Stepper,
@@ -276,8 +277,7 @@ export default function BackupsPage() {
   }
 
   async function handleDownload(id: string, fallbackFilename: string) {
-    const res = await fetch(`${backendUrl.replace(/\/$/, "")}/api/backups/${id}/download`)
-    if (!res.ok) throw new Error("Не удалось скачать файл")
+    const res = await requestBlob(backendUrl, `/api/backups/${id}/download`)
     const blob = await res.blob()
     const url = URL.createObjectURL(blob)
     const a = document.createElement("a")

app/(main)/bgp/page.tsx

@@ -23,6 +23,7 @@ import {
   XIcon, AlertCircleIcon,
 } from "lucide-react"
 import { useDataSource } from "@/lib/data-source"
+import { requestJson } from "@/shared/api/http-client"
 
 // ─── types ────────────────────────────────────────────────────────────────────
 
@@ -621,11 +622,7 @@ export default function BgpPage() {
       if (cancelled) return
       setLoading(true)
       setLiveError(null)
-      fetch(`${backendUrl}/api/bgp/sessions`)
-        .then(r => {
-          if (!r.ok) throw new Error(`HTTP ${r.status}`)
-          return r.json() as Promise<BackendBgpSession[]>
-        })
+      void requestJson<BackendBgpSession[]>(backendUrl, "/api/bgp/sessions")
         .then(data => {
           if (cancelled) return
           setLiveSessions(data.map(backendToFrontend))

app/(main)/ospf/page.tsx

@@ -16,6 +16,7 @@ import {
 } from "lucide-react"
 import { cn } from "@/lib/utils"
 import { useDataSource } from "@/lib/data-source"
+import { requestJson } from "@/shared/api/http-client"
 import { Flag } from "@/components/flag"
 import { readStoredRouteOptimizerSettings } from "@/lib/route-optimizer-data"
 
@@ -733,13 +734,14 @@ function InterfacesTab({
     const ra = readStoredRouteOptimizerSettings()
     setOptimizing(true)
     try {
-      const r = await fetch(`${backendUrl}/api/servers/${filterServerId}/ospf/optimize`, {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ pingWeight: ra.pingWeight }),
-      })
-      if (!r.ok) throw new Error(`HTTP ${r.status}`)
-      const data = await r.json() as BackendOspfOptimizeResponse
+      const data = await requestJson<BackendOspfOptimizeResponse>(
+        backendUrl,
+        `/api/servers/${filterServerId}/ospf/optimize`,
+        {
+          method: "POST",
+          body: JSON.stringify({ pingWeight: ra.pingWeight }),
+        },
+      )
       const byKey: Record<string, number> = {}
       data.interfaces.forEach((row) => {
         byKey[`${data.serverId}-${row.id}`] = row.optimalCost
@@ -1120,8 +1122,7 @@ export default function OspfPage() {
       if (cancelled) return
       setLoading(true)
       setLiveError(null)
-      fetch(`${backendUrl}/api/ospf/all`)
-        .then(r => { if (!r.ok) throw new Error(`HTTP ${r.status}`); return r.json() as Promise<BackendOspfAll> })
+      void requestJson<BackendOspfAll>(backendUrl, "/api/ospf/all")
         .then(data => {
           if (cancelled) return
           setLiveData(data); setFetchedAt(new Date()); setLoading(false)

app/(main)/settings/page.tsx

@@ -875,8 +875,11 @@ export default function SettingsPage() {
         await evo.saveSettings(patch)
         setEvoKeyDraft("")
         markSaved()
+        toast.success("Настройки EvoBGP сохранены")
       } catch (e) {
-        setEvoSaveErr(e instanceof Error ? e.message : "Ошибка сохранения")
+        const msg = e instanceof Error ? e.message : "Ошибка сохранения"
+        setEvoSaveErr(msg)
+        toast.error(msg)
       } finally {
         setEvoSaveBusy(false)
       }

app/(main)/terminal/page.tsx

@@ -6,6 +6,7 @@ import { Button } from "@/components/ui/button"
 import { servers as mockServers } from "@/lib/data"
 import { Flag } from "@/components/flag"
 import { useDataSource } from "@/lib/data-source"
+import { requestJson } from "@/shared/api/http-client"
 import {
   TrashIcon, RefreshCwIcon, CircleIcon, Loader2Icon,
 } from "lucide-react"
@@ -259,12 +260,14 @@ function Terminal({
     if (isLive && server.backendId !== null) {
       setExecuting(true)
       try {
-        const res  = await fetch(`${backendUrl}/api/servers/${server.backendId}/exec`, {
-          method:  "POST",
-          headers: { "Content-Type": "application/json" },
-          body:    JSON.stringify({ command: cmd }),
-        })
-        const data = await res.json() as { output?: string; error?: string }
+        const data = await requestJson<{ output?: string; error?: string }>(
+          backendUrl,
+          `/api/servers/${server.backendId}/exec`,
+          {
+            method: "POST",
+            body: JSON.stringify({ command: cmd }),
+          },
+        )
         const text = data.output ?? data.error ?? "(empty response)"
         const kind: TermLine["kind"] = text.startsWith("error:") ? "error" : "output"
         text.split("\n").forEach(line =>
@@ -427,7 +430,7 @@ interface BackendServer {
 }
 
 export default function TerminalPage() {
-  const { mode, backendUrl } = useDataSource()
+  const { mode, backendUrl, prefsHydrated } = useDataSource()
   const isLive = mode === "live"
 
   // Server list state
@@ -437,14 +440,13 @@ export default function TerminalPage() {
 
   // Load servers from backend when in live mode
   useEffect(() => {
-    if (!isLive) return
+    if (!isLive || !prefsHydrated) return
     let cancelled = false
     queueMicrotask(() => {
       if (cancelled) return
       setServersLoading(true)
-      fetch(`${backendUrl}/api/servers`)
-        .then(r => r.json() as Promise<BackendServer[]>)
-        .then(data => {
+      void requestJson<BackendServer[]>(backendUrl, "/api/servers")
+        .then((data) => {
           if (cancelled) return
           setLiveServers(data.map(s => ({
             uid:          String(s.id),
@@ -462,7 +464,7 @@ export default function TerminalPage() {
         .catch(() => { if (!cancelled) setServersLoading(false) })
     })
     return () => { cancelled = true }
-  }, [isLive, backendUrl, refreshKey])
+  }, [isLive, backendUrl, refreshKey, prefsHydrated])
 
   const termServers: TermServer[] = isLive ? liveServers : mockServersToTermServers()
 

backend/Dockerfile

@@ -5,10 +5,23 @@ RUN apt-get update \
   && apt-get install -y --no-install-recommends python3 make g++ \
   && rm -rf /var/lib/apt/lists/*
 WORKDIR /app
+# Do not set NODE_ENV=production here — npm would omit typescript needed for the build stage.
 COPY package.json package-lock.json ./
 COPY packages/contracts/package.json packages/contracts/
 COPY backend/package.json backend/
-RUN npm ci --workspace=@mmapp/contracts --workspace=mikrotik-manager-backend --include-workspace-root --ignore-scripts \
+# Drop root frontend deps (Next/React/UI) so backend image stays lean.
+RUN node -e "\
+  const fs=require('fs');\
+  const p=JSON.parse(fs.readFileSync('package.json','utf8'));\
+  p.dependencies={};\
+  p.devDependencies={};\
+  delete p.scripts;\
+  p.workspaces=['packages/*','backend'];\
+  fs.writeFileSync('package.json', JSON.stringify(p,null,2)+'\\n');\
+"
+# Prefer npm ci; if lockfile rejects stripped root package.json, fall back to install.
+RUN (npm ci --workspace=@mmapp/contracts --workspace=mikrotik-manager-backend --ignore-scripts \
+  || npm install --workspace=@mmapp/contracts --workspace=mikrotik-manager-backend --ignore-scripts) \
   && npm rebuild better-sqlite3
 
 FROM deps AS build
@@ -18,7 +31,9 @@ COPY packages/contracts packages/contracts
 COPY backend backend
 RUN npm run build -w @mmapp/contracts \
   && npm run build -w mikrotik-manager-backend \
-  && npm prune --omit=dev
+  && npm prune --omit=dev \
+  # npm may nest workspace deps (e.g. dotenv) under backend/node_modules — keep dir for COPY
+  && mkdir -p backend/node_modules
 
 FROM node:22-bookworm-slim AS runner
 WORKDIR /app
@@ -32,6 +47,8 @@ COPY --from=build /app/node_modules ./node_modules
 COPY --from=build /app/packages/contracts ./packages/contracts
 COPY --from=build /app/backend/dist ./backend/dist
 COPY --from=build /app/backend/package.json ./backend/package.json
+# Nested install from lockfile (dotenv etc.) — ESM resolves from /app/backend/dist → ../node_modules
+COPY --from=build /app/backend/node_modules ./backend/node_modules
 RUN mkdir -p /app/data
 EXPOSE 8000
 CMD ["node", "backend/dist/index.js"]

backend/package.json

@@ -24,7 +24,6 @@
     "drizzle-orm": "^0.45.2",
     "fastify": "^5.8.5",
     "fastify-plugin": "^5.1.0",
-    "pino-pretty": "^13.1.3",
     "undici": "^8.1.0",
     "zod": "^4.4.1"
   },
@@ -33,6 +32,7 @@
     "@types/node": "^22.15.3",
     "drizzle-kit": "^0.31.10",
     "jose": "^6.2.11",
+    "pino-pretty": "^13.1.3",
     "tsx": "^4.19.3",
     "typescript": "^5.8.3"
   }

backend/src/index.ts

@@ -29,22 +29,26 @@ export async function buildApp(opts?: {
   logger?: boolean
   startScheduler?: boolean
 }): Promise<FastifyInstance> {
+  const usePrettyLogger =
+    opts?.logger !== false && process.env.NODE_ENV !== "production"
   const app = Fastify({
     bodyLimit: 512 * 1024 * 1024,
     requestTimeout: 10 * 60 * 1000,
     logger:
       opts?.logger === false
         ? false
-        : {
-            transport: {
-              target: "pino-pretty",
-              options: {
-                colorize: true,
-                translateTime: "HH:MM:ss",
-                ignore: "pid,hostname",
+        : usePrettyLogger
+          ? {
+              transport: {
+                target: "pino-pretty",
+                options: {
+                  colorize: true,
+                  translateTime: "HH:MM:ss",
+                  ignore: "pid,hostname",
+                },
               },
-            },
-          },
+            }
+          : true,
   })
 
   app.setValidatorCompiler(validatorCompiler)

backend/src/routes/evobgp.ts

@@ -37,6 +37,12 @@ function normalizeBaseUrl(raw: string): string {
   }
 }
 
+/** Сырой API-ключ без префикса Bearer (иначе EvoBGP получит `Bearer Bearer …`). */
+function normalizeApiKey(raw: string): string {
+  const trimmed = raw.trim()
+  return trimmed.replace(/^Bearer\s+/i, "").trim()
+}
+
 interface EvoCatalogRaw {
   modules: { items: Array<{ id: string; name: string; type: string }> }
   domains: {
@@ -158,7 +164,7 @@ async function fetchEvoJson<T>(root: string, path: string, token: string): Promi
 function credentialsFromDb(): { root: string; apiKey: string } | null {
   const row = ensureEvobgpRow()
   const root = normalizeBaseUrl(row.baseUrl)
-  const apiKey = row.apiKey.trim()
+  const apiKey = normalizeApiKey(row.apiKey)
   if (!root || !apiKey) return null
   return { root, apiKey }
 }
@@ -168,8 +174,8 @@ const evobgpRoutes: FastifyPluginAsyncZod = async (app) => {
     const row = ensureEvobgpRow()
     return reply.send({
       baseUrl: row.baseUrl ?? "",
-      enabled: row.enabled ?? false,
-      secretConfigured: Boolean(row.apiKey?.trim()),
+      enabled: Boolean(row.enabled),
+      secretConfigured: Boolean(normalizeApiKey(row.apiKey ?? "")),
     })
   })
 
@@ -183,10 +189,15 @@ const evobgpRoutes: FastifyPluginAsyncZod = async (app) => {
     let nextEnabled = cur.enabled
     let nextKey = cur.apiKey
 
-    if (parsed.data.baseUrl !== undefined) nextBase = parsed.data.baseUrl.trim()
+    if (parsed.data.baseUrl !== undefined) {
+      nextBase = normalizeBaseUrl(parsed.data.baseUrl)
+    }
     if (parsed.data.enabled !== undefined) nextEnabled = parsed.data.enabled
     if (parsed.data.apiKey !== undefined) {
-      nextKey = parsed.data.apiKey === null || parsed.data.apiKey === "" ? "" : parsed.data.apiKey.trim()
+      nextKey =
+        parsed.data.apiKey === null || parsed.data.apiKey === ""
+          ? ""
+          : normalizeApiKey(parsed.data.apiKey)
     }
 
     db.update(evobgpSettings)
@@ -202,8 +213,8 @@ const evobgpRoutes: FastifyPluginAsyncZod = async (app) => {
     const row = ensureEvobgpRow()
     return reply.send({
       baseUrl: row.baseUrl ?? "",
-      enabled: row.enabled ?? false,
-      secretConfigured: Boolean(row.apiKey?.trim()),
+      enabled: Boolean(row.enabled),
+      secretConfigured: Boolean(normalizeApiKey(row.apiKey ?? "")),
     })
   })
 
@@ -223,7 +234,7 @@ const evobgpRoutes: FastifyPluginAsyncZod = async (app) => {
     const keyRaw =
       d.apiKey !== undefined && d.apiKey.trim() !== "" ? d.apiKey : row.apiKey
     const root = normalizeBaseUrl(urlRaw.trim())
-    const token = keyRaw.trim()
+    const token = normalizeApiKey(keyRaw)
     if (!root || !token) {
       return reply.status(400).send({
         error: "Нужны базовый URL и API-ключ (в форме или уже сохранённые в БД)",

backend/src/services/acme-cloudflare.ts

@@ -161,11 +161,11 @@ async function listDnsRecordsByName(token: string, zoneId: string, fqdn: string)
   )
 }
 
-async function upsertARecord(token: string, zoneId: string, fqdn: string, ip: string): Promise<void> {
+async function upsertARecord(token: string, zoneId: string, fqdn: string, ip: string): Promise<"updated" | "created" | "skipped_cname"> {
   const records = await listDnsRecordsByName(token, zoneId, fqdn)
   const existingA = records.find((record) => record.type === "A")
   if (existingA) {
-    if (existingA.content === ip) return
+    if (existingA.content === ip) return "updated"
     await cloudflareRequest<CfDnsRecord>(token, `/zones/${zoneId}/dns_records/${existingA.id}`, {
       method: "PATCH",
       body: JSON.stringify({
@@ -176,11 +176,12 @@ async function upsertARecord(token: string, zoneId: string, fqdn: string, ip: st
         proxied: false,
       }),
     })
-    return
+    return "updated"
   }
 
+  // CNAME на CN/SAN (алиас на канонический хост) — норма; A конфликтует с CNAME и для DNS-01 не нужен
   if (records.some((record) => record.type === "CNAME")) {
-    throw new Error(`Для ${fqdn} уже есть CNAME в Cloudflare — A-запись не создана`)
+    return "skipped_cname"
   }
 
   await cloudflareRequest<{ id: string }>(token, `/zones/${zoneId}/dns_records`, {
@@ -193,6 +194,7 @@ async function upsertARecord(token: string, zoneId: string, fqdn: string, ip: st
       proxied: false,
     }),
   })
+  return "created"
 }
 
 async function syncCertificateDomainRecords(
@@ -200,11 +202,14 @@ async function syncCertificateDomainRecords(
   domains: string[],
   serverIp: string,
   defaultZoneId?: string,
-): Promise<void> {
+): Promise<{ skippedCname: string[] }> {
+  const skippedCname: string[] = []
   for (const domain of domains) {
     const zoneId = await resolveZoneId(token, domain, defaultZoneId)
-    await upsertARecord(token, zoneId, domain, serverIp)
+    const result = await upsertARecord(token, zoneId, domain, serverIp)
+    if (result === "skipped_cname") skippedCname.push(domain)
   }
+  return { skippedCname }
 }
 
 async function sleep(ms: number) {
@@ -296,9 +301,26 @@ export async function issueCertificateWithCloudflareDns(params: {
     const finalized = await client.finalizeOrder(order, csr)
     const certPem = await client.getCertificate(finalized)
 
+    // A-sync опционален: DNS-01 уже завершён. CNAME на CN (msk2 → msk-gw02) не должен валить импорт.
     const clientRos = MikrotikClient.fromServer(params.server)
-    const serverIp = await resolveServerPublicIp(params.server, clientRos)
-    await syncCertificateDomainRecords(token, domains, serverIp, settings.defaultZoneId)
+    try {
+      params.onStep?.("dns_a_sync")
+      const serverIp = await resolveServerPublicIp(params.server, clientRos)
+      const { skippedCname } = await syncCertificateDomainRecords(
+        token,
+        domains,
+        serverIp,
+        settings.defaultZoneId,
+      )
+      if (skippedCname.length > 0) {
+        params.onStep?.(
+          `dns_a_sync_skip_cname:${skippedCname.join(",")}`,
+        )
+      }
+    } catch (e) {
+      const msg = e instanceof Error ? e.message : "ошибка DNS A-sync"
+      params.onStep?.(`dns_a_sync_warn:${msg}`)
+    }
 
     const trustStores = params.trustStore.filter(Boolean)
     const effectiveTrustStores = trustStores.length > 0 ? trustStores : ["www", "api"]

components/app-sidebar.tsx

@@ -38,6 +38,7 @@ import {
 } from "lucide-react"
 import { useDataSource } from "@/lib/data-source"
 import { useEvoBGP } from "@/lib/evobgp-context"
+import { requestJson } from "@/shared/api/http-client"
 import {
   formatSidebarBadgeCount,
   mockSidebarBadgesByUrl,
@@ -104,7 +105,7 @@ const navStructure: { label: string; items: NavItemBase[] }[] = [
 type LiveSidebarCounts = SidebarCountsDto & { greTunnels?: number; certificates?: number }
 
 export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
-  const { mode, backendUrl } = useDataSource()
+  const { mode, backendUrl, prefsHydrated } = useDataSource()
   const evo = useEvoBGP()
   const [mounted, setMounted] = React.useState(false)
   const [liveCounts, setLiveCounts] = React.useState<LiveSidebarCounts | null>(null)
@@ -118,30 +119,21 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
   }, [])
 
   React.useEffect(() => {
-    if (mode !== "live") {
-      setLiveCounts(null)
+    if (!prefsHydrated || mode !== "live") {
+      if (mode !== "live") setLiveCounts(null)
       return
     }
     let cancelled = false
     const load = async () => {
       try {
-        const base = backendUrl.replace(/\/$/, "")
-        const [cRes, gRes] = await Promise.all([
-          fetch(`${base}/api/sidebar-counts`),
-          fetch(`${base}/api/filters/gre-tunnels`),
+        const [cJson, gJson] = await Promise.all([
+          requestJson<SidebarCountsDto>(backendUrl, "/api/sidebar-counts"),
+          requestJson<{ tunnels?: unknown[] }>(backendUrl, "/api/filters/gre-tunnels").catch(
+            () => ({ tunnels: [] as unknown[] }),
+          ),
         ])
         if (cancelled) return
-        if (!cRes.ok) {
-          setLiveCounts(null)
-          return
-        }
-        const cJson = (await cRes.json()) as SidebarCountsDto
-        let greN = 0
-        if (gRes.ok) {
-          const gJson = (await gRes.json()) as { tunnels?: unknown[] }
-          greN = (gJson.tunnels ?? []).length
-        }
-        setLiveCounts({ ...cJson, greTunnels: greN })
+        setLiveCounts({ ...cJson, greTunnels: (gJson.tunnels ?? []).length })
       } catch {
         if (!cancelled) setLiveCounts(null)
       }
@@ -152,7 +144,7 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
       cancelled = true
       window.clearInterval(id)
     }
-  }, [mode, backendUrl])
+  }, [mode, backendUrl, prefsHydrated])
 
   const navGroups = React.useMemo((): NavGroup[] => {
     function badgeFor(url: string): string | undefined {

components/system-monitor-popover.tsx

@@ -9,6 +9,7 @@ import { cn } from "@/lib/utils"
 import { useDataSource } from "@/lib/data-source"
 import { filters, pingProbes, servers } from "@/lib/data"
 import type { SidebarCountsDto } from "@/lib/sidebar-badges"
+import { resolveApiUrl, requestJson } from "@/shared/api/http-client"
 
 type MonitorMetric = {
   id: string
@@ -78,11 +79,12 @@ function MetricCell({ metric }: { metric: MonitorMetric }) {
 
 /** Live system monitor popover — app-shell-7. @see https://reui.io/preview/base/app-shell-7 */
 export function SystemMonitorPopover() {
-  const { mode, backendUrl } = useDataSource()
+  const { mode, backendUrl, prefsHydrated } = useDataSource()
   const [healthOk, setHealthOk] = useState<boolean | null>(null)
   const [counts, setCounts] = useState<SidebarCountsDto | null>(null)
 
   useEffect(() => {
+    if (!prefsHydrated) return
     if (mode !== "live") {
       setHealthOk(true)
       setCounts({
@@ -98,11 +100,10 @@ export function SystemMonitorPopover() {
 
     let cancelled = false
     const load = async () => {
-      const base = backendUrl.replace(/\/$/, "")
       try {
-        const [hRes, cRes] = await Promise.all([
-          fetch(`${base}/health`),
-          fetch(`${base}/api/sidebar-counts`),
+        const [hRes, counts] = await Promise.all([
+          fetch(resolveApiUrl(backendUrl, "/health"), { signal: AbortSignal.timeout(3000) }),
+          requestJson<SidebarCountsDto>(backendUrl, "/api/sidebar-counts"),
         ])
         if (cancelled) return
         if (hRes.ok) {
@@ -111,11 +112,7 @@ export function SystemMonitorPopover() {
         } else {
           setHealthOk(false)
         }
-        if (cRes.ok) {
-          setCounts((await cRes.json()) as SidebarCountsDto)
-        } else {
-          setCounts(null)
-        }
+        setCounts(counts)
       } catch {
         if (!cancelled) {
           setHealthOk(false)
@@ -129,7 +126,7 @@ export function SystemMonitorPopover() {
       cancelled = true
       window.clearInterval(id)
     }
-  }, [mode, backendUrl])
+  }, [mode, backendUrl, prefsHydrated])
 
   const serversCount = counts?.servers ?? 0
   const filtersCount = counts?.filterRules ?? 0

lib/backend-url.ts

@@ -26,12 +26,26 @@ export function isBackendUrlLocked(): boolean {
   return cfg.kind === "same-origin" || cfg.kind === "fixed"
 }
 
+function isLoopbackHost(hostname: string): boolean {
+  return hostname === "localhost" || hostname === "127.0.0.1"
+}
+
+/** Prefer same-origin when the UI is not on loopback — never point the browser at localhost. */
 export function resolveStoredBackendUrl(stored: string | null): string {
   const cfg = configuredBackendUrl()
   if (cfg.kind === "fixed") return cfg.url
-  if (cfg.kind === "same-origin" && typeof window !== "undefined") {
+  if (cfg.kind === "same-origin") {
+    if (typeof window !== "undefined") return window.location.origin
+    return ""
+  }
+  if (typeof window !== "undefined" && !isLoopbackHost(window.location.hostname)) {
     return window.location.origin
   }
   const trimmed = stored?.trim().replace(/\/$/, "")
+  if (trimmed && /^https?:\/\/(localhost|127\.0\.0\.1)(:\d+)?$/i.test(trimmed)) {
+    if (typeof window !== "undefined" && !isLoopbackHost(window.location.hostname)) {
+      return window.location.origin
+    }
+  }
   return trimmed || LOCAL_DEFAULT_BACKEND_URL
 }

lib/data-source.tsx

@@ -9,6 +9,7 @@ import {
   LOCAL_DEFAULT_BACKEND_URL,
   resolveStoredBackendUrl,
 } from "@/lib/backend-url"
+import { resolveApiUrl } from "@/shared/api/http-client"
 
 // ── types ─────────────────────────────────────────────────────────────────────
 
@@ -49,8 +50,13 @@ function readStoredMode(): DataSourceMode {
   return defaultDataSourceMode()
 }
 
-function readStoredBackendUrl(): string {
-  if (typeof window === "undefined") return LOCAL_DEFAULT_BACKEND_URL
+function initialBackendUrl(): string {
+  if (typeof window === "undefined") {
+    const cfg = configuredBackendUrl()
+    if (cfg.kind === "same-origin") return ""
+    if (cfg.kind === "fixed") return cfg.url
+    return LOCAL_DEFAULT_BACKEND_URL
+  }
   return resolveStoredBackendUrl(localStorage.getItem(LS_BACKEND))
 }
 
@@ -60,7 +66,7 @@ function normalizeBackendUrl(url: string): string {
 
 export function DataSourceProvider({ children }: { children: React.ReactNode }) {
   const [mode, setModeState] = useState<DataSourceMode>(defaultDataSourceMode)
-  const [backendUrl, setBackendUrlState] = useState(LOCAL_DEFAULT_BACKEND_URL)
+  const [backendUrl, setBackendUrlState] = useState(initialBackendUrl)
   const [prefsHydrated, setPrefsHydrated] = useState(false)
   const [backendStatus, setBackendStatus] = useState<boolean | undefined>(undefined)
   const backendUrlLocked = isBackendUrlLocked()
@@ -68,10 +74,7 @@ export function DataSourceProvider({ children }: { children: React.ReactNode })
 
   useEffect(() => {
     const storedMode = readStoredMode()
-    let url = readStoredBackendUrl()
-    if (configuredBackendUrl().kind === "same-origin") {
-      url = window.location.origin
-    }
+    const url = resolveStoredBackendUrl(localStorage.getItem(LS_BACKEND))
     setModeState(storedMode)
     setBackendUrlState(url)
     setPrefsHydrated(true)
@@ -91,10 +94,7 @@ export function DataSourceProvider({ children }: { children: React.ReactNode })
   }, [backendUrlLocked])
 
   const checkBackend = useCallback(async () => {
-    const healthUrl =
-      configuredBackendUrl().kind === "same-origin"
-        ? "/health"
-        : `${normalizeBackendUrl(backendUrl)}/health`
+    const healthUrl = resolveApiUrl(backendUrl, "/health")
     try {
       const res = await fetch(healthUrl, { signal: AbortSignal.timeout(3000) })
       setBackendStatus(res.ok)

lib/evobgp-context.tsx

@@ -10,6 +10,7 @@ import {
 } from "react"
 import { useDataSource } from "@/lib/data-source"
 import type { Domain, IpRange, Asn } from "@/lib/data"
+import { ApiClientError, requestJson } from "@/shared/api/http-client"
 
 export interface EvoBgpCommunityRow {
   id: string
@@ -66,6 +67,12 @@ interface EvoBgpContextValue {
 
 const EvoBgpContext = createContext<EvoBgpContextValue | null>(null)
 
+function errorMessage(e: unknown, fallback: string): string {
+  if (e instanceof ApiClientError) return e.message || fallback
+  if (e instanceof Error) return e.message || fallback
+  return fallback
+}
+
 export function EvoBGPProvider({ children }: { children: React.ReactNode }) {
   const { mode, backendUrl, backendStatus } = useDataSource()
   const [baseUrl, setBaseUrlState] = useState("")
@@ -86,24 +93,15 @@ export function EvoBGPProvider({ children }: { children: React.ReactNode }) {
       setLoading(true)
       setError(null)
       try {
-        const res = await fetch(`${backendUrl.replace(/\/$/, "")}/api/evobgp/catalog`, {
-          method: "POST",
-        })
-        const text = await res.text()
-        if (!res.ok) {
-          let msg = res.statusText
-          try {
-            const j = JSON.parse(text) as { error?: string; detail?: string }
-            msg = j.error ?? j.detail ?? msg
-          } catch {
-            if (text) msg = text
-          }
-          throw new Error(msg || "Ошибка EvoBGP")
-        }
-        setSnapshot(JSON.parse(text) as EvoBgpCatalogSnapshot)
+        const data = await requestJson<EvoBgpCatalogSnapshot>(
+          backendUrl,
+          "/api/evobgp/catalog",
+          { method: "POST" },
+        )
+        setSnapshot(data)
       } catch (e) {
         setSnapshot(null)
-        setError(e instanceof Error ? e.message : "Ошибка загрузки")
+        setError(errorMessage(e, "Ошибка загрузки"))
       } finally {
         setLoading(false)
       }
@@ -119,16 +117,19 @@ export function EvoBGPProvider({ children }: { children: React.ReactNode }) {
       return
     }
     try {
-      const res = await fetch(`${backendUrl.replace(/\/$/, "")}/api/evobgp/settings`)
-      if (!res.ok) throw new Error(await res.text())
-      const data = (await res.json()) as EvoBgpSettingsDto
+      const data = await requestJson<EvoBgpSettingsDto>(
+        backendUrl,
+        "/api/evobgp/settings",
+      )
       setBaseUrlState(data.baseUrl ?? "")
-      setEnabledState(data.enabled ?? false)
-      setSecretConfigured(data.secretConfigured ?? false)
+      setEnabledState(Boolean(data.enabled))
+      setSecretConfigured(Boolean(data.secretConfigured))
       setSettingsLoaded(true)
-      await pullCatalog(data.enabled ?? false)
-    } catch {
+      setError(null)
+      await pullCatalog(Boolean(data.enabled))
+    } catch (e) {
       setSettingsLoaded(true)
+      setError(errorMessage(e, "Не удалось загрузить настройки EvoBGP"))
     }
   }, [mode, backendStatus, backendUrl, pullCatalog])
 
@@ -140,27 +141,25 @@ export function EvoBGPProvider({ children }: { children: React.ReactNode }) {
 
   const saveSettings = useCallback(
     async (patch: EvoBgpSavePayload) => {
-      const res = await fetch(`${backendUrl.replace(/\/$/, "")}/api/evobgp/settings`, {
-        method: "PUT",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify(patch),
-      })
-      const text = await res.text()
-      if (!res.ok) {
-        let msg = res.statusText
-        try {
-          const j = JSON.parse(text) as { error?: string }
-          msg = j.error ?? msg
-        } catch {
-          if (text) msg = text
-        }
-        throw new Error(msg || "Не удалось сохранить")
-      }
-      const data = JSON.parse(text) as EvoBgpSettingsDto
+      const data = await requestJson<EvoBgpSettingsDto>(
+        backendUrl,
+        "/api/evobgp/settings",
+        {
+          method: "PUT",
+          body: JSON.stringify(patch),
+        },
+      )
+      const nextEnabled = Boolean(data.enabled)
       setBaseUrlState(data.baseUrl ?? "")
-      setEnabledState(data.enabled ?? false)
-      setSecretConfigured(data.secretConfigured ?? false)
-      await pullCatalog(data.enabled ?? false)
+      setEnabledState(nextEnabled)
+      setSecretConfigured(Boolean(data.secretConfigured))
+      setError(null)
+      // Каталог не должен ронять успех сохранения (401/502 на catalog ≠ «настройки не сохранились»)
+      try {
+        await pullCatalog(nextEnabled)
+      } catch {
+        /* pullCatalog already sets error state */
+      }
     },
     [backendUrl, pullCatalog],
   )
@@ -169,20 +168,20 @@ export function EvoBGPProvider({ children }: { children: React.ReactNode }) {
     await pullCatalog(enabled)
   }, [enabled, pullCatalog])
 
-  const testConnection = useCallback(async (draft?: EvoBgpTestDraft) => {
-    try {
-      const res = await fetch(`${backendUrl.replace(/\/$/, "")}/api/evobgp/test`, {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify(draft ?? {}),
-      })
-      const data = (await res.json().catch(() => ({}))) as { ok?: boolean; error?: string }
-      if (!res.ok) throw new Error(data.error ?? res.statusText)
-      return { ok: true, message: "Соединение с EvoBGP установлено" }
-    } catch (e) {
-      return { ok: false, message: e instanceof Error ? e.message : "Ошибка" }
-    }
-  }, [backendUrl])
+  const testConnection = useCallback(
+    async (draft?: EvoBgpTestDraft) => {
+      try {
+        await requestJson<{ ok?: boolean }>(backendUrl, "/api/evobgp/test", {
+          method: "POST",
+          body: JSON.stringify(draft ?? {}),
+        })
+        return { ok: true, message: "Соединение с EvoBGP установлено" }
+      } catch (e) {
+        return { ok: false, message: errorMessage(e, "Ошибка") }
+      }
+    },
+    [backendUrl],
+  )
 
   const value = useMemo(
     () => ({

package-lock.json

@@ -58,7 +58,6 @@
         "drizzle-orm": "^0.45.2",
         "fastify": "^5.8.5",
         "fastify-plugin": "^5.1.0",
-        "pino-pretty": "^13.1.3",
         "undici": "^8.1.0",
         "zod": "^4.4.1"
       },
@@ -67,6 +66,7 @@
         "@types/node": "^22.15.3",
         "drizzle-kit": "^0.31.10",
         "jose": "^6.2.11",
+        "pino-pretty": "^13.1.3",
         "tsx": "^4.19.3",
         "typescript": "^5.8.3"
       }
@@ -3951,6 +3951,70 @@
         "node": ">=14.0.0"
       }
     },
+    "node_modules/@tailwindcss/oxide-wasm32-wasi/node_modules/@emnapi/core": {
+      "version": "1.8.1",
+      "dev": true,
+      "inBundle": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@emnapi/wasi-threads": "1.1.0",
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-wasm32-wasi/node_modules/@emnapi/runtime": {
+      "version": "1.8.1",
+      "dev": true,
+      "inBundle": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-wasm32-wasi/node_modules/@emnapi/wasi-threads": {
+      "version": "1.1.0",
+      "dev": true,
+      "inBundle": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-wasm32-wasi/node_modules/@napi-rs/wasm-runtime": {
+      "version": "1.1.1",
+      "dev": true,
+      "inBundle": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@emnapi/core": "^1.7.1",
+        "@emnapi/runtime": "^1.7.1",
+        "@tybys/wasm-util": "^0.10.1"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/Brooooooklyn"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-wasm32-wasi/node_modules/@tybys/wasm-util": {
+      "version": "0.10.1",
+      "dev": true,
+      "inBundle": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-wasm32-wasi/node_modules/tslib": {
+      "version": "2.8.1",
+      "dev": true,
+      "inBundle": true,
+      "license": "0BSD",
+      "optional": true
+    },
     "node_modules/@tailwindcss/oxide-win32-arm64-msvc": {
       "version": "4.2.4",
       "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-arm64-msvc/-/oxide-win32-arm64-msvc-4.2.4.tgz",
@@ -5741,6 +5805,7 @@
       "version": "2.0.20",
       "resolved": "https://registry.npmjs.org/colorette/-/colorette-2.0.20.tgz",
       "integrity": "sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==",
+      "dev": true,
       "license": "MIT"
     },
     "node_modules/combined-stream": {
@@ -5967,6 +6032,7 @@
       "version": "4.6.3",
       "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-4.6.3.tgz",
       "integrity": "sha512-2P0p0pFGzHS5EMnhdxQi7aJN+iMheud0UhG4dlE1DLAlvL8JHjJJTX/CSm4JXwV0Ka5nGk3zC5mcb5bUQUxxMA==",
+      "dev": true,
       "license": "MIT",
       "engines": {
         "node": "*"
@@ -7237,6 +7303,7 @@
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/fast-copy/-/fast-copy-4.0.3.tgz",
       "integrity": "sha512-58apWr0GUiDFM8+3afrO6eYwJBn9ZAhDOzG3L+/9llab/haCARS2UIfffmOurYLwbgDRs8n0rfr6qAAPEAuAQw==",
+      "dev": true,
       "license": "MIT"
     },
     "node_modules/fast-decode-uri-component": {
@@ -7370,6 +7437,7 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/fast-safe-stringify/-/fast-safe-stringify-2.1.1.tgz",
       "integrity": "sha512-W+KJc2dmILlPplD/H4K9l9LcAHAfPtP6BY84uVLXQ6Evcz9Lcg33Y2z1IVblT6xdY54PXYVHEv+0Wpq8Io6zkA==",
+      "dev": true,
       "license": "MIT"
     },
     "node_modules/fast-string-truncated-width": {
@@ -8166,6 +8234,7 @@
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/help-me/-/help-me-5.0.0.tgz",
       "integrity": "sha512-7xgomUX6ADmcYzFik0HzAxh/73YlKR9bmFzf51CZwR+b6YtzU2m0u49hQCqV6SvlqIqsaxovfwdvbnsw3b/zpg==",
+      "dev": true,
       "license": "MIT"
     },
     "node_modules/hermes-estree": {
@@ -8977,6 +9046,7 @@
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/joycon/-/joycon-3.1.1.tgz",
       "integrity": "sha512-34wB/Y7MW7bzjKRjUKTa46I2Z7eV62Rkhva+KkopW7Qvv/OSWBqvkSY7vusOPrNuZcUG3tApvdVgNB8POj3SPw==",
+      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=10"
@@ -10573,6 +10643,7 @@
       "version": "13.1.3",
       "resolved": "https://registry.npmjs.org/pino-pretty/-/pino-pretty-13.1.3.tgz",
       "integrity": "sha512-ttXRkkOz6WWC95KeY9+xxWL6AtImwbyMHrL1mSwqwW9u+vLp/WIElvHvCSDg0xO/Dzrggz1zv3rN5ovTRVowKg==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "colorette": "^2.0.7",
@@ -10597,6 +10668,7 @@
       "version": "5.0.3",
       "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-5.0.3.tgz",
       "integrity": "sha512-1tB5mhVo7U+ETBKNf92xT4hrQa3pm0MZ0PQvuDnWgAAGHDsfp4lPSpiS6psrSiet87wyGPh9ft6wmhOMQ0hDiw==",
+      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=14.16"

shared/api/http-client.ts

@@ -21,38 +21,72 @@ function trimBaseUrl(baseUrl: string): string {
   return baseUrl.replace(/\/$/, "")
 }
 
-function resolveRequestUrl(baseUrl: string, path: string): string {
+/** Absolute or same-origin-relative URL for backend API paths. */
+export function resolveApiUrl(baseUrl: string, path: string): string {
   if (path.startsWith("/") && configuredBackendUrl().kind === "same-origin") {
     return path
   }
+  // Safety: never call browser localhost when the UI is served from a remote host
+  if (typeof window !== "undefined") {
+    const host = window.location.hostname
+    const remoteUi = host !== "localhost" && host !== "127.0.0.1"
+    const baseIsLocal =
+      /^https?:\/\/(localhost|127\.0\.0\.1)(:\d+)?$/i.test(trimBaseUrl(baseUrl))
+    if (remoteUi && (baseIsLocal || !baseUrl.trim())) {
+      return path.startsWith("/") ? path : `/${path}`
+    }
+  }
   return trimBaseUrl(baseUrl) + path
 }
 
+/** Attach portal JWT when present. */
+export function withAuthHeaders(init?: HeadersInit): Headers {
+  const headers = new Headers(init)
+  const token = typeof window !== "undefined" ? getToken() : null
+  if (token && !headers.has("Authorization")) {
+    headers.set("Authorization", `Bearer ${token}`)
+  }
+  return headers
+}
+
+function handleUnauthorized(): never {
+  if (typeof window !== "undefined" && isAuthEnabled()) {
+    const ok = redirectToPortalLogin()
+    if (!ok) redirectToPortalLoginInteractive()
+  }
+  throw new ApiClientError("Unauthorized", 401)
+}
+
+async function parseErrorMessage(res: Response): Promise<string> {
+  const payload = await res.json().catch(() => undefined)
+  if (
+    typeof payload === "object" &&
+    payload !== null &&
+    "error" in payload &&
+    typeof (payload as { error?: unknown }).error === "string"
+  ) {
+    return (payload as { error: string }).error
+  }
+  return res.statusText || `HTTP ${res.status}`
+}
+
 export async function requestJson<T>(
   baseUrl: string,
   path: string,
   init?: RequestInit,
 ): Promise<T> {
   const hasBody = init?.body != null
-  const headers = new Headers(init?.headers)
+  const headers = withAuthHeaders(init?.headers)
   if (hasBody && !headers.has("Content-Type")) {
     headers.set("Content-Type", "application/json")
   }
-  const token = typeof window !== "undefined" ? getToken() : null
-  if (token && !headers.has("Authorization")) {
-    headers.set("Authorization", `Bearer ${token}`)
-  }
 
-  const res = await fetch(resolveRequestUrl(baseUrl, path), {
+  const res = await fetch(resolveApiUrl(baseUrl, path), {
     ...init,
     headers,
   })
 
-  if (res.status === 401 && typeof window !== "undefined" && isAuthEnabled()) {
-    const ok = redirectToPortalLogin()
-    if (!ok) redirectToPortalLoginInteractive()
-    throw new ApiClientError("Unauthorized", 401)
-  }
+  if (res.status === 401) handleUnauthorized()
 
   if (res.status === 204) return undefined as T
 
@@ -70,3 +104,21 @@ export async function requestJson<T>(
 
   return payload as T
 }
+
+/** Binary/download endpoints (backup, backup file) with the same auth + URL rules. */
+export async function requestBlob(
+  baseUrl: string,
+  path: string,
+  init?: RequestInit,
+): Promise<Response> {
+  const headers = withAuthHeaders(init?.headers)
+  const res = await fetch(resolveApiUrl(baseUrl, path), {
+    ...init,
+    headers,
+  })
+  if (res.status === 401) handleUnauthorized()
+  if (!res.ok) {
+    throw new ApiClientError(await parseErrorMessage(res), res.status)
+  }
+  return res
+}

shared/api/system-database.ts

@@ -1,19 +1,7 @@
-import { ApiClientError } from "@/shared/api/http-client"
-import { configuredBackendUrl } from "@/lib/backend-url"
+import { ApiClientError, requestBlob } from "@/shared/api/http-client"
 
 const MAX_RESTORE_BYTES = 512 * 1024 * 1024
 
-function trimBaseUrl(baseUrl: string): string {
-  return baseUrl.replace(/\/$/, "")
-}
-
-function resolveDatabaseApiUrl(baseUrl: string, path: string): string {
-  if (configuredBackendUrl().kind === "same-origin") {
-    return path
-  }
-  return `${trimBaseUrl(baseUrl)}${path}`
-}
-
 function parseFilename(contentDisposition: string | null, fallback: string): string {
   if (!contentDisposition) return fallback
   const utfMatch = /filename\*=UTF-8''([^;]+)/i.exec(contentDisposition)
@@ -32,18 +20,7 @@ function parseFilename(contentDisposition: string | null, fallback: string): str
 export async function downloadSystemDatabaseBackup(
   baseUrl: string,
 ): Promise<{ blob: Blob; filename: string }> {
-  const res = await fetch(resolveDatabaseApiUrl(baseUrl, "/api/system/database/backup"))
-  if (!res.ok) {
-    const payload = await res.json().catch(() => undefined)
-    const msg =
-      typeof payload === "object" &&
-      payload !== null &&
-      "error" in payload &&
-      typeof (payload as { error?: unknown }).error === "string"
-        ? (payload as { error: string }).error
-        : res.statusText
-    throw new ApiClientError(msg, res.status, payload)
-  }
+  const res = await requestBlob(baseUrl, "/api/system/database/backup")
   const blob = await res.blob()
   const filename = parseFilename(res.headers.get("Content-Disposition"), "mikrotik-manager.db")
   return { blob, filename }
@@ -56,20 +33,9 @@ export async function restoreSystemDatabaseBackup(baseUrl: string, file: File):
       413,
     )
   }
-  const res = await fetch(resolveDatabaseApiUrl(baseUrl, "/api/system/database/restore"), {
+  await requestBlob(baseUrl, "/api/system/database/restore", {
     method: "POST",
     headers: { "Content-Type": "application/octet-stream" },
     body: file,
   })
-  if (!res.ok) {
-    const payload = await res.json().catch(() => undefined)
-    const msg =
-      typeof payload === "object" &&
-      payload !== null &&
-      "error" in payload &&
-      typeof (payload as { error?: unknown }).error === "string"
-        ? (payload as { error: string }).error
-        : res.statusText
-    throw new ApiClientError(msg, res.status, payload)
-  }
 }