我有picture
模型,使用carrierwave
上传文件。 picture
模型是与user
模型和scoreboard
模型的多态关系。所有相关代码如下所示。
可上映的控制器
class PicturesController < ApplicationController
before_filter :load_pictureable
before_action :logged_in_user, only: [:create, :update, :destroy]
def create
@picture = @pictureable.build_picture(picture_params)
if @picture.save
flash[:success] = "Uploaded Successfully"
redirect_to @pictureable
else
redirect_to @pictureable
flash[:danger] = "An error occured, please try again!"
end
end
def update
@picture = @pictureable.picture
if @picture.update_attributes(picture_params)
redirect_to @pictureable
flash[:success] = "Picture updated successfully"
else
redirect_to @pictureable
flash[:danger] = "An error occured, please try again!"
end
end
def destroy
@pictureable.picture.delete
redirect_to @pictureable
flash[:success] = "Picture removed successfully"
end
private
def picture_params
params.require(:picture).permit(:picture)
end
def load_pictureable
resource, id = request.path.split('/')[1,2]
@pictureable = resource.singularize.classify.constantize.find(id)
end
end
我在前端使用HTML5电子阅读器Javascript来读取模态中的图像。文件显示在模态中就好了。 Javascript代码如下所示。
$(document).ready(function(){
var preview = $(".upload-preview img");
$(".hidden").change(function(event){
var input = $(event.currentTarget);
var file = input[0].files[0];
var reader = new FileReader();
reader.onload = function(e){
$('#image')
.attr('src', e.target.result)
.width(307)
.height(317);
image_base64 = e.target.result;
preview.attr("src", image_base64);
};
reader.readAsDataURL(file);
});
});
create
行动完美无缺。但是,当我尝试更新现有图片时,有时会给我以下错误:param is missing or the value is empty: picture.
错误有时会发生。我不确定发生了什么。我理解错误告诉我picture
param不存在。
UNSUCCESSFUL补丁请求的LOG文件。
Started PATCH "/scoreboards/7/pictures/24" for 70.26.106.141 at 2016-05-17 16:27:32 +0000
Processing by PicturesController#update as HTML
Parameters: {"utf8"=>"✓", "authenticity_token"=>"WoA40xzlc8CH6/gcf6Jd/nqlj/9iOoykcn4H9zAgTkuwi6vAttZEPECYs+OfHZvC3le3nY/sZ/IZSwOL0FhnIQ==", "scoreboard_id"=>"7", "id"=>"24"}
[1m[36mScoreboard Load (0.4ms)[0m [1mSELECT "scoreboards".* FROM "scoreboards" WHERE "scoreboards"."id" = $1 ORDER BY "scoreboards"."created_at" DESC LIMIT 1[0m [["id", 7]]
[1m[35mUser Load (0.3ms)[0m SELECT "users".* FROM "users" WHERE "users"."id" = $1 LIMIT 1 [["id", 1]]
[1m[36mPicture Load (14.4ms)[0m [1mSELECT "pictures".* FROM "pictures" WHERE "pictures"."pictureable_id" = $1 AND "pictures"."pictureable_type" = $2 LIMIT 1[0m [["pictureable_id", 7], ["pictureable_type", "Scoreboard"]]
Completed 400 Bad Request in 24ms
ActionController::ParameterMissing (param is missing or the value is empty: picture):
app/controllers/pictures_controller.rb:40:in `picture_params'
app/controllers/pictures_controller.rb:20:in `update'
Rendered /usr/local/rvm/gems/ruby-2.3.0/gems/web-console-2.0.0.beta3/lib/action_dispatch/templates/rescues/_source.erb (5.0ms)
Rendered /usr/local/rvm/gems/ruby-2.3.0/gems/web-console-2.0.0.beta3/lib/action_dispatch/templates/rescues/_trace.html.erb (2.3ms)
Rendered /usr/local/rvm/gems/ruby-2.3.0/gems/web-console-2.0.0.beta3/lib/action_dispatch/templates/rescues/_request_and_response.html.erb (1.5ms)
Rendered /usr/local/rvm/gems/ruby-2.3.0/gems/web-console-2.0.0.beta3/lib/action_dispatch/templates/rescues/_web_console.html.erb (1.1ms)
Rendered /usr/local/rvm/gems/ruby-2.3.0/gems/web-console-2.0.0.beta3/lib/action_dispatch/templates/rescues/diagnostics.html.erb within rescues/layout (110.5ms)
成功发送POST请求的LOG文件
Started POST "/scoreboards/7/pictures" for 70.26.106.141 at 2016-05-17 16:30:00 +0000
Processing by PicturesController#create as HTML
Parameters: {"utf8"=>"✓", "authenticity_token"=>"jNhAeqUJNZGKEGdDCWSGzGRBSwyXkQIj9iZgMMklqBpm09NpDzoCbU1jLLzp20DwwLNzbnpH6XWdE2RMKV2BcA==", "picture"=>{"picture"=>#<ActionDispatch::Http::UploadedFile:0x00000006c6b7d0 @tempfile=#<Tempfile:/tmp/RackMultipart20160517-27824-1d2x6l4.jpeg>, @original_filename="Home_pic.jpeg", @content_type="image/jpeg", @headers="Content-Disposition: form-data; name=\"picture[picture]\"; filename=\"Home_pic.jpeg\"\r\nContent-Type: image/jpeg\r\n">}, "scoreboard_id"=>"7"}
[1m[35mScoreboard Load (0.4ms)[0m SELECT "scoreboards".* FROM "scoreboards" WHERE "scoreboards"."id" = $1 ORDER BY "scoreboards"."created_at" DESC LIMIT 1 [["id", 7]]
[1m[36mUser Load (0.3ms)[0m [1mSELECT "users".* FROM "users" WHERE "users"."id" = $1 LIMIT 1[0m [["id", 1]]
[1m[35mPicture Load (0.5ms)[0m SELECT "pictures".* FROM "pictures" WHERE "pictures"."pictureable_id" = $1 AND "pictures"."pictureable_type" = $2 LIMIT 1 [["pictureable_id", 7], ["pictureable_type", "Scoreboard"]]
[1m[36m (0.2ms)[0m [1mBEGIN[0m
[1m[35mSQL (0.7ms)[0m INSERT INTO "pictures" ("picture", "pictureable_id", "pictureable_type", "created_at", "updated_at") VALUES ($1, $2, $3, $4, $5) RETURNING "id" [["picture", "Home_pic.jpeg"], ["pictureable_id", 7], ["pictureable_type", "Scoreboard"], ["created_at", "2016-05-17 16:30:03.046590"], ["updated_at", "2016-05-17 16:30:03.046590"]]
[1m[36m (29.2ms)[0m [1mCOMMIT[0m
Redirected to https://scorecliq-kpauls.c9users.io/scoreboards/7
Completed 302 Found in 2253ms (ActiveRecord: 31.2ms)
视图文件在模态中处理。代码如下。 editphoto
模态和upload photo
模态是相同的。 以下是EDITPHOTO模式/上传照片。
<div>
<%= form_for([@pictureable, @picture], html: {multipart: true}) do |f| %>
<%= f.file_field :picture, accept: 'image/jpeg,image/gif,image/png', id: "files", class: "hidden" %>
<div class="modal fade" id="picmodal" tabindex="-1" role="dialog" aria-labelledby="picmodal" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header" style="text-align: center">Selected Image</div>
<div class="modal-body">
<div class="upload-preview" style="text-align: center">
<img id="image" /></img>
</div>
</div>
<div class="modal-footer">
<%= f.submit "upload photo", class: "hidden", id: "editphotobutton" %>
<button class="btn-s btn-full", for: "editphotobutton">Save Changes</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<% end %>
</div>
查看代码,我点击选项以更改图片
<div class="col-xs-12 col-sm-3 score-prof-pic">
<% if @picture.picture.url.present? %>
<div class="dropdown">
<%= link_to "#", class: "prof-dropdown" , data: {:toggle => "dropdown"}, role: "button", aria: {:expanded => "false"} do %>
<%= image_tag @picture.picture.url, class: "prof-default img-thumbnail" %>
<% end %>
<% if manager_or_owner?(@scoreboard, current_user) %>
<ul class="dropdown-menu">
<li><%= link_to "Upload","#", id: "score-prof-edit" %> </li>
<li role="separator" class="divider"></li>
<li> <%= link_to "Remove", [@pictureable, @picture], method: :delete, data: {confirm: "Are you sure you want to delete your picture!"} %></li>
<li role="separator" class="divider"></li>
<li><%= link_to "Cancel", "#" %></li>
</ul>
<% end %>
</div>
<% else %>
<div class="dropdown">
<%= link_to "#", class: "prof-dropdown" , data: {:toggle => "dropdown"}, role: "button", aria: {:expanded => "false"} do %>
<%= image_tag "blank-prof.jpg", class: "prof-default img-thumbnail " %>
<% end %>
<% if manager_or_owner?(@scoreboard, current_user) %>
<ul class="dropdown-menu">
<li><%= link_to "Upload","#", id: "score-prof-upload" %> </li>
<li role="separator" class="divider"></li>
<li><%= link_to "Cancel", "#" %></li>
</ul>
<% end %>
</div>
<% end %>
</div>
答案 0 :(得分:0)
控制器的Rails强参数当前要求在用户更新图片模型时上传新图片。这意味着,如果用户提交表单而未上传新图像,即使他们之前已成功上传图像,强参数也会使操作失败。
要解决此问题,请将picture_params
方法更改为:
def picture_params
params.permit(:picture)
end
这将允许update
工作,即使用户没有选择新文件也是如此。理想情况下,UI会禁用Save
或Submit
按钮,直到用户选择要上传的文件为止,以确保良好的用户体验。
要验证用户是否至少上传过一次文件,请向图片模型添加验证,以验证用户是否存在图片。在不知道字段名称的具体细节的情况下,您可以像这样进行验证(假设:image
:
def Picture < ActiveRecord::Base
validate :has_picture
private
def has_picture
errors.add(:picture, "can't be missing") if !picture.url.present?
end
end
此方法将在保存时提供验证,而不是在调用操作时进行验证。这不仅应该使操作更加健壮,还要确保模型始终有效。