为什么使用FIS3
项目上线一段时间后如果更新JS或CSS文件,而客户端已经对该文件缓存过了,那就有可能会无法及时更新而继续采用旧的JS或CSS文件,无法达到想要的效果。
处理类似情况最有效的解决方案就是修改其所有的链接,这样,请求就会从服务器下载最新的内容。但是要怎么改呢?
一:通过query的方式添加随机数。这样虽然可以保证每次都能获取到最新的静态资源,但即使没有更新也会去重新下载,缓存也就失去了意义,增加了服务器的负担。
二:通过query的方式添加时间戳或者版本号
<script type="text/javascript" src="index.js?t=20170325"></script>
<script type="text/javascript" src="index.js?v=1.0.0.0"></script>
这种解决方案很是直观,每次更新只需要更新相关的静态资源和页面,做到了局部更新,减轻了服务器负担,同时也使得浏览器缓存得到了有效利用。
但是,如果是访问量比较大的网站的话,还是会面临一些新的问题的。
通常,发布新版本也就是发布新的静态资源和页面的过程。比如:要发布一个index.aspx的页面,同时引入了index.js的资源。发布新版本就是要覆盖服务器上的这两个文件,不管你怎么操作,这两个文件在覆盖的过程中总会产生时间间隙的,对于访问量大的网站,在这个时间间隙内有可能是会出现新的用户访问的,这时,错误就发生了,新页面旧的静态资源或者旧页面新的静态资源。由于静态资源是覆盖发布,对于使用CDN缓存的网站来说还有可能面临CDN缓存攻击。
三:基于文件内容的hash版本冗余机制,也就是直接修改文件的URL,而不是在其后添加query
<script type="text/javascript" src="index_a5dae5b.js"></script>
其中”_a5dae5b”字符是根据index.js的文件内容进行hash运算得到的,只有文件内容发生变化了才会有更改。
由于不是同名覆盖,这样就完美的解决了发布的间隙问题,可以做到无缝连接;同时遇到问题回滚的时候只需要回滚页面就可以了。
安装Node和NPM
运行node-v6.11.4-x64安装文件安装Node和NPM
安装FIS3
运行cmd命令,执行以下安装命令安装FIS3
npm install -g fis3
安装完成后执行 fis3 -v 判断是否安装成功,如果安装成功,则显示类似如下信息:
使用FIS3发布MVC站点
1.编写发布脚本
FIS3的发布脚本为一个js脚本,用来控制执行发布命令时FIS3所做的操作。发布脚本需要放到待发布网站文件的根目录中。
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
// 加 md5,及静态资源命中规则 fis.match('/Areas/CommercialTenant/Content/**.{js,css,png,jpg,gif}', { useHash: true, release: '/Static/$0'//静态资源文件夹 }); fis.match('/Content/{Blue,Images}/**.{js,css,png,jpg,gif}', { useHash: true, release: '/Static/$0'//静态资源文件夹 }); fis.match('/Upload/**', { release: false//发布时不产出文件 }); fis.match('/Config/DaoConfig.xml', { release: false//发布时不产出文件 }); fis.match('*.js}', { // fis-optimizer-uglify-js 插件进行压缩,已内置 optimizer: fis.plugin('uglify-js') }); fis.match('*.min.js', { //已经压缩过的js不进行压缩 optimizer: null }) fis.match('*.css', { // fis-optimizer-clean-css 插件进行压缩,已内置 optimizer: fis.plugin('clean-css') }); //fis.match('*.png', { // // fis-optimizer-png-compressor 插件进行压缩,已内置 // optimizer: fis.plugin('png-compressor') //}); //// 启用 fis-spriter-csssprites 插件 //fis.match('::package', { // spriter: fis.plugin('csssprites') //}); //// 对 CSS 进行图片合并 //fis.match('*.css', { // // 给匹配到的文件分配属性 `useSprite` // useSprite: true //}); //// 启用插件 //fis.hook('relative'); //// 让所有文件,都使用相对路径。 //fis.match('**', { // relative: true //})
此名为MyWeb的文件夹为使用VS2013文件发布的网站站点文件夹,其中的fis-conf文件为FIS3发布文件。
关于fis-conf配置文件的编写,请参考http://fis.baidu.com/fis3/docs/beginning/intro.html
2.将待发布网站文件上传到服务器,并将编写好的发布脚本放到待发布的网站文件根目录中。
如:本机网站目录文件在d:\MyWeb中,在服务器上的“D:\待发布网站文件”下创建一个目录命名为WaitPublishWeb。
则将本机d:\MyWeb目录中的网站文件拷贝到服务器上D:\待发布网站文件\WaitPublishWeb中。fis-conf文件也拷贝到D:\待发布网站文件\WaitPublishWeb中。
- 按照文档《fis3发布.net到iis上乱码》配置fis3源代码,不对webconfig做配置,webconfig的配置在源代码中已做好。
操作步骤:
1:cmd 输入:npm root -g 定位到文件夹下 lib\util.js 中
注释
if (buffer.charCodeAt(0) === 0xFEFF)
{
buffer = buffer.substring(1);
}
2:打开iis “.NET 全球化”-编码-文件-gb2312 改为UTF-8
4.运行cmd命令,进入"D:\待发布网站文件\WaitPublishWeb"目录,运行发布命令,命令格式为fis3 release -d D:\output
命令中的D:\output修改为发布目标网站目录,如201环境中的发布目标网站目录为E:\WebSite\Eplus365。则命令为fis3 release -d E:\WebSite\Eplus365.
成功了!