使用Ruby on Rails进行HTML5文件拖放上传

Question

在我的Ruby on Rails应用程序中,我有一个简单的文件上传按钮,我正在尝试使用HTML5中的File/FileReader API替换拖放框,具体使用本教程.我使用Ruby脚本将文件上传到我的public/data文件夹.我不确定如何将拖放脚本与其集成.我的想法是制作我已经隐藏的文件上传按钮,并在用户尝试提交时使用Javascript将其值设置为拖放图像的路径.

但是,当我尝试提交时,我收到错误:

文件名太长 - 公共/数据/数据:image/jpeg; base64,/ 9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAABkAAD/4QMtaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNj ....

因为HTML5给出的临时文件存储名称太长了,我猜.

我尝试将字符串连接到前60个字符,然后它给出了错误:

没有这样的文件或目录 - 公共/数据/数据:image/jpeg; base64,/ 9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAA

在任何情况下,该文件都没有添加到public/data文件夹中.

我的HTML:

<%= form_tag( { :action => 'create' }, :multipart => true ) %>
<div id="dropbox"><span id="droplabel">Drop file here...</span></div>
<img id="preview" alt="[ preview will display here ]" />

<%= hidden_field_tag :uploadfile, :id => "uploadfile", :name => "uploadfile" %>
<br /><br />
<div id="submit">
<%= submit_tag( "Upload file" ) %>
</div>

红宝石:

def create
    name = params[:uploadfile]
    directory = "public/data"
    path = File.join(directory, name)
    File.open(path, "wb") { |f| f.write(params[:uploadfile].read) }
     @project = Project.new({:filename => name, :location => path})

    respond_to do |format|
      if @project.save
        format.html { redirect_to @project, notice: 'Project was successfully created.' }
        format.json { render json: @project, status: :created, location: @project }
      else
        format.html { render action: "new" }
        format.json { render json: @project.errors, status: :unprocessable_entity }
      end
    end
  end

和JS:

$("#submit input").click(function() {
    $("#uploadfile").val($("#preview").attr("src"));
});

Answer 1

要点是使用 params[:uploadfile] 因为名称值是不必要的\xef\xbc\x8c 如果你想要一个唯一的密钥，你可以使用SecureRandom.uuid。

\n