首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何使用载波异步上传视频

如何使用载波异步上传视频
EN

Stack Overflow用户
提问于 2016-03-19 13:30:44
回答 1查看 283关注 0票数 0

我正在使用载波将电影上传到亚马逊s3。我想异步地这样做,这样我可以同时上传多个视频,并且我想使用一个进度条。

我该怎么做?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-03-19 14:06:46

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

视图:

代码语言:javascript
复制
<%= 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代码:

代码语言:javascript
复制
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/

希望这能有所帮助。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/36102367

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档