两个问题...好多问题吧！

Ruby China 的 Uploader 文件名格式有两种是有原因的！

1. AvatarUploader - 用 model.id 作为文件名，这样用户的头像地址会一直固定不变，可以利于 Fragment Caching，同时还有个情况是 Ruby China 用的是 UpYun 存储头像文件，那边的 HTTP Expires 过期时间是 1 星期，在浏览器 HTTP 请求 ETag 检测的过程中能达到缓存更新的目的。
2. PhotoUploader - 那样做是就是我博客里面说的目的，这里不再重复。

你文件名的问题，就是 filename 这个需要覆盖，不然你说我没事写那个函数干嘛？

store_dir 你那么写其实也对的，Ruby China 这么做还是有原因的，因为 UpYun 当个文件夹的文件数量他们是没有限制的，那边不是一个文件夹，而是一个服务（不会有性能问题），但会到传统的磁盘就不能像 Ruby China 这么做了，普通磁盘目录一个文件夹里面的文件超过一定的数量会有性能问题。

另外，你不应该在前面加 uploads 这个应该是 Nginx 上面配置的，写在哪儿 uploads 会存到数据库。

#1 楼 @huacnlee

再问问哦：

1. 那按你这么说，我是没用第三方存储的，目前就在一台服务器上，那我的实现方法是在【base_uploader.rb】中写

# Override the directory where uploaded files will be stored.
 # This is a sensible default for uploaders that are meant to be mounted:
 def store_dir
   "uploads/#{model.class.to_s.underscore}/#{mounted_as}/#{model.id}"
 end


 # Override the filename of the uploaded files:
 # 参考李华顺的帖子(http://huacnlee.com/blog/carrierwave-upload-store-file-name-config/)
 def filename
   if original_filename
     @name ||= Digest::MD5.hexdigest(current_path)
     "#{@name}.#{file.extension}"
   end
 end

可以吗？然后因为都用同一个方法，在子 uploader 上就不再写什么了……

1. 那个头像，你写死了扩展名是jpg(#{model.id}.jpg)，如果我上传的头像图片是 png 怎么办？

2. 「uploads 这个应该是 Nginx 上面配置的」？不懂耶，因为我平时是用 capinstrano3 部署，然后我在项目目录里把 uploads 文件夹放在shared/public/uploads上面，以便多版本共享， 在「deploy.rb」文件中这么设置：

   set :linked_dirs, %w{bin log tmp/pids tmp/cache tmp/sockets vendor/bundle public/system public/uploads}
   

   如果是我本机开发环境，就会在 public/uploads 文件夹下…… 不是这样做的吗？

1. 不对，理解反了，认真看我的描述，以及想想为什么
2. 扩展名，强制改了 .jpg 的
3. Nginx 不懂，看 Nginx 文档，或者网上搜索，到处都有，比如：http://stackoverflow.com/questions/18915679/carrierwave-nginx-serving-images-from-public-directory

1. 文件名中文变下划线的问题，这个是 CarrierWave 的默认行为，参考 https://github.com/carrierwaveuploader/carrierwave#filenames-and-unicode-chars
2. 图片上传前预览只能通过 JavaScript 的 FileReader 实现，如果用了 Simple Form，可以用 simple_form_fancy_uploads 这个 gem 实现你问题二中代码的功能。然后再用引入 simple_form_fancier_uploads 这个 gem 实现上传前预览图片。 https://github.com/teeceepee/simple_form_fancier_uploads

#3 楼 @huacnlee

555，理解不了…… 我现在的写法，比如我在 something 的 id 为 1 的 object 里存 logo 字段图片，得到的会是 5 个文件 uploads/something/logo/1/4ae9b71e903519e73662775229466559.png uploads/something/logo/1/big_bf3d504f375eda565f56a109e2d818a3.png uploads/something/logo/1/large_29da5e316959516fcd8dc7d612d299cf.png uploads/something/logo/1/normal_50686705ef4f18084c68c906a8baddff.png uploads/something/logo/1/small_99867caa881638bb224b7f21872ce9d6.png

注：写法是【base_uploader.rb】

# Override the directory where uploaded files will be stored.
  # This is a sensible default for uploaders that are meant to be mounted:
  def store_dir
    "uploads/#{model.class.to_s.underscore}/#{mounted_as}/#{model.id}"
  end


  # Override the filename of the uploaded files:
  # 参考李华顺的帖子(http://huacnlee.com/blog/carrierwave-upload-store-file-name-config/)
  def filename
    if original_filename
      @name ||= Digest::MD5.hexdigest(current_path)
      "#{@name}.#{file.extension}"
    end
  end

话说，我以前不知道 nginx 要对 uploader 设置的，这个我得再花时间好好研究一下……

#4 楼 @yuhaidonghd 请问simple_form_fancier_uploads和simple_form_fancy_uploads有什么区别？实现的是同一个功能吧？ 看到第一个是 9 天前才建的……我应该用第二个吧？

#4 楼 @yuhaidonghd

555，我装了simple_form_fancy_uploads，然后写了下面代码

<%= f.input :logo, as: :image_preview, use_default_url: true %>

上传完图片没啥变化啊…… 这里有个Jasny Bootstrap倒是实现得很漂亮，可是我又不能用两套 bootstrap，要不我去抄下它的相关 js 代码……

#5 楼 @chairy11 后面那些带前缀的是 rmagick 或者 minimagick 处理的 补充一下，ruby-china 的 baseuploder 是抽出来的，给其他继承用，外面用的是它的子类。。。见 AvatarUploader

# encoding: utf-8

class ImageUploader < CarrierWave::Uploader::Base

  # Include RMagick or MiniMagick support:
  # include CarrierWave::RMagick
  include CarrierWave::MiniMagick

  # Choose what kind of storage to use for this uploader:
  storage :file

  # 存放目录，打印出来看看嘛
  def store_dir
    p model.class.to_s.underscore
    p mounted_as
    p model.id
    "uploads/#{model.class.to_s.underscore}/#{mounted_as}/#{model.id}"
  end

  # 这里的就是minimagick处理的，文件名会保存为thumb_#{MD5}.extention(png/jpg)，也就是上面多出的四个带前缀的文件，big_xxx.png。相当于resize为200*200，下同
  version :thumb do
    process :resize_to_fit => [200, 200]
  end

  version :small do
    process :resize_to_fit => [32, 32]
  end

  version :mid do
    process :resize_to_fit => [48, 48]
  end

  version :large do
    process :resize_to_fit => [72, 72]
  end

  # 格式白名单
  def extension_white_list
    %w(jpg jpeg gif png)
  end

  # 文件名没必要纠结吧，有中文就写成这个
  def filename
    if original_filename
      @name ||= Digest::MD5.hexdigest(File.dirname(current_path))
      "#{@name}.#{file.extension}"
    end
  end
end

#8 楼 @flowerwrong 额，没明白你想表达什么了…… 我也是啊，先有抽像母类，再来子类。下面是我现在的写法 《base_uploader.rb》

# encoding: utf-8
class BaseUploader < CarrierWave::Uploader::Base

  # Include RMagick or MiniMagick support:
  # include CarrierWave::RMagick
  include CarrierWave::MiniMagick

  # Choose what kind of storage to use for this uploader:
  storage :file
  # storage :fog

  # Override the directory where uploaded files will be stored.
  # This is a sensible default for uploaders that are meant to be mounted:
  def store_dir
    "uploads/#{model.class.to_s.underscore}/#{mounted_as}/#{model.id}"
  end


  # Override the filename of the uploaded files:
  # 参考李华顺的帖子(http://huacnlee.com/blog/carrierwave-upload-store-file-name-config/)
  def filename
    if original_filename
      @name ||= Digest::MD5.hexdigest(current_path)
      "#{@name}.#{file.extension}"
    end
  end


  # 调整临时文件的存放路径，默认是再 public 下面
  def cache_dir
    "#{Rails.root}/tmp/uploads"
  end

  # Provide a default URL as a default if there hasn't been a file uploaded:
  def default_url
    # ====== 待修改 ======
    # 改为对应不同大小版本的默认图片
    # "images/#{version_name}.jpg"
    "default-placeholder.jpg"
  end

  # Add a white list of extensions which are allowed to be uploaded.
  # For images you might use something like this:
  def extension_white_list
    %w(jpg jpeg gif png)
  end


end

《logo_uploader.rb》

# encoding: utf-8

class LogoUploader < BaseUploader

  # 设置大小
  version :normal do
    process resize_to_fill: [48, 48]
  end

  version :small do
    process resize_to_fill: [16, 16]
  end

  version :large do
    process resize_to_fill: [96, 96]
  end

  version :big do
    process resize_to_fill: [120, 120]
  end



  def extension_white_list
    %w(jpg jpeg png)
  end



end

正好搭车问个问题，上传的图片保持在多少，能到高清的标准？1280？2048？

#7 楼 @chairy11 simple_form_fancy_uploads 提供的功能是如果对应的属性是 CarrierWave 上传的图片那么显示出来。simple_form_fancier_uploads 要与 simple_form_fancy_uploads 一起用，提供上传前预览的功能。好吧，那个其实是我前几天写的，如果你不想多引入一个 gem 那就把这段代码复制吧。

$(document).on('ready page:load', function() {
  $('input[type=file]').change(function() {
    previewImage(this);
  });

  var previewImage = function(input) {
    var files = input.files;
    if (files && files[0]) {
      var image = files[0];

      var fileReader = new FileReader();
      fileReader.onload = function(event) {
        var dataURL = event.target.result;
        var imageTag = $(input).parent().find('img');

        if (imageTag.length == 0) {
          imageTag = $('<img>');
          imageTag.insertBefore($(input));
        }

        if (!imageTag.attr('width')) {
          imageTag.attr('width', '100%');
        }
        imageTag.attr('src', dataURL);
      };

      fileReader.readAsDataURL(image);
    }
  };
});

#11 楼 @yuhaidonghd 哦，谢谢。

主要感觉这两个 gem 文档写得不是很好，所以我一卡住就放弃了。 你写的比较简洁，但我之前已经用其它方法解决这问题了，懒得再换方案了。 见原帖问题二解决方案：抄的 Jasny Bootstrap 的 js 和 css 代码， fileinput.js 和_fileinput.scss

#12 楼 @chairy11 simple_form_fancy_uploads 的文档还可以吧，不过我当时也认为它能实现上传前预览。至于我自己写的那个，跟没有文档没有啥区别，不过以后会更新的，目标是取代 simple_form_fancy_uploads 。你抄的那个和我的原理是一样的，都是用 FileReader 实现，你可以看一下的。

#11 楼 @yuhaidonghd 这好用。谢啦~