您现在的位置：程式碼之家 >> 編程語言 > >> 網頁程式設計 >> PHP 程式設計 >> PHP 綜合知識

PHP 動態輸出 JavaScript 程式碼實作範例

編輯：PHP 綜合知識

PHP 可動態生成 JavaScript 程式碼並設定快取標頭，常用於前端配置注入、多語系翻譯、動態路由生成等場景。本文提供標準實作範例。

完整程式碼

<?php
// 取得動態配置（示例：從設定物件獲取 URL）
$url = $this->getConfig()->url();

// 組裝 JavaScript 內容
$content = "var url = { 
    base: '{$url->base}', 
    css: '{$url->css}', 
    js: '{$url->js}', 
    img: '{$url->img}', 
    current: window.location 
};";

// 設定快取：7 天 (604800 秒)
$expire = 604800;

// 輸出標頭
header('Content-Type: application/javascript; charset=utf-8');
header('Cache-Control: max-age=' . $expire . ', public');
header('Expires: ' . gmdate('D, d M Y H:i:s', time() + $expire) . ' GMT');
header('Accept-Ranges: bytes');
header('Content-Length: ' . strlen($content));

// 輸出內容
echo $content;
?>

關鍵標頭說明

標頭	用途
Content-Type	宣告 MIME 類型為 JavaScript，瀏覽器才會正確解析執行
Cache-Control	設定快取策略，max-age 秒數，public 允許 CDN/代理快取
Expires	HTTP/1.0 相容快取過期時間（GMT 格式）
Content-Length	內容長度，啟用 Keep-Alive 與進度顯示

前端引用方式

<script src="/path/to/dynamic-config.php"></script>
<script>
console.log(url.base); // 使用 PHP 注入的配置
</script>

最佳實踐建議

內容安全：動態值務必經過 json_encode() 轉義，防止 XSS 與語法錯誤
版本控制：URL 加入版本參數 ?v=1.2.3 或檔名雜湊，解決快取更新問題
ETag/Last-Modified：搭配條件請求標頭進一步優化快取效率
非阻塞載入：加入 async 或 defer 屬性避免阻塞頁面渲染
CSP 相容：若啟用 CSP，需允許 script-src 'self' 或加入 nonce/hash

進階範例：安全的 JSON 注入

$config = [
    'apiBase' => $url->base,
    'csrfToken' => $this->getCsrfToken(),
    'user' => $currentUser ? [
        'id' => $currentUser->id,
        'name' => $currentUser->name,
        'roles' => $currentUser->roles
    ] : null
];

$content = "window.APP_CONFIG = " . json_encode($config, JSON_HEX_TAG | JSON_HEX_APOS | JSON_HEX_QUOT | JSON_HEX_AMP) . ";";