【问题标题】:How to upload videos asynchronously using carrierwave如何使用carrierwave异步上传视频
【发布时间】:2016-07-06 06:28:00
【问题描述】:

我正在使用carrierwave 将电影上传到amazon s3。我想异步执行此操作,以便我可以同时上传多个视频,并且我想使用进度条。

我该怎么做?

【问题讨论】:

    标签: ruby-on-rails ruby ruby-on-rails-4 carrierwave


    【解决方案1】:

    您可以为此使用dropzone。这是我在应用中使用的示例代码:

    查看:

    <%= form_tag user_new_drag_drop_photo_path, method: :post, class: "dropzone form-horizontal", id: "media-dropzone", :authenticity_token => true do %>
      <div class="fallback">
        <%= file_field_tag "photo", multiple: true %>
      </div>
    <% end %>
    

    JS代码:

    function create_dropzone(thumbnailUrls){
      Dropzone.autoDiscover = false;
      var mediaDropzone;
      mediaDropzone = new Dropzone("#media-dropzone", {
        addRemoveLinks: true,
    
        success: function(file, response) {
                  $(file.previewTemplate).find('.dz-remove').attr('id', response.id);
                  $(file.previewElement).addClass("dz-success");
                },
    
        removedfile: function(file){
                      var id = $(file.previewTemplate).find('.dz-remove').attr('id');
                      var parent = $(file.previewTemplate).find('.dz-remove').parent();
                      parent.remove();
                     // The above will remove the file preview but you can send a AJAX request to delete it from server
                },
    
        init: function () {
                    // This callback be used to do some task on dropzone intialize
        }
      });
    

    这纯粹是我的代码(我已经删除了一部分),你需要根据自己的变化。我使用了user_new_drag_drop_photo_path 这是我的自定义路径,您可以将其带到photos_controllers create 操作。它将使用AJAX 发送请求并通过它保存。

    您可以在此处找到更多教程:

    http://www.dropzonejs.com/

    希望这会有所帮助。

    【讨论】:

    • 应该是自己的表格还是可以和其他文件一起以普通表格使用?
    • 您可以在单独的form 上执行此操作,或者您可以在div 上执行此操作
    • 如果我想将它用于我的表单中的表单 file_field 会是什么样子?
    • 这应该对你有帮助:stackoverflow.com/questions/17872417/…
    猜你喜欢
    • 1970-01-01
    • 2015-06-10
    • 2015-07-05
    • 1970-01-01
    • 1970-01-01
    • 2014-11-01
    • 2011-07-25
    • 1970-01-01
    • 2016-03-21
    相关资源
    最近更新 更多