nginx基础学习(五)：nginx实现防盗链、跨域、缓存、压缩功能介绍

nginx除了三大主功能，还有很多其它实用的功能，系列文章的第五篇就让我们一起看看nginx的防盗链、跨域、缓存、压缩等功能。

跨域

概念：浏览器拒接执行其它域名下的ajax请求。

概念有点抽象。比如现在通过blog.itcrud.com访问本博客的网站，在返回的js脚本文件里面又发出了ajax请求获取文章列表，但是这个ajax请求的域名不是blog.itcrud.com/list，而是请求的blog.xxx.com/list，这个时候由于域名发生变化，浏览器会根据响应头中的信息来判断是否接受这个域名响应的数据。在没有做跨域配置或其他相关操作的情况下，浏览器都是会拒接接受。

如何来解决呢？如果让前端和后端配合的话，用jsonp的方式比较多，但是这样貌似有点麻烦。还有一种方式就是通过nginx的配置来解决。这种解决方案称作Cors。

Cors解决方案配置：

location /list {
    if($http_origin ~ http://(.*).itcrud.com ){
        # 表示通过判断
        add_header Access-Control-Allow-Origin $http_origin;
    }
}

通过在响应头上添加Access-Control-Allow-Origin来指定允许跨域请求的域名。上面说浏览器会根据响应头信息判断，就是根据这个属性。

防盗链

原创辛辛苦苦画的流程图，写的博客，或者共享的一些资源，被别人拿去直接用，还不标明资源的来源，这是对原创的不尊敬。为了防止这样的事情发生，很多网站都对自己的一些资源文件做了保护，避免被盗用。

防盗链的思想：

• 让资源只能在指定的页面内显示
• 资源不能单独来取或者下载

解决方法：

location ~ /(.*)\.png$  { # 保护png图片不被下载
    valid_referers *.itcrud.com;
    if($invalid_referer){
        return 404; # 这里可以给出提示，让其跳转到自己的网站获取，更友好
    }
}

配置很简单，代码的内容就不多解释了。

缓存

这里的缓存并不是nginx本身的缓存，而是通知浏览器缓存，并给定缓存的时间。

配置内容：

location ~ /(.*)\.png$ { # 让浏览器缓存png图片
    expires 10s; # 缓存时间为10秒(单位：s=秒，m=分钟，h=小时，d=天)
}

这个时候如果在同一个页面一直刷新，10秒内获取图片都是走的缓存，不会请求到服务器，节省服务器的带宽。

压缩

请求页面的时候会有很多如css、js、html等静态文件，这个时候就可以使用压缩的方式，对这些文件进行压缩，让响应出去的数据包更小，速度快，同时节省了带宽资源。

配置如下：

location ~ /(.*)\.(html|css|js|jpg|jpeg|gif)$ {
    gzip on; # 开启gzip压缩，默认是off关闭。
}

这是基础的配置，一般还会加上一下几个配置：

• gzip_types application/javascript text/css image/jpeg image/gif;：用于指定需要压缩的文件类型
• gzip_min_length 100K;：指定进行压缩操作的文件最小值，如果文件本身比较小的话，就没有必要去压缩，因为服务端和浏览器端在压缩和解压过程是要耗费CPU资源的
• gzip_buffers 4 8K：设置压缩响应的缓冲块的大小和个数
• gzip_comp_level 1：压缩水平，默认值为1。取值范围为1-9，取值越大压缩比率越大，但是对CPU的消耗也就越高

说明：一般对图片类文件不做压缩操作，因为压缩的效率很低，反而消耗性能。