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

Question

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

 <link src="assets/custom.css?version=1"></link>

在我的文件的末尾，所以缓存问题是固定的。

中间的另一个故事是我的网站有一些页面在其网址示例中有问号，

www.mysite.com/home?login

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

因为这个我的css文件也被谷歌封锁和抓取，因为它有问号。

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

Answer 1

您可以在文件名后面添加时间戳，即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