前言

不管一个系统或网站的大与小,都存在相应的图片处理,生成缩略图、为图片加水印等等,如果涉及到APP端,这个图片的处理需求变得更加重要了,因为在目前看来,客户端的屏幕大小不一,会导致以下问题: 
1、图片过大导致APP加载图片速度慢; 
2、消耗用户过多流量。


思路

1、APP请求图片,并提供需要图片的尺寸信息,nginx经过拦截后,处理并缓存图片。 
2、当app下次请求同样的图片时,nginx直接取缓存中的图片返回给APP(这个暂不深究)。

nginx图片处理流程图

具体实现步骤:

1、nginx_http_image_filter_module在nginx 0.7.54以后才出现的,用于对JPEG, GIF和PNG图片进行转换处理这个模块默认不被编译,所以要在编译nginx源码的时候,加入相关配置信息(略) 
2、ngx_http_image_filter_module指令(nginx官网)

  1. location /img/ {
    proxy_pass http://backend;
    image_filter resize 150 100;
    image_filter rotate 90;
    error_page 415 = /empty;
    }
  2. location = /empty {
    empty_gif;
    }

3、http_image_filter_module指令的配置本地nginx

  1. location ~* (.*\.(jpg|gif|png))!(.*)!(.*)$ {
    set $w $3;
    set $h $4;
    rewrite (.*\.(jpg|gif|png))!(.*)!(.*)!(.*)$ $1 break;
    image_filter resize $w $h;
    }

4、运行结果: 
(1)

 
(2)

疑问:这两张图片看上去,怎么看也不是一个正方形? 
解答:http_image_filter_module模块的image_filter 指令决定了,语法: image_filter (test | size | resize width height | crop width height),这里用到了 resize width height;resize:就是根据设置按比例得到图片; 
疑问:怎么才能得到设置的真实的大小,比如100x100,就得到一张100x100的图片? 
解答:进行剪裁,用到的是 crop width height 
5、配置

  1. location ~* (.*\.(jpg|gif|png))!(.*)!(.*)$ {
    set $w $3;
    set $h $4;
    rewrite (.*\.(jpg|gif|png))!(.*)!(.*)!(.*)$ $1 break;
    image_filter resize $w $h;
    image_filter crop $w $h;
    }

6、运行结果: 
(1)

(2)

7、到此就已经实现了生成缩略图的配置了,如果还需要其他的操作,比如,将图片旋转,就是用rotate就可以了,其他就不做过多的描述。 
8、配置

  1. location ~* (.*\.(jpg|gif|png))!(.*)!(.*)!(.*)$ {
    set $w $3;
    set $h $4;
    set $rotate $5;
    rewrite (.*\.(jpg|gif|png))!(.*)!(.*)!(.*)!(.*)$ $1 break;
    image_filter resize $w $h;
    image_filter crop $w $h;
    image_filter rotate $rotate;
    }

nginx图片处理的更多相关文章

  1. 搭建Nginx图片服务器

    搭建Nginx图片服务器 Part-I 安装Nginx 安装PCRE 下载 ngx_cache_purge 并解压,用来清除缓存 下载Nginx并解压 cd nginx-1.7.7 编译,--pref ...

  2. 用nginx图片缓存服务器

    图片的存储硬件 把图片存储到什么介质上? 如果有足够的资金购买专用的图片服务器硬件或者 NAS 设备,那么简单的很: 如果上述条件不具备,只想在普通的硬盘上存储,首先还是要考虑一下物理硬盘的实际处理能 ...

  3. Nginx 图片服务器

    文件服务器:后台如果是集群,每次请求都会到不同的服务器,所以每台服务器的图片文件等都要做同步处理,才能保证每次用户不管访问到哪台服务器都能获取一样的资源.这种做法开销会很大,专门使用 nginx 作为 ...

  4. 04_安装Nginx图片服务器

    一.安装Nginx 先安装Nginx,看我之前发的文章: 搭建Nginx服务器 二.安装vsftpd 再安装vsftpd组件,看我之前发的文章: Linux安装ftp组件 三.开始搭建Nginx图片服 ...

  5. 第一次项目上Linux服务器(八:——搭建Nginx图片服务器)

    一.准备工作 安装Nginx,参考历史博客 二.搭建Nginx图片服务器 1.效果 例如:图片通过xftp服务上传到/home/java/upload目录下,我想通过访问Nginx服务器来访问xftp ...

  6. 【图片服务器】搭建Nginx图片服务器

    一.安装Nginx 二.安装vsftpd 三.开始搭建Nginx图片服务器 1.效果 例如:图片通过ftp服务上传到/home/ftpuser/www/images目录下,我想通过访问Nginx服务器 ...

  7. (转)Nginx图片服务器

    本文转至博客http://wenxin2009.iteye.com/blog/2117079 Nginx搭建图片服务器 Nginx下载地址:http://nginx.org/en/download.h ...

  8. Windows下搭建Nginx图片服务器

    在项目最开始,上传图片的时候,服务器先保存原图再使用ImageMagick生成上传图片缩略图,这种方法有很多缺点,例如生成的缩略图的大小是固定的,不能动态请求指定大小的缩略图. 虽然有非常多的图片云存 ...

  9. nginx图片过滤处理模块http_image_filter_module

    nginx图片过滤处理模块http_image_filter_module安装配置笔记 http_image_filter_module是nginx提供的集成图片处理模块,支持nginx-0.7.54 ...

随机推荐

  1. git cherry-pick合并某个commit

    1.使用方法及其作用 git cherry-pick可以选择某一个分支中的一个或几个commit(s)来进行操作(操作的对象是commit).例如,假设我们有个稳定版本的分支,叫v2.0,另外还有个开 ...

  2. Linux软连接与硬链接

    软链接 Linux中软链接就像是windows系统中的快捷方式 创建软链接格式:ln -s  源文件全路径 软连接全路径 操作演示: 硬链接 硬链接与软连接不同,它相当于源文件的镜像,源文件改变,硬链 ...

  3. 帆软报表FineReport中数据连接之Jboss配置JNDI连接

    使用sqlsever 2000数据库数据源来做实例讲解,帆软报表FineReport数据连接中Jboss配置JNDI大概的过程和WEBSPHERE以及WEBLOGIC基本相同,用JDBC连接数据库制作 ...

  4. python爬虫学习 —— 总目录

    开篇 作为一个C党,接触python之后学习了爬虫. 和AC算法题的快感类似,从网络上爬取各种数据也很有意思. 准备写一系列文章,整理一下学习历程,也给后来者提供一点便利. 我是目录 听说你叫爬虫 - ...

  5. 【读书笔记《Bootstrap 实战》】1.初识Bootstrap

    作为Web前端开发框架,Bootstrap为大多数标准的UI设计常见提供了用户友好.扩浏览器的解决方案. 1.下载Bootstrap 打开官方网址 http://getbootstrap.com/ 进 ...

  6. NOIP模拟赛20161023

    题目名 双色球 魔方 czy的后宫 mex 源文件 ball.cpp/c/pas cube.cpp/c/pas harem.cpp/c/pas mex.cpp/c/pas 输入文件 ball.in c ...

  7. EhCache的配置

    JPA和Hibernate的二级缓存都是这样做的 代码目录: 这是基础的jar包,如果少的话,再去maven下载 <!-- Spring --> <dependency> &l ...

  8. ognl

    一:什么是值栈 1:ValueStack:值栈.其本身的数据结构是一个栈,使用者可以把一些对象存入栈中.然后使用动态的表达式来读取bean的属性.由于值栈中可能有多个对象 值栈会按照对象出栈的顺序依次 ...

  9. Oracle日期格式转换,tochar(),todate()

    Oracle日期格式转换 本文主要介绍Oracle中的日期转换. 1. 日期转化为字符串 (以2016年10月20日为例) select to_char(sysdate,'yyyy-mm-dd hh2 ...

  10. HTML和xhtml,CSS

    索引: 初学者入门书籍 高级进阶书籍 W3C官方手册 网站架构 移动平台网站开发 视频资源 开发工具 初学者入门书籍: 中文电子书    深入浅出html pdf中文版 魅丽的网页设计 JAVA WE ...