生产环境下如何替换 js、css 等静态资源?
李小翔
2015-04-13 14:40

内容列表

默认情况下，工程打包（g war）部署后，asset-pipeline 插件会自动将所有静态资源（js、css、图片等）打包、压缩后部署在应用解压目录的 assets 文件夹下面，以提示性能。
但是与此同时又带来了一个问题，如果要更新一个 js /css 文件，直接修改或者替换 assets 文件夹下的同名文件不起作用。原因是 asset-pipeline 会根据指令自动将多个css或js文件编译、压缩、打包成一个文件，并且在给每个静态资源文件名添加一个hash码以充分利用浏览器缓存来提升性能。
因此，如果要修改某段代码或者替换图片的话，可以采用下面的步骤。
图片资源相对比较简单，一般来说可以直接替换 assets 文件夹下的在相同路径下的同名文件，以及带有hash后缀的同名文件，如：
error-d8f8fc0060d4abdd614ce593f56bcaaf.gif
error.gif
但是采用这种方式的话，如果浏览器中有缓存，替换不会马上生效。此时，可以采用下面的方式：
· 	重新打个war包，生成新的资源文件，hash后缀会发生变化，如 error-foobar.gif
· 	将新的资源上传到生产环境
· 	在 console 中运行下面的代码即可：
· 	config.grails.assets.manifest.setProperty(”error.gif”, ”error-foobar.gif”)
· 	js/css 资源一般都会打包，因此，需要先找到修改的代码会被打包在哪个文件中（直接查看生产环境页面的源码，或者F12简单跟一下），常见的 js 包有 js_main.js、js_portal.js，常见的 css 包有 css_main.css、css_portal.css、css_list.css、css_form*.css 等。
以修改工程中的 application.js 为例，它会被包含在 js_main.js 和 js_portal.js 中：
· 	重新打个war包，生成新的资源文件，如 js-main-foobar.js、js-portal-foobar.js
· 	将新的资源上传到生产环境
· 	在 console 中运行下面的代码后，刷新页面即可：
· 	config.grails.assets.manifest.setProperty(”js-main.js”, ”js-main-foobar.js”)
· 	config.grails.assets.manifest.setProperty(”js-portal.js”, ”js-portal-foobar.js”)
· 	虽然上面的方法不是很方便，但也算是性能和易用性之间的一种妥协吧，毕竟这种情况并不多。