RRRR

666# 瑞雄製藥官網系統規格書 (Technical Specification Document) ## 一、系統架構總覽 ### 1.1 系統目標 建置一套： - 可後台管理內容 - 具 SEO 優化能力 - 具安全性強化機制 - 可自動維護 Sitemap - 支援圖片最佳化 - 適合 B2B 官網型架構 ### 1.2 系統架構 **架構模式** - 前後端分離或同構架構（依技術棧決定） - Server-side rendering（SSR）或靜態預產生（SSG）優先 - 支援 SEO crawler **資料庫** - SQLite（單機部署） - 預留未來升級 PostgreSQL 可能性 ## 二、後台管理系統規格 ### 2.1 使用者角色與權限管理 **角色類型** - Admin（預設帳號） - Editor（可編輯內容） - Viewer（只讀） ### 2.2 預設帳號 系統初始化時： - 自動建立一組 Admin - 密碼需強制首次登入修改 - 必須啟用 Google 2FA 才可正常使用 ### 2.3 登入安全規範 **驗證機制** - Email + 密碼 - Google Authenticator 2FA（TOTP） - 密碼需加鹽 + Hash（bcrypt 或 Argon2） **登入失敗次數限制** - 防暴力破解（Rate Limit） **其他安全機制** - JWT 或 Session-based 認證 - CSRF Protection - XSS 防護 - HTTP Only Cookie - HTTPS 強制 ## 三、後台可編輯項目規劃 ### 3.1 全站設定（Global Settings） - 網站名稱 - Meta Title 預設值 - Meta Description 預設值 - OG 預設設定 - Logo 上傳 - Favicon 設定 - 公司資訊（地址、電話、信箱） - Google Analytics 代碼 - Search Console 驗證碼 ### 3.2 頁面管理（Pages） 可新增 / 修改 / 刪除： - About - 製造與品質 - 解決方案 - 諮詢頁 - 其他靜態頁 每頁需具備： - Title - Slug - Meta Title - Meta Description - H1 - 內容編輯器（支援 HTML / Markdown） - OG Image - Canonical URL - 狀態（發布 / 草稿） ### 3.3 產品管理（Products） 可編輯欄位： - 產品名稱 - 分類（動物藥品 / 補助藥品） - 子分類 - 適用動物 - 劑型 - 產品圖片 - 產品描述 - 規格 - 用法用量 - 注意事項 - 是否顯示 - SEO Meta 欄位 ### 3.4 新聞管理（News） - 標題 - Slug - 發布日期 - 摘要 - 內文 - 封面圖 - SEO Meta 欄位 - 標籤 ### 3.5 FAQ 管理 - 問題 - 回答 - 分類 - 排序 ## 四、SEO 系統功能規格 （以下為你原需求未完全涵蓋部分，已補強） ### 4.1 自動 Sitemap 功能 當以下動作發生時： - 新增頁面 - 修改頁面 - 刪除頁面 - 新增產品 - 發布新聞 系統需自動： - 更新 sitemap.xml - 更新 lastmod - 重新產生 ### 4.2 自動 Cache 更新 當內容異動時： - 清除該頁快取 - 清除相關列表頁快取 - 重新產生靜態頁（如有） 建議： - Cache 分層機制 - Page cache - API cache - CDN cache ### 4.3 SEO 必備技術補強 必須增加： - 自動產生 robots.txt - 自動產生 structured data（JSON-LD） - Open Graph 設定 - Twitter Card 支援 - Canonical URL - 404 自訂頁面 - 301 redirect 管理功能 - 自動產生 breadcrumb schema - 自動產生 FAQ schema - 分頁 rel="next/prev" ### 4.4 速度優化 - 圖片自動轉為 .webp - Lazy loading - 圖片壓縮 - CSS/JS Minify - HTTP/2 或 HTTP/3 支援 - Gzip / Brotli 壓縮 ## 五、圖片上傳處理規格 ### 5.1 上傳流程 使用者上傳圖片 -> 系統自動： - 壓縮 - 轉換為 .webp - 產生多尺寸版本（RWD） - 儲存至指定資料夾 - 回傳圖片 URL ### 5.2 SEO 補強 - 必填 ALT 文字 - 自動產生圖片 sitemap - 檔名 SEO 化（slug-based） ## 六、資料庫設計原則（SQLite） ### 6.1 資料表規劃 - users - pages - products - categories - news - faq - settings - redirects - login_logs ### 6.2 索引優化 - slug index - publish_date index - category index - full-text search index ## 七、安全規格補強 ### 7.1 Server 安全 - 強制 HTTPS - HSTS - X-Frame-Options - Content Security Policy - X-Content-Type-Options ### 7.2 後台路徑保護 - 非公開路徑 - IP 限制（可選） - 2FA 必須啟用 ## 八、未來擴充性設計 - 多語系架構預留 - API 預留 - 匯出產品資料功能 - 經銷商專區 - SEO 分析儀表板 ## 九、SEO 缺失檢查與補強建議 你的原始需求已具備： - [x] sitemap - [x] cache 更新 - [x] 圖片 webp - [x] 後台管理 但仍需補強： - Structured Data（很重要） - Redirect 管理 - Canonical 控制 - 分頁 SEO - Breadcrumb schema - 圖片 sitemap - robots.txt 自動管理 這些已納入規格書。 ## 十、建議技術堆疊（可選） - Next.js（SSR + SEO友善） - SQLite - Sharp（圖片轉 webp） - bcrypt / Argon2 - speakeasy（TOTP 2FA） - Sitemap generator 套件 - Zod（資料驗證） ## 系統成熟度評估 完成以上規格後： 這將會是一套： - 中高階 B2B 官網系統 - SEO 技術完整 - 安全性完整 - 可長期維護 - 可擴充出口與雙語版本1