GZIPping和缓存我的JS＆amp; CSS文件

时间：2012-05-27 21:08:20

标签： javascript css caching gzip

我正在使用 SMARTY PHP模板引擎， Apache 2 和 PHP 5.3.3 。这是我原来的main.js文件内容

// Functions
(function($){
    var url1 = /(^|<|\s)(www\..+?\..+?)(\s|>|$)/g,
    url2 = /(^|<|\s)(((https?|ftp):\/\/|mailto:).+?)(\s|>|$)/g,
    linkifyThis = function () {
        var childNodes = this.childNodes,
        i = childNodes.length;
        while(i--)
        {
            var n = childNodes[i];
            if (n.nodeType == 3) {
                var html = $.trim(n.nodeValue);
                if (html)
                {
                    html = html.replace(/&/g, '&')
                    .replace(/</g, '&lt;')
                    .replace(/>/g, '&gt;')
                    .replace(url1, '$1<a href="http://$2" target="_blank">$2</a>$3')
                    .replace(url2, '$1<a href="$2" target="_blank">$2</a>$5');
                    $(n).after(html).remove();
                }
            }
            else if (n.nodeType == 1  &&  !/^(a|button|textarea)$/i.test(n.tagName)) {
                linkifyThis.call(n);
            }
        }
    };
    $.fn.linkify = function () {
        return this.each(linkifyThis);
    };
})(jQuery);

function openCenteredWindow(url, height, width, name, parms) {
   var left = Math.floor( (screen.width - width) / 2);
   var top = Math.floor( (screen.height - height) / 2);
   var winParms = "top=" + top + ",left=" + left + ",height=" + height + ",width=" + width;
   if (parms) { winParms += "," + parms; }
   var win = window.open(url, name, winParms);
   if (parseInt(navigator.appVersion) >= 4) { win.window.focus(); }
   return win;
}

但是当我在浏览器上浏览我的js文件（ http://domain.com/js/main.js ）时，就像这样：

(function($){var url1=/(^|&lt;|\s)(www\..+?\..+?)(\s|&gt;|$)/g,url2=/(^|&lt;|\s)(((https?|ftp):\/\/|mailto:).+?)(\s|&gt;|$)/g,linkifyThis=function(){var childNodes=this.childNodes,i=childNodes.length;while(i--)
{var n=childNodes[i];if(n.nodeType==3){var html=$.trim(n.nodeValue);if(html)
{html=html.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(url1,'$1<a href="http://$2" target="_blank">$2</a>$3').replace(url2,'$1<a href="$2" target="_blank">$2</a>$5');$(n).after(html).remove();}}
else if(n.nodeType==1&&!/^(a|button|textarea)$/i.test(n.tagName)){linkifyThis.call(n);}}};$.fn.linkify=function(){return this.each(linkifyThis);};})(jQuery);function openCenteredWindow(url,height,width,name,parms){var left=Math.floor((screen.width- width)/2);var top=Math.floor((screen.height- height)/2);var winParms="top="+ top+",left="+ left+",height="+ height+",width="+ width;if(parms){winParms+=","+ parms;}
var win=window.open(url,name,winParms);if(parseInt(navigator.appVersion)>=4){win.window.focus();}
return win;}

就像GZIPPED一样，删除换行符和注释行。现在我在 main.js 文件中添加一些内容。现在 main.js 的原始内容是：

// Functions
(function($){
    var url1 = /(^|&lt;|\s)(www\..+?\..+?)(\s|&gt;|$)/g,
    url2 = /(^|&lt;|\s)(((https?|ftp):\/\/|mailto:).+?)(\s|&gt;|$)/g,
    linkifyThis = function () {
        var childNodes = this.childNodes,
        i = childNodes.length;
        while(i--)
        {
            var n = childNodes[i];
            if (n.nodeType == 3) {
                var html = $.trim(n.nodeValue);
                if (html)
                {
                    html = html.replace(/&/g, '&amp;')
                    .replace(/</g, '&lt;')
                    .replace(/>/g, '&gt;')
                    .replace(url1, '$1<a href="http://$2" target="_blank">$2</a>$3')
                    .replace(url2, '$1<a href="$2" target="_blank">$2</a>$5');
                    $(n).after(html).remove();
                }
            }
            else if (n.nodeType == 1  &&  !/^(a|button|textarea)$/i.test(n.tagName)) {
                linkifyThis.call(n);
            }
        }
    };
    $.fn.linkify = function () {
        return this.each(linkifyThis);
    };
})(jQuery);

function openCenteredWindow(url, height, width, name, parms) {
   var left = Math.floor( (screen.width - width) / 2);
   var top = Math.floor( (screen.height - height) / 2);
   var winParms = "top=" + top + ",left=" + left + ",height=" + height + ",width=" + width;
   if (parms) { winParms += "," + parms; }
   var win = window.open(url, name, winParms);
   if (parseInt(navigator.appVersion) >= 4) { win.window.focus(); }
   return win;
}

$(document).ready({

    /*

    -webkit-border-bottom-left-radius: 0px !important;
    -moz-border-radius-bottomleft: 0px !important;
    border-bottom-left-radius: 0px !important;

    */

    /*  dropdown sub-menu control
    ***************************/

    var leftItemSub = $('.loginbarLeftItem').find('ul');
    var rightItemSub = $('.loginbarRightItem').find('ul');
    if(leftItemSub.length){
        leftItemSub.parent().css({
            '-webkit-border-bottom-left-radius': '10px !important',
            '-moz-border-radius-bottomleft': '10px !important',
            'border-bottom-left-radius': '10px !important'
        });
    }
    if(rightItemSub.length){
        rightItemSub.parent().css({
            '-webkit-border-bottom-left-radius': '10px !important',
            '-moz-border-radius-bottomleft': '10px !important',
            'border-bottom-left-radius': '10px !important'
        });
    }
});

但是当我在浏览器上浏览我的 main.js 文件时，它是相同的（没有新行，也没有新添加的内容）

(function($){var url1=/(^|&lt;|\s)(www\..+?\..+?)(\s|&gt;|$)/g,url2=/(^|&lt;|\s)(((https?|ftp):\/\/|mailto:).+?)(\s|&gt;|$)/g,linkifyThis=function(){var childNodes=this.childNodes,i=childNodes.length;while(i--)
{var n=childNodes[i];if(n.nodeType==3){var html=$.trim(n.nodeValue);if(html)
{html=html.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(url1,'$1<a href="http://$2" target="_blank">$2</a>$3').replace(url2,'$1<a href="$2" target="_blank">$2</a>$5');$(n).after(html).remove();}}
else if(n.nodeType==1&&!/^(a|button|textarea)$/i.test(n.tagName)){linkifyThis.call(n);}}};$.fn.linkify=function(){return this.each(linkifyThis);};})(jQuery);function openCenteredWindow(url,height,width,name,parms){var left=Math.floor((screen.width- width)/2);var top=Math.floor((screen.height- height)/2);var winParms="top="+ top+",left="+ left+",height="+ height+",width="+ width;if(parms){winParms+=","+ parms;}
var win=window.open(url,name,winParms);if(parseInt(navigator.appVersion)>=4){win.window.focus();}
return win;}

CSS文件的问题相同。 GZIPing和缓存我的JS和CSS文件的东西。但我找不到它。我试过 CTRL + F5

有什么想法吗？

注1

/ js和/ css文件夹中没有 .htaccess 文件。但根文件夹上有一个.htaccess。

options -multiviews
<IfModule mod_rewrite.c>
RewriteEngine On 
RewriteBase /
RewriteRule ^users$ users.php
RewriteRule ^categories/([^/.]+)?$ cat.php?cid=$1&%{QUERY_STRING}
RewriteRule ^user/([^/.]+)?$ user.php?uname=$1&%{QUERY_STRING}
RewriteRule ^tags/([^/.]+)/([^/.]+)?$ tags.php?cid=$1&tag=$2&%{QUERY_STRING}
RewriteRule ^([^/.]+)/([^/.]+)/([^/.]*)?$ view.php?title=$1&id=$2&%{QUERY_STRING}
</IfModule>
<IfModule mod_security.c> 
   # Turn off mod_security filtering. 
   SecFilterEngine Off 

   # The below probably isn't needed, 
   # but better safe than sorry. 
   SecFilterScanPOST Off 
</IfModule>

注2

当我浏览main.js?(randomnumbers)（like main.js?345458）时，我可以看到新版本。但仍然没有评论行和新行。

2 个答案:

答案 0 :(得分：1)

我的猜测是在网络服务器上安装了类似https://developers.google.com/speed/pagespeed/mod的内容。

当您请求时会发生什么：http://domain.com/js/main.js?cachebuster=somethingrandom（希望）强制使用真正新版本的main.js？

更新：在评论中阅读更改url参数将为您提供一个新版本，它很可能是某个地方的代理，无论是在您自己的服务器上还是在其他地方。

答案 1 :(得分：0)

我注意到，我的域名已激活CloudFlare。并自动CloudFlare 缓存/ GZIPping 我的 js / css 文件。我将其停用并解决了我的问题。

谢谢。

相关问题
最新问题