如何在PC端和移動端共用同一頁面并解決緩存問題？

PC端和移動端共用頁面及緩存問題的解決方案

在寶塔面板（nginx+php+mysql）環境下，實現PC端（www.sf.com）和移動端（m.sf.com）共用同一目錄下的頁面，同時解決開啟緩存后鏈接和樣式顯示錯誤的問題，并非易事。 本文提供一種高效簡潔的方案。

初始方案嘗試使用PHP函數根據域名判斷（域名以’m’開頭則為移動端）來加載不同的css文件和修改URL，但在開啟緩存后，PHP函數無法執行，導致鏈接失效。

優化方案：使用獨立的index.html文件

為了避免PHP函數在緩存機制下失效的問題，建議為PC端和移動端分別創建獨立的index.html文件。 www.sf.com對應index.html，m.sf.com對應m.index.html（或其他命名）。 每個index.html文件包含各自的CSS鏈接和URL，無需依賴PHP動態處理。

此方法的優勢在于：

• 簡化邏輯: 避免了復雜的PHP判斷和URL替換邏輯。
• 緩存友好: 靜態HTML文件可以直接被緩存，避免了PHP執行的開銷，確保在開啟緩存后也能正確顯示PC端和移動端的內容。
• 可靠性高: 減少了因PHP代碼錯誤或服務器環境差異導致的頁面顯示問題。

通過這種方式，可以輕松實現PC端和移動端共用同一目錄，并有效解決緩存問題，確保用戶在不同設備上都能獲得正確的頁面顯示效果。