5

私は現在、JavaScriptをバンドルしようとしているので、ページ速度/低速でより高いスコアを受け取ることができます。しかし、私はこのアプローチで壁にぶつかっています。私は現在、jsファイルをバンドルするためのガイダンスとしてこのチュートリアルを使用しています。私はjsファイルを呼び出していますが、Firefoxツールでファイルbundle.jsが存在しないことを示しています。これは本当ですが、htaccessを使用してファイルをからbundle.phpに変更していますbundle.js。しかし、私は何の結果も得ていません。誰かが問題を特定するのを手伝ってくれますか、それともjsファイルをバンドルするためのより良いアプローチがありますか？

これが私の例です。jsファイルを適切に操作すると、ファイルをアップロードするための4つの入力フィールドが表示されます。

これは私がjsファイルを呼んでいる方法です

<script src='core/bundle.js?js=js/jquery-ui-1.8rc2.custom.min.js,js/globalFunctions.js,js/uploaderPreviewer.js,js/itemForm.js&amp;m=4948599067'>
</script>

ファイルタイプを変更するための.htacces*

RewriteEngine on
RewriteRule ^bundle.js$ bundle.php [QSA,L]

core / bundle.php

include "JSMin.php";
$path    = "../../";
$files   = explode(",", $_GET['js']);
$missing = array();

$cache = '';
foreach ($files as $index => $file) {
    if (strtolower(substr($file, -2)) != 'js') {
        unset($files[$index]);
    } else if (file_exists($path.$file)) {
        $cache .= $file;
        $cache .= filemtime($path.$file);
    } else {
        $missing[] = $file;
        unset($files[$index]);
    }
}

$cache = 'cache/'.md5($cache);

if (count($missing)) {
    header("Content-type: text/javascript");
    header("Pragma: no-cache");
    header("Cache-Control: no-cache");
    echo "alert('Could not load the following javascript source files:\\n\\n- ".implode("\\n- ", $missing)."\\n\\nJavascript not loaded / running!');";
    exit;
}

if (count($files)) {
    // create cached version if not present
    if (!file_exists($cache)) {
        $js = '';
        foreach ($files as $file) {
            $js .= JSMin::minify(file_get_contents($path.$file));
        }

        file_put_contents($cache, $js);
    }

    // calculate last-modified & etag send caching headers
    $last_modified_time = filemtime($cache);
    $etag = md5_file($cache);

    header("Content-type: text/javascript");
    header("Pragma: public");
    header("Cache-Control: public");
    header("Last-Modified: ".gmdate("D, d M Y H:i:s", $last_modified_time)." GMT");
    header("Etag: ".$etag); 

    if (@strtotime($_SERVER['HTTP_IF_MODIFIED_SINCE']) == $last_modified_time || trim($_SERVER['HTTP_IF_NONE_MATCH']) == $etag) { 
        header("HTTP/1.1 304 Not Modified");
        exit;
    }

    readfile($cache);
}
4

1 に答える 1

9

これが私が長年うまく使ってきたものです（.htaccessは必要ありません）：

HTMLの場合：

<script type = "text/javascript" src = "js/scripts.php?build=12345&load=script1,script2,script3,folder/script4"> </script> <!-- do not specify the .js extension -->

php（ファイルscripts.php）の場合：

<?php
error_reporting(E_ERROR);
// see http://web.archive.org/web/20071211140719/http://www.w3.org/2005/MWI/BPWG/techs/CachingWithPhp
// $lastModifiedDate must be a GMT Unix Timestamp
// You can use gmmktime(...) to get such a timestamp
// getlastmod() also provides this kind of timestamp for the last
// modification date of the PHP file itself
function cacheHeaders($lastModifiedDate) {
    if ($lastModifiedDate) {
        if (isset($_SERVER['HTTP_IF_MODIFIED_SINCE']) && strtotime($_SERVER['HTTP_IF_MODIFIED_SINCE']) >= $lastModifiedDate) {
            if (php_sapi_name()=='CGI') {
                Header("Status: 304 Not Modified");
            } else {
                Header("HTTP/1.0 304 Not Modified");
            }
            exit;
        } else {
            $gmtDate = gmdate("D, d M Y H:i:s \G\M\T",$lastModifiedDate);
            header('Last-Modified: '.$gmtDate);
        }
    }
}

// This function uses a static variable to track the most recent
// last modification time
function lastModificationTime($time=0) {
    static $last_mod ;
    if (!isset($last_mod) || $time > $last_mod) {
        $last_mod = $time ;
    }
    return $last_mod ;
}

lastModificationTime(filemtime(__FILE__));
cacheHeaders(lastModificationTime());
header("Content-type: text/javascript; charset: UTF-8");

ob_start ("ob_gzhandler");

foreach (explode(",", $_GET['load']) as $value) {
    if (is_file("$value.js")) {
        $real_path = mb_strtolower(realpath("$value.js"));
        if (strpos($real_path, mb_strtolower(dirname(__FILE__))) !== false || strpos($real_path, mb_strtolower(dirname(dirname(__FILE__)).DIRECTORY_SEPARATOR.'modules'.DIRECTORY_SEPARATOR)) !== false) {
            lastModificationTime(filemtime("$value.js"));
            include("$value.js");echo "\n";
        } 
    }
}
?>

これにより、jsファイルが圧縮、マージ、およびキャッシュされます

于 2012-08-06T07:18:03.340 に答える