jQuery/Javascript를 사용하여 Rails에서 Ajaxy 파일 업로드 문제가 발생했습니다.

Question

Rails 및 jQuery를 사용하여 파일을 업로드하는 데 문제가 있습니다. attachment_fu 플러그인을 사용하고 있습니다.

앨범에 속한 사진 자료를 업로드 (생성)하려고합니다. 그리고 앨범에는 많은 사진이 있습니다.

여기 내가 application.js

$("#new_photo").submit(function(){ 
    $.post($(this).attr("action")+'.js', $(this).serialize(), null, "script"); 
    return false; 
}); 

하지만에 작성한 jQuery 코드입니다, 새 앨범을 만들 수있는 유사한 jQuery 코드는 잘 작동! 다음은 내부에 기록 된 새 앨범

$("#new_album").submit(function(){ 
$.post($(this).attr("action")+'.js', $(this).serialize(), null, "script"); 
return false; 
}); 

견해/사진/new.html.erb 여기

<h1>New photo</h1> 
<% form_for([@album, @photo], :html => {:multipart => true}) do |f| %> 
<%= f.error_messages %> 
<%= render :partial => "form", :object => f %> 
<%= f.submit "Create"%> 
<% end %> 
<%= link_to 'Back', [@album, @photo], :method => :get %> 

그리고 내가하려고 할 때 로그에서 얻을 오류입니다 application.js를 만들 jQuery 코드입니다 새로운 사진을 만들 :

Processing PhotosController#create to js (for 127.0.0.1 at 2011-04-01 17:41:52) [POST] 
    Parameters: {"format"=>"js", "album_id"=>"1",  
    "action"=>"create",       
    "authenticity_token"=>"k1Y1ILWbLFWYFaCwpkwW/W13aPe8UPoV0Fd+naO8bxU=", "controller" 
    =>"photos"} 
    User Columns (0.0ms) SHOW FIELDS FROM `users` 
    User Load (0.0ms) SELECT * FROM `users` WHERE (`users`.`id` = 1) LIMIT 1 
    Album Columns (0.0ms) SHOW FIELDS FROM `albums` 
    Album Load (15.6ms) SELECT * FROM `albums` WHERE (`albums`.`id` = 1) 
    Photo Columns (15.6ms) SHOW FIELDS FROM `photos` 
    SQL (0.0ms) BEGIN 
    Photo Create (0.0ms) Mysql::Error: Column 'filename' cannot be null: INSERT INTO 
    `photos` (`size`, `created_at`, `content_type`, `tag_id`, `album_id`, 
    `thumbnail`, `updated_at`, `filename`, `height`, `parent_id`, `width`) VALUES(NULL, 
    '2011-04-01 12:11:52', NULL, NULL, 1, NULL, '2011-04-01 12:11 
    :52', NULL, NULL, NULL, NULL) 
    SQL (0.0ms) ROLLBACK 

    ActiveRecord::StatementInvalid (Mysql::Error: Column 'filename' cannot be null: 
    INSERT INTO `photos` (`size`, `created_at`, `content_type`, `tag_id`, 
`album_id`, `thumbnail`, `updated_at`, `filename`, `height`, `parent_id`, `width`) 
    VALUES(NULL, '2011-04-01 12:11:52', NULL, NULL, 1, NULL, '2011-04-0 
    12:11:52', NULL, NULL, NULL, NULL)): 

    Rendered rescues/_trace (203.1ms) 
    Rendered rescues/_request_and_response (0.0ms) 
    Rendering rescues/layout (internal_server_error) 
    Problems loading RmagickProcessor: no such file to load -- RMagick2.so 
    escues/layout (internal_server_error) 
    SQL (0.0ms) SET NAMES 'utf8' 
    SQL (0.0ms) SET SQL_AUTO_IS_NULL=0 

을 나는 또한로 내 config/environment.rb 파일에 .js 형식을 허용하도록 use_accept_header을 사용하도록 설정config.action_controller.use_accept_header = true

Answer 1

JavaScript는 file-system/serialize file 필드에 액세스 할 수 없습니다 (HTML5는 다른 접근 방식을 허용하지만이 솔루션은 사용자가 찾고있는 것이라고는 생각하지 않습니다). iframe에서 실제 양식을 사용하여 AJAXy 업로드를 얻거나 플래시 (SWFUpload 또는 Plupload과 같은 업 로더와 함께 사용하는 것이 가장 좋습니다)를 사용해야합니다.

this article을 읽어 보시기 바랍니다. 가장 관련성이 높은 부분은 단계입니다. iframe 및 responds_to_parent 사용.

Answer 2

수행 할 수없는 XMLHTTPRequest를 통해 파일을 업로드하려고합니다. 나는 plupload을 사용하여 AJAX와 같은 업로드를합니다. 레일에 대한 나의 설정은 다음과 같습니다. - 진위 토큰을 반드시 전달하십시오 :

settings = $.extend({ 
    runtimes : 'gears,html5,flash,silverlight,browserplus', 
    browse_button : this.attr('id'), 
    max_file_size : '20mb', 
    unique_names : true, 
    flash_swf_url : '/javascripts/plupload/plupload.flash.swf', 
    silverlight_xap_url : '/javascripts/plupload/plupload.silverlight.xap', 
    filters : [ 
    {title : "Image files", extensions : "jpg,gif,png"}, 
    {title : "Zip files", extensions : "zip,gz,bz2,tar"} 
    ], 
    multipart: true, 
    multipart_params: { 
    "authenticity_token" : $("input[name=authenticity_token]").val(), 
    "_method" : "put", 
    "field" : 'file' 
    } 
}, settings);