Kashiwabara Group 相關公司 10 個以上網站遷移至 Cloudflare / microCMS 環境

在保留不同網站結構的同時,實現安全性與營運的統一管理

針對 Kashiwabara Corporation 及其集團公司所營運的 10 個以上網站,以 Cloudflare 作為共同基礎平台進行基礎設施重構。

集團內存在多個網站,包括企業網站、品牌網站、招聘網站、行銷活動網站等,各自具有不同的目的與營運體制。

本專案並未將所有網站統一替換為同一技術,而是在保留各網站既有構成與營運方式的基礎上,將 DNS、安全性、內容配信、監控等機制統一集中至 Cloudflare。

針對主要企業網站與品牌網站,採用 Astro 與 microCMS 技術刷新前端實現。同時實現集團整體治理的強化與各網站靈活營運的並行。

專案背景

隨著集團業務的擴大與品牌推廣的強化,網站數量以及所掲載的影片、圖像等內容量持續增加。

另一方面,各網站是在不同時期、使用不同技術與營運體制所構築的,因此面臨以下課題。

  • 伺服器與DNS的管理對象因站點而異散分布
  • 站點的安全措施與維護方法各不相同
  • 高畫質影片與圖片數量增加,導致顯示負載提高
  • 包含外部廠商的多個相關單位各自運營不同的環境
  • 作業系統與中介軟體更新、故障監控等持續產生維護成本
  • 難以橫向掌握集團全體的網站概況

單純遷移伺服器無法解決這些課題。

因此,針對柏原集團及其子公司營運的10個以上公開網站,以Cloudflare為共同基礎進行了網站基礎設施的重建。

遷移設計不會將所有內容統一配置

在集團網站整合中,若將所有站點變更為同一個CMS或框架,將對現有運營流程與外部廠商的合作產生重大影響。

在本專案中,我們調查了網站的角色和更新頻率、營運主體、以及未來的修改計劃,並為每個網站選擇了適合的遷移方法。

遷移設計整體流程

  1. 調查集團各網站的構成、DNS、伺服器、CMS 和營運體制
  2. 整理各網站的角色和更新方法、相關廠商
  3. 分類需要現代化的網站和維持現有構成的網站
  4. 將主要網站升級為 Astro × microCMS 架構
  5. 繼續使用既有 CMS 的網站,從主要網站環境中分離
  6. 將所有網站的 DNS 和通訊路由集中至 Cloudflare
  7. 將安全設定和監控方法整合為集團共通政策
  8. 逐步切換,轉移至公開後的營運和監控體制

在尊重各個網站獨特需求的同時,透過在上層建立 Cloudflare 共用基礎設施,實現了靈活性與管理的平衡。

流程圖

建構 Cloudflare 共用基礎設施

將超過 10 個網站的 DNS 和通訊路徑整合至 Cloudflare。

即使各個網站使用不同的伺服器或 CMS,透過將網際網路接觸點統一至 Cloudflare,我們建立了容易對整個集團應用共同安全性和內容配送政策的架構。

DNS 管理集中化

將原本分散於各網站的 DNS 管理集中整合至 Cloudflare。

現在能夠跨網站掌握各個網域的設定狀況,建立了可輕鬆因應網站新增、遷移和設定變更的營運基礎。

透過 CDN 進行內容配送

透過 Cloudflare 網路配送圖片、影片、CSS、JavaScript 等靜態檔案,減輕原始伺服器的負擔。

即使在大量使用豐富內容的網站上,我們也建立了支援穩定顯示的配送基礎設施。

安全政策的統一

在各網站前端配置Cloudflare,以便能夠活用WAF和DDoS防護等安全功能。

透過在團隊共通的入口控制通信,而非僅依賴個別伺服器,使得各網站不同的安全對策更容易統一。

構築Astro × microCMS共通組件,部署到多個網站

主要公司網站和品牌網站採用Astro和microCMS,革新了前端實現和內容管理基礎。

不是針對每個網站從零開始構建環境,而是整理出可在多個網站間共通使用的實現方式和設置,構築了基於Astro的共通組件。各個網站在活用這些共通組件的同時,分別實現了設計、內容和必要功能。

這樣的構成使得各網站的品牌和運營方針得以尊重,同時在整個團隊網站範圍內保持品質、可維護性和開發效率的一定水準。

在實現共通化的同時,維持各網站的個性

不是將所有網站統一為相同的設計和功能,而是僅在技術基礎層面進行共通化。

各網站的設計、內容結構和必要功能可以分別設計,因此在不損害各品牌的表現方式和運營方法的同時,能夠發揮共通基礎的優勢。

只在必要的地方執行前端

通過 Astro 的島嶼架構,只在需要互動功能的地方執行 JavaScript。

通過避免在整個頁面統一載入 JavaScript,我們實現了充分利用影片和高品質影像的視覺表現,同時保持輕量級網頁的平衡。

透過 microCMS 進行內容管理

內容管理採用了無頭 CMS microCMS。

通過將負責顯示的前端與管理資訊的 CMS 分離,我們能夠靈活地為各個網站設計不同的外觀和功能,同時讓管理人員可以日常地更新內容。

建立易於持續開發和維護的基礎

透過利用共同套件,我們抑制了各網站間不同的實作和設定無序增加的情況。

我們簡化了新網站的構建、現有網站的功能新增和共同部分的更新流程,實現了能夠長期運營多個集團網站的開發基礎。

此外,通過採用以靜態配信為中心的架構,我們減輕了傳統上需要的作業系統和中間件管理負擔,使團隊能夠將更多資源投入到內容運營和網站改善,而不是把時間都花在維護工作上。

相關文章
https://www.liberogic.jp/topics/20250804-AstroComponent/

環境隔離以發揮現有 CMS 的優勢

針對招聘網站、活動網站等需優先考慮與外部廠商合作或快速更新的網站,我們繼續使用 WordPress 和 Movable Type 等現有 CMS。

不過,我們並未將這些系統與主要網站混在同一環境中,而是分離了伺服器和營運環境。

即使任何一個 CMS 或伺服器發生問題,這種架構也能輕鬆限制影響範圍。

在不大幅改變現有製作和營運流程的情況下,我們強化了整個集團的風險管理。

透過 Cloudflare 連接各網站不同的架構

主要網站和現有 CMS 網站各自在獨立的環境中運營。

同時,DNS、通訊、安全性和監控透過以 Cloudflare 為中心的統一政策進行管理。

如此一來,我們在維持每個網站最適技術和營運體制的同時,為整個集團實現了統一管理的 Web 基礎。

流程圖

導入後的變化

項目

遷移前

遷移後

基礎設施管理

各網站的管理來源和配置分散

整合至以 Cloudflare 為中心的共同基礎平台

DNS 管理

各域名個別管理

跨群組網站統一管理

前端

依賴伺服器或 CMS 的架構

將主要網站刷新為 Astro × microCMS

內容配送

以原始伺服器為中心進行配送

運用 Cloudflare 的網路

安全性

針對各個網站進行個別對應

易於套用共通方針的架構

與外部廠商的合作

混合多種不同環境

將現有 CMS 分離為獨立環境

維護與監控

伺服器層級的維護管理

轉換為跨越全站的監控體制

改善活動

更易於分配資源用於維護管理

更容易專注於內容運營和改善

不是「統一」多個站點,而是「整合」它們

在本專案中,我們並未將 10 個以上的網站全部替換成相同技術,而是保持了各自適合其用途和運營體制的架構。

在此基礎上,我們以 Cloudflare 作為群組共同基礎設施,整合了 DNS、通信、安全性和監控。

主要網站透過 Astro × microCMS 進行現代化,而繼續使用既有 CMS 的網站則分離至獨立環境,以此在效能、運維性和安全性之間取得平衡。

本次網站基礎設施革新的重要關鍵在於,不強行統一各個不同的網站,而是在活用其差異特性的同時,將整體置於可管理的狀態。

透過團隊的理解與協力實現的專案

本專案橫跨 10 個以上的網站,需在繼續各自運維的同時遷移至共同基礎設施,不僅在技術層面,在相關人員的協調配合上也都是極具挑戰性的工作。

之所以能夠整理各網站不同的運營目的、運維體制和現有製作流程,並順利遷移至展望未來的新基礎設施,正是得益於 KASHIWABARA 集團全體人員的深厚理解,他們以積極開放的態度接納變化、推進專案進行。

此外,我們也得到了負責品牌推廣和創意工作的株式會社 NDC 全體人員,以及支撐整個專案進行與架構的株式會社 Original Text 全體人員,乃至參與各網站製作與運維的相關各公司的鼎力協助。

來自不同立場與專業領域的團隊成員齊心協力,各自貢獻專業知識,在尊重既有機制的同時朝著打造更優質網站基礎設施這一共同目標前進,正是推動本專案順利完成的強大動力。

專案所有者
株式會社 Original Text
品牌推廣・動態設計
株式會社日本設計中心
首席總監
Liberogic 大家
技術總監
Liberogic 大塚
總監
Liberogic 繁田
UI/UX 設計師
Liberogic 長橋
首席工程師
Liberogic 二俣
前端工程師
Liberogic 株式會社 松塚/平林
專案經理
Liberogic 株式會社 森本
公司名稱・服務名稱
株式會社 柏原集團