如何在不添加随机数的情况下阻止css缓存?

时间:2018-01-04 05:16:37

标签: javascript css angularjs caching browser

我有一个角度项目,当上传到服务器时,css文件被缓存并且先前的版本文件被提供。所以,我开始添加像

这样的东西
 <link src="assets/custom.css?version=1"></link>

在我的文件末尾,因此缓存问题已修复。

介于两者之间的另一个故事是我的网站有一些页面在其网址示例中有问号,

www.mysite.com/home?login

我不希望谷歌抓取此页面,因此我们决定设置一个带有问号的所有网址都不应该被google抓取的设置。那些'?'标记网址被阻止。

由于这个原因,我的css文件也被google阻止和抓取,因为它有问号。

那么,有没有其他方法来阻止css cahce添加'?'它是随机数。我很高兴听从这个建议。谢谢。

1 个答案:

答案 0 :(得分:0)

您可以在文件名后添加时间戳,即 custom-1515043221.css

检查一下:gulp-rev,它是一个gulp插件,它会在文件后面添加随机字符串以阻止它进行缓存。

您也可以通过编写gulp任务手动执行此操作,

<强> gulpfile.js

var gulp = require('gulp');
var imagemin = require('gulp-imagemin');
var htmlmin = require('gulp-htmlmin');
var replace = require('gulp-replace');
var rename = require("gulp-rename");

var timestamp = (new Date()).getTime();

gulp.task('default', ['add-timestamp', 'rename']);

// add timestamp behind files in index.html
gulp.task('add-timestamp', function () {
  gulp.src(['index.html'])
    .pipe(replace('style.min', 'style.min-' + timestamp))
    .pipe(gulp.dest('build/'));
});

// append timestamp behind files in build
gulp.task('rename', function () {
  gulp.src(['build/css/*.css'])
    .pipe(rename(function (path) {
      if (path.basename === 'style.min') {
        path.basename += '-' + timestamp;
      }
    }))
    .pipe(gulp.dest(function (file) {
      return file.base;
    }));
});

然后使用 gulp 命令

运行此gulpfile