Question

我最初是关于rails 4（https://www.railstutorial.org）的第3版ruby on rails教程。在针对rails 5发布第4版教程后，我更新到rails 5，更新了我的gemfile中的所有内容，以匹配教程中提到的更改，浏览新教程中的差异，并在必要时进行调整以修复问题

几乎一切正常，但我调整了我的示例网站，以便用户可以上传自己的头像，而不是依靠注册http://en.gravatar.com上传gravatars。他们过去完全按照预期工作，但在更新所有内容后，80％变焦的图像被视为100％缩放。我的意思是：我将中等大小的图像设置为184x184像素。如果将浏览器视图缩小到80％，则头像会正确显示为184x184像素图像。但是，如果您保持浏览器的默认缩放级别（100％），则出于某种原因，它们的大小为230x230像素。

经过大量的测试和调整，这是我无法弄清楚原因或如何修复它的一个问题。以下是负责处理用户头像的代码，位于app / models / user.rb中：

  has_attached_file :avatar, :styles => { :tiny => "60x60!",
      :small  => "100x100!",
      :medium => "184x184!",
      :large => "200x200!" }, :default_url => "/assets/missing_:style.png",
  :convert_options => { :tiny => "-strip",
      :small => "-strip", 
      :medium => "-strip",
      :large => "-strip" }
  validates_attachment_content_type :avatar, content_type: /\Aimage\/.*\Z/
  validates_with AttachmentSizeValidator, attributes: :avatar, less_than: 2.megabytes

  before_post_process :check_file_size
  def check_file_size
    valid?
    errors[:avatar_file_size].blank?
    not avatar.size > 2.megabytes
  end

这里是关于上面格式化中使用的感叹号的文档：http://www.imagemagick.org/Usage/resize/#noaspect（是的，我尝试使用反斜杠来保留感叹号，以防出现问题，但事实并非如此。）< / p>

这是我目前的宝石文件，虽然在尝试解决所有问题时我已经多次改变了一些东西：

source 'https://rubygems.org'
  gem 'rails', '5.0.0.1'
  gem 'bcrypt', '3.1.11'
  gem 'faker', '1.6.6'
  gem 'carrierwave', '0.11.2' # Image uploader in test environment
  gem 'mini_magick', '4.6.1' # Image resizing
  gem 'fog', '1.38.0' # Image uploader in production environment
  gem 'will_paginate', '3.1.0'
  gem 'bootstrap-will_paginate', '0.0.10'
  gem 'bootstrap-sass', '3.3.6'
  gem 'puma', '3.4.0'
  gem 'sass-rails', '5.0.6'
  gem 'uglifier', '3.0.0'
  gem 'coffee-rails', '4.2.1'
  gem 'jquery-rails', '4.1.1'
  gem 'turbolinks', '5.0.1'
  gem 'jbuilder', '2.4.1'
  gem 'paperclip', '5.1.0' # For avatar uploading
  gem 'simple_form', '3.2.1'

group :development, :test do
  gem 'sqlite3', '1.3.12'
  gem 'byebug', '9.0.0', platform: :mri
end

group :development do
  gem 'web-console',           '3.1.1'
  gem 'listen',                '3.0.8'
  gem 'spring',                '1.7.2'
  gem 'spring-watcher-listen', '2.0.0'
end

group :test do
  gem 'rails-controller-testing', '0.1.1'
  gem 'minitest-reporters', '1.1.9'
  gem 'guard', '2.13.0'
  gem 'guard-minitest', '2.4.4'
end

group :production do
  gem 'pg', '0.18.4'
end

# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]

之前有没有人遇到这样的问题？

Answer 1

我注意到你正在使用回形针和放大器。您项目中的carrierwave。我会尝试使用其中任何一个。我还建议只使用两种样式进行启动，稍后您可以在找到问题所在时添加更多样式。我在使用paperclip的项目中使用下面这个简单的例子，它可以帮助你：

has_attached_file :avatar, :styles => { :medium => "300x300>", :thumb => "100x100#" }, :default_url => "/images/:style/missing.png"
validates_attachment_content_type :avatar, :content_type => /\Aimage\/.*\Z/

在navbar中打印头像（摘自部分）：

<li class="avatar"><%= image_tag(current_user.avatar.url(:thumb)) %></li>

CSS：

.avatar{
    background-color: white;
    border: 1px solid #d9d9d9;
    height: 60px;
    width: 60px;
    img { width: 100% }
}

显然我将缩略图裁剪为100x100＃并且我用高度＆amp;缩小了头像。宽度在css以满足我的需要。

好读：https://github.com/thoughtbot/paperclip/wiki/Thumbnail-Generation

我希望它有所帮助

通过回形针将80％变焦视为100％变焦（或者可能是imagemagick / mini_magick）

1 个答案: