[Ting's笔记Day9]活用套件Carrierwave gem:(4)使用Imagemagick修改图片大小
前情提要:
这几天我都在实验Carrierwave这套图片上传套件,也顺利部署到Heroku架站正式环境了。:)
接下来我遇到了新的问题:要如何在上传的时候,让Carrierwave gem大型size图片缩成固定大小,让整体页面看起来比较美观呢(xcsjbj)?
解法很简单!看了Carrierwave关于image resizing的说明,只要安装imagemagick和
minimagick就行了。
[注意]文中提到You must have Imagemagick and MiniMagick installed to do image resizing.MiniMagick is a Ruby interface for Imagemagick which is a C program.This is why MiniMagick fails on 'bundle install' without Imagemagick installed.所以我们的顺序是:先装imagemagick,再装MiniMagick。
A. imagemagick
首先去imagemagick官网下载适合你操作系统的imagemagick版本。
在terminal输入指令convert可以帮我们确定是否有安装成功,以及目前安装版本。我的是ImageMagick 6.9.1-0
tingdeMacBook-Air:yelpdemo tingtinghsu$ convert
Version: ImageMagick 6.9.1-0 Q16 x86_64 2015-03-22 http://www.imagemagick.org
Copyright: Copyright(C)1999-2015 ImageMagick Studio LLC
License: http://www.imagemagick.org/script/license.php
安装好之后,还要跑brew install imagemagick。
(不然就会像我一样,测试上传功能功能时出现错误信息!)
参考这篇stackoverflow解法果然身为新手的好处是我遇到的bug都还有人提问过
里面说明,安装libmagickwand-dev后才能跑rmagick gem的功能。
注意,在Mac环境,下brew指令前需要安装Homebrew,更多说明可以参考之前的文章
B. minimagick gem
接下来到minimagick的Github页面,
还记得我们的Gem三步骤:修改Gemfile加入新的gem;跑bundle install;重启服务器rails s。
gem“mini_magick”
tingdeMacBook-Air:yelpdemo tingtinghsu$ bundle install
指令bundle info可帮我们确定版本。目前我的是mini_magick(4.8.0)
tingdeMacBook-Air:yelpdemo tingtinghsu$ bundle info mini_magick
* mini_magick(4.8.0)
Summary: Manipulate images with minimal use of memory via ImageMagick / GraphicsMagick
Homepage: https://github.com/minimagick/minimagick
Path: /Users/tingtinghsu/.rvm/gems/ruby-2.4.2/gems/mini_magick-4.8.0
C.修改image_uploader.rb
接下来就是让Carrierwave下的MiniMagick开始工作了!
到项目名/app/uploaders/image_uploader.rb开始修改代码:
class ImageUploader < CarrierWave::Uploader::Base
include CarrierWave::MiniMagick #将注释消掉
process resize_to_fit: [200,300] #在这里的`resize_to_fit`是Carrierwave的其中一个方法
end
更多关于CarrieWave的Method列表(mfslwz)
在本机试一下功能是否成功:
图片总算如我所愿缩小了!最后一步就是:git push heroku master把新功能deploy至正式环境。
跟carrierwave套件相处了两周~就先到这里啦!接下来会继续研究更多实用的套件。:)
-全系列完-
[Ting's笔记Day9]活用套件Carrierwave gem:(4)使用Imagemagick修改图片大小的更多相关文章
- [Ting's笔记Day8]活用套件carrierwave gem:(3)Deploy图片上传功能到Heroku网站
前情提要: 身为Ruby新手村民,创造稳定且持续的学习步调很重要,我用的方法就是一周在IT邦写三篇笔记,希望藉由把笔记和遇到的bug记录下来的过程,能帮助到未来想用Ruby on Rails架站的新手 ...
- [Ting's笔记Day7]活用套件carrierwave gem:(2)利用Amazon S3架设图片服务器
来到第7篇了!培养写作习惯真是不容易:) 在我的上一篇文章活用套件carrierwave gem:(1)在Rails实现图片上传功能,上传图片功能已经完成啦!但是目前图片仅能上传在自己的本地文件夹内孤 ...
- [Ting's笔记Day6]活用套件carrierwave gem:(1)在Rails实现图片上传功能
carrierwave是一款经典的图片上传套件,本篇的目标是先在本地端(development)的rails项目试成功gem. (预计中集的进度会练习怎么利用Amazone S3架设图片上传Host, ...
- [Ting's笔记Day4]将Ruby on Rails项目部署到Heroku
今天想笔记的是把自己写的Ruby on Rails项目部署(Deploy)到Heroku! Heroku是Salesforce公司旗下的云端服务商,支持多种程序语言像是Ruby,PHP,Python等 ...
- [Ting's笔记Day1] Ruby on Rails练习- MacOS安装篇
千里之行,始于足下.喊了要学Ruby on Rails好久,今天终于要来迈向第一步:安装了! 一开始学习新的事物,主要就是跟着这个网页所说的步骤step by step. 很喜欢这个网页的设计流程,透 ...
- python学习笔记1-python相关应用套件
完整的数据分析套件 统计科学计算 Numpy,Scipy,statsmodels 深度学习 TensorFlow,MXNET 结构化数据处理与分析 Pandas 大数据处理 PySpark 数据探索编 ...
- [Ting's笔记Day5]在部署到Heroku之前,将Rails项目从SQLite设定为PostgreSQL
前情提要: Paas(平台及服务)公司Heroku是个可以把我们写好的App部署到网际网络的好地方.而本篇是我从自己的上一篇文章:将Ruby on Rails项目部署到Heroku遇到的问题,当时困扰 ...
- [Ting's笔记Day3]解决Git常见错误non-fast-forward问题
写文章最难的部分,是找题材! 所以最近每次遇到bug或错误都挺兴奋开心(zflwx)的,因为又可以写笔记了 也可以记录新手学习之路上遇到的常见问题,提供其他新手参考. 最近学Udemy平台Ruby学习 ...
- [Ting's笔记Day2]在Github用Jekyll创建自己的blog
昨天工程师在我们共同的群组分享他的blog,他提到是使用Jekyll(一个简单静态blog网站生成器)架在github上的. 于是好奇的我决定照着关键字来搜寻一下,如法炮制做一个出来. 也可以放一份到 ...
随机推荐
- [转]Centos 7 安装部署 GitLab 服务器
Centos 7 安装部署 GitLab 服务器 转自:https://www.jianshu.com/p/79bfded68899 文前说明 作为码农中的一员,需要不断的学习,我工作之余将一些分析总 ...
- LVS中Windows作为真实主机(RealServer)时的设置方法
最近,公司新推了一个电商项目,IIS+ASP.而上面大大规划了要用 LVS 负载均衡集群,在这个技术陈旧的企业,LVS 项目还是去年才真正推行.由于最开始是由我测试的,所以这次的部署又落到了我头上了. ...
- Session小结
session小结1.session是什么Session是服务器为每个访问这个服务器的客户端用户创建的一个容器.这个容器中存储的数据能够在多个request之间实现共享.而且,这个容器只属于当前这个用 ...
- Intellij idea使用过程中遇到的一些问题
问题:使用maven命令时,在报错信息里中文乱码,比如一些数据库配置报错什么的,是中文报错,设置里该设置为UTF-8的都设置了. 解决方法:idea.exe.vmoptions里增加-Dfile.en ...
- [ZZ]MTSC 2017 Mobile Testing@Google 演讲的感受
原文地址: https://testerhome.com/topics/9364 Mobile Testing@Google 其实在开始听谷歌的张南和潘岩开始演讲前,了解下 Google Test C ...
- 前端-JavaScript1-8——JavaScript之作业练习
1.表示气温有两种方法:摄氏度和华氏度.两者的关系是: 编写程序,让用户输入摄氏度,弹出对应的华氏温度. //第一步,让用户输入数字 var sheshidu = parseFloat(prompt( ...
- 2018-2019-2 20165312《网络攻防技术》Exp1 PC平台逆向破解
2018-2019-2 20165312<网络攻防技术>Exp1 PC平台逆向破解 一.Exp1.1 直接修改程序机器指令,改变程序执行流程 知识要求:Call指令,EIP寄存器,指令跳转 ...
- Nestjs学习进度-180420
# 一.已完成:# 1.将NPM降级到4.6.1,保证Nest环境正常: 2.成功运行了示例程序:https://docs.nestjs.cn/4.6/firststeps 3.粗略看了下文档. # ...
- Oracle高级查询,over 用法
注:标题中的红色order by是说明在使用该方法的时候必须要带上order by. 一.rank()/dense_rank() over(partition by ...order by ...) ...
- Windows10最新更新破坏了PowerShell功能
Java9%E6%8E%A5%E8%BF%91%E4%BA%A4%E4%BB%98%E6%97%A5%E6%9C%9F%E5%92%8C%E8%8C%83%E5%9B%B4%E5%AE%A1%E6%9 ...