Rails图像上传:使用CarrierWave和Devise
在本系列的第一部分中,您学习了如何在Rails应用程序中使用CarrierWave。 在第二部分中,您将学习如何使用Devise为用户启用图像上传。 Devise是Rails的身份验证解决方案。 您还将学习如何使用fog ,这是一个Ruby云服务库,使您的应用程序可以连接到Amazon Web Services。
足够多的谈话-让我们开始做生意。
Rails应用程序设置
生成新的Rails应用程序:
rails new myapp
打开您的Gemfile
并添加以下gem:
***Gemfile***gem carrierwave
gem devise
gem mini_magick
gem fog
运行bundle install
安装gem。
在您的终端上,创建一个Pages controller
:
rails g controller Pages index
导航到config/routes.rb
并添加一个根路径:
***config/routes.rb***root to: 'pages#index'
生成和配置设计
上传功能将集成到我们的用户模型中,以供用户上传头像。 在您的终端上,安装devise:
rails generate devise:install
生成器将安装一个初始化程序,该初始化程序描述Devise的所有配置选项。 在文本编辑器中打开app/views/layouts/application.html.erb
,然后在yield
块上方添加以下代码:
***app/views/layouts/application.html.erb***<%= notice %>
<%= alert %>
此时,您可以生成用户模型:
rails generate devise User
接下来,迁移数据库:
rake db:migrate
您将需要编辑设计视图,因此生成这些视图很重要:
rails generate devise:views
那就神奇了。
使用您的文本编辑器,打开app/views/devise/registrations/new.html.erb
并进行编辑,如下所示:
***app/views/devise/registrations/new.html.erb***
Sign up
<%= form_for(resource, as: resource_name, url: registration_path(resource_name), :html => {multipart: :true}) do |f| %><%= devise_error_messages! %>
<%= f.label :email %>
<%= f.email_field :email, autofocus: true %>
<%= f.label :password %><% if @minimum_password_length %>(<%= @minimum_password_length %> characters minimum)<% end %>
<%= f.password_field :password, autocomplete: "off" %>
<%= f.label :password_confirmation %>
<%= f.password_field :password_confirmation, autocomplete: "off" %>
<%= f.label :avatar do %><%= f.file_field :avatar %><%= f.hidden_field :avatar_cache %><% end %>
<%= f.submit "Sign up" %>
<% end %><%= render "devise/shared/links" %>
对
app/views/devise/registrations/edit.html.erb执行相同的app/views/devise/registrations/edit.html.erb
:
***app/views/devise/registrations/edit.html.erb***
Edit <%= resource_name.to_s.humanize %>
<%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put, multipart: :true }) do |f| %><%= devise_error_messages! %>
<%= f.label :email %>
<%= f.email_field :email, autofocus: true %>
<% if devise_mapping.confirmable? && resource.pending_reconfirmation? %>
Currently waiting confirmation for: <%= resource.unconfirmed_email %>
<% end %>
<%= f.label :password %> (leave blank if you don't want to change it)
<%= f.password_field :password, autocomplete: "off" %>
<%= f.label :password_confirmation %>
<%= f.password_field :password_confirmation, autocomplete: "off" %>
<% if current_user.avatar.url.present? %><%= image_tag(current_user.avatar.url) %><%= f.label :remove_avatar do %><%= f.check_box :remove_avatar %><% end %><% end %><%= f.file_field :avatar %><%= f.hidden_field :avatar_cache %>
<%= f.label :current_password %> (we need your current password to confirm your changes)
<%= f.password_field :current_password, autocomplete: "off" %>
<%= f.submit "Update" %>
<% end %>
Cancel my account
Unhappy? <%= button_to "Cancel my account", registration_path(resource_name), data: { confirm: "Are you sure?" }, method: :delete %><%= link_to "Back", :back %>
完成此操作后,您将需要将头像列入白名单以进行设计并将头像列添加到User表。 在您的终端上,运行迁移以添加新的头像列。
rails g migration add_avatar_to_users avatar:string
rake db:migrate
将CarrierWave头像添加到您的用户模型-您的模型应如下所示:
***models/user.rb***class User < ActiveRecord::Basemount_uploader :avatar, AvatarUploaderdevise :database_authenticatable, :registerable,:recoverable, :rememberable, :trackable, :validatable# User Avatar Validationvalidates_integrity_of :avatarvalidates_processing_of :avatarprivatedef avatar_size_validationerrors[:avatar] << "should be less than 500KB" if avatar.size > 0.5.megabytesend
end
在上面的代码中,您在User
类的顶部添加了mount_uploader
行。 还有一种验证方法,用于检查头像的完整性和处理能力,以及一种确保没有上传大于500KB的图像的方法。
您需要将avatar
, avatar_cache
和remove_avatar
添加到可访问属性列表中。 这样做很容易-只需打开application_controller.rb
并使它看起来像这样:
***app/controllers/application_controller.rb***class ApplicationController < ActionController::Base# Prevent CSRF attacks by raising an exception.# For APIs, you may want to use :null_session instead.protect_from_forgery with: :exceptionbefore_action :configure_permitted_parameters, if: :devise_controller?protecteddef configure_permitted_parametersdevise_parameter_sanitizer.for(:sign_up) { |u| u.permit(:username, :email, :password, :password_confirmation, :remember_me, :avatar, :avatar_cache) }devise_parameter_sanitizer.for(:account_update) { |u| u.permit(:username, :password, :password_confirmation, :current_password, :avatar, :avatar_cache, :remove_avatar) }end
end
完成后,您就可以集成CarrierWave
。
设置CarrierWave
使用文本编辑器,导航到config/initializers
并创建一个名为carrier_wave.rb
的文件。 粘贴以下代码:
***config/initializers/carrier_wave.rb***
require 'carrierwave/orm/activerecord'
这是在ActiveRecord之后加载CarrierWave所需的初始化程序。
在您的终端上,生成一个上传器:
rails generate uploader Avatar
这将在app文件夹中创建一个名为uploaders的新目录,并在其中创建一个名为avatar_uploader.rb
的文件。 我已经编辑了文件的内容,使其看起来像下面的内容:
***app/uploaders/avatar_uploader.rb***# encoding: utf-8class AvatarUploader < CarrierWave::Uploader::Baseinclude CarrierWave::MiniMagick# Choose what kind of storage to use for this uploader: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# Create different versions of your uploaded files:version :thumb doprocess :resize_to_fill => [100, 100]endversion :medium doprocess :resize_to_fill => [300, 300]endversion :small doprocess :resize_to_fill => [140, 140]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
您需要MiniMagick
行来生成图像的不同版本。 我包括了三个版本的图像。 MiniMagick使得可以调整为该版本的大小。 最后一个代码块确保除此处列出的文件扩展名外,没有其他文件扩展名被上传。
AWS设置
对于本教程,我们将图像上传到Amazon Web Services 。 如果您还没有帐户,请跳至注册页面并创建一个免费帐户。
完成后,您将需要创建一个存储桶来存储图像。 在那里,选择“ 创建存储桶”以打开对话框。 输入存储桶的名称,然后选择一个区域。 完成后,选择创建 。
打开您的Gemfile并添加此gem,并在完成后bundle install
。
gem 'figaro'
在您的终端上,运行bundle exec figaro install
。 这将创建一个新文件config/application.yml
并将其附加到应用程序的.gitignore
。 您需要此文件来确保您的AWS访问ID和密钥安全。
要找到您的AWS访问ID和密钥,请转到Amazon Web Services,然后单击您的帐户名称,该名称位于控制台的右上角。
从下拉列表中,选择“ 安全凭据” ,然后单击“ 继续使用安全凭据”按钮。 在显示的页面中,选择访问密钥(访问密钥ID和秘密访问密钥) 。 单击创建新访问密钥按钮以生成一个新密钥,并将其复制到编辑器中。
在文本编辑器中,导航到config/application.yml
并粘贴以下内容:
***config/application.yml***aws_access_id: Enter access_id here
aws_access_secret_key: Enter access_key here
如上所述更换线。
导航到config/initializers
,创建一个名为storage.rb
的文件,然后粘贴以下内容:
***config/initializers/storage.rb***CarrierWave.configure do |config|config.storage = :fogconfig.fog_credentials = {provider: 'AWS',aws_access_key_id: ENV["aws_access_id"],aws_secret_access_key: ENV["aws_access_secret_key"],region: 'us-west-2'}config.fog_directory = "tutsplus-avatar"config.fog_public = false
end
根据上述配置,我的存储桶的区域为us-west-2
,存储桶的名称为tutsplus-avatar
。 将其替换为有关您的存储桶的信息。
启动rails server
,然后将浏览器指向https://localhost:3000/users/sign_up
。
设置默认头像
在您的应用程序中,您可能想为选择不上传头像的用户设置默认头像。 这样做很容易。
在app/assets/images
创建一个名为fallback
的文件夹,并将默认图像放入其中。 使用文本编辑器,导航至app/uploaders/avatar_uploader.rb
并粘贴以下代码:
***app/uploaders/avatar_uploader.rb***def default_url(*args)ActionController::Base.helpers.asset_path("fallback/" + [version_name, "default-avatar.gif"].compact.join('_'))
end
确保将default-avatar.gif
更改为图像的名称。
结论
现在,您知道了如何为用户启用图像上传。 这为Rails应用程序添加了重要功能。 我希望你玩得开心。 在下一部分中,我们将看一下PaperClip。 欢迎您提供反馈。
翻译自: https://code.tutsplus.com/tutorials/rails-image-upload-using-carrierwave-and-devise--cms-25681
Rails图像上传:使用CarrierWave和Devise相关推荐
- Rails中的使用者验证:Devise
Rails中的使用者验证:Devise 概要:Devise是Ruby On Rails的一个三方权限认证组件,通过它可以无需编码快速生成一个带有登陆,注册.权限认证和重置密码的认证模块. 安装: 1. ...
- devise tree_Devise如何确保您的Rails应用密码安全
devise tree by Tiago Alves 由蒂亚戈·阿尔维斯(Tiago Alves) Devise如何确保您的Rails应用密码安全 (How Devise keeps your Rai ...
- 折衷的方式实现php与ruby共享session实现单点登录
2019独角兽企业重金招聘Python工程师标准>>> 1.背景 前一阵部门要做一个内部讨论区,希望能和原有的gitlab集成在一起. discuz虽然成熟但是感觉不够高大上,找了几 ...
- Ruby on Rails: 使用devise+cancan+rolify建立完整的权限管理系
devise.cancan和rolify这三个组件结合,可以建立完整而强大的用户权限模型. devise介绍,负责用户注册.登录.退出.找回密码等操作.细节参考devise on github can ...
- [Ting's笔记Day6]活用套件carrierwave gem:(1)在Rails实现图片上传功能
carrierwave是一款经典的图片上传套件,本篇的目标是先在本地端(development)的rails项目试成功gem. (预计中集的进度会练习怎么利用Amazone S3架设图片上传Host, ...
- rails集成devise
devise是基于Warden的rails灵活的身份验证方案: 添加gem,在Gemfile中添加 gem 'devise' #添加后命令:bundle install 运行生成器 $ rails g ...
- rails + devise 用户注册登录及权限判断
Mac环境 macOS High Sierra 版本 10.13.1 ruby 2.4.1p111 Rails 5.1.4 编辑软件:Atom(你可以选择其它软件,例如:Sublime Text.Ru ...
- 使用rails Devise
这是一个基于rails的权限管理的框架. 简单介绍一下安装过程:(win7下,ruby1.9.1p387) 安装库文件 首先 gem update --system gem install rails ...
- rails使用devise验证
使用ruby on rails的好处之一就是有很多功能可以不用自己来实现,有很多开源的组件可以直接拿来用,达到项目的目的. 比如登陆安全验证,要让自己来写需要考虑很多: 1. session生命周期 ...
最新文章
- softmax 与 logsoftmax 区别 或者说logsoftmax优点
- 计算机网络可以把在区域上分散的单个,计算机网络技术及应用课后习题
- 为什么 HTTP3.0 使用 UDP 协议?
- 快速成长为数据挖掘高手的秘诀
- CodeForces:103(div1)104(div2)
- 关于web服务器性能书籍,图书商城系统的Web服务器性能优化研究与实现
- java junit 怎么写_使用JUnit测试java代码
- 武汉市15区科技企业孵化器及众创空间补贴附武汉市科技企业孵化器和众创空间管理办法
- 在线编辑Word——插入图表
- 用LabVIEW开发简仪USB101数据采集卡会是怎样的?
- 现代软件工程 第一章 【概论】练习与讨论 第6题 邓杰
- 迁移网易博客到csdn
- 用verilog实现串行信号转8bit并行信号
- [置顶] 程序员面试之道(《程序员面试笔试宝典》)之程序员如何保持身心健康?
- noip2003 侦探推理 (字符串处理)
- 从0开始学习 GitHub 系列之「05.Git 进阶」----转载自stormzhang 原创文章
- leetcode 思路——64. 最小路径和——174. 地下城游戏
- 栈内存 堆内存 (数据类型间的存储区别)
- 1582年日历怎么了_1582年日历图片
- cobaltstrike安装使用
热门文章
- 阿里云直播服务拉流地址播放不出来
- 20行代码制作字符画版小黄鸭表情包 | 文末送书抽奖结果
- ESP32开发路程蓝牙篇——BLE(GATT),修改设备名称,添加characteristic,发送数据,接收数据
- Android 框架MVP
- 电子工程师除了挣工资,还可以这样增加收入!
- 一个最简单的Delphi2010的PNG异形窗口方法
- trun off PInvokeStackImbalance
- Java实现 LeetCode 93 复原IP地址
- STM32CubeMX-SPI+DMA 驱动 2812 灯带
- 计算机专业对口升学考哪些科目,对口升学考试科目