使用Dropzone将文件上传到BrickFTP [英] Uploading file to BrickFTP using Dropzone

问题描述

我一直在尝试使用 BrickFTP .com"rel =" nofollow noreferrer> Dropzone ，但是上传的文件无法打开，因为它在文件内容的顶部包含WebKitFormBoundary.

I have been trying to implement file upload to BrickFTP using Dropzone, but the uploaded file won't open because it contains the WebKitFormBoundary at the top of the file content.

我按照 BrickFTP的文档，在Dropzone配置中将方法作为PUT放置. BrickFTP使用Amazon S3，因此实际上已将文件上传到S3.我按照他们的文档进行了所有操作，除了最后一个问题，我的所有工作均正常进行，我在上传文件内容的顶部遇到了这些额外的信息.

I'm putting method as PUT in Dropzone configuration as per BrickFTP's documentation. BrickFTP uses Amazon S3 so the files are actually being uploaded to S3. I did everything as per their documentation, and everything worked except this last problem I'm having with those extra information at the top of the uploaded file content.

以下是负责文件上传的Coffeescript代码:

Here is the Coffeescript code responsible for file upload:

brickFTPData = {}

# As per BrickFTP docs, step 1 is 
# to get the dedicated upload url for each file by sending a  
# request to REST API to indicate intent to upload a file
getUploadUri = (file) ->
   result = ""
   $.ajax
      url      : '/a/portal-dev/get-api-keys'
      type     : 'POST'
      dataType : 'json'
      data     : { file_name: file.name }
      async    : false
      success  : (data, textStatus, jqXHR) ->
         brickFTPData[file.upload.uuid] =
            file_name   : file.name
            upload_uri  : data.upload_uri
            ref         : data.ref
         result = data.upload_uri
   return result

# 3rd step is to notify the REST API that the file upload is complete.
finishUpload = (file) ->
   $.ajax
      url      : '/a/portal-dev/upload-done'
      type     : 'POST'
      dataType : 'json'
      data     :
         ref         : brickFTPData[file.upload.uuid].ref
         file_name   : brickFTPData[file.upload.uuid].file_name
      success  : (data) ->
         delete brickFTPData[file.upload.uuid]
         console.log data.status

# 2nd step is to upload the file
sampleQuoteDropzone = new Dropzone "#sampleQuoteDropzone",
   url            : '/demo'
   method         : 'PUT'
   headers        : {"Content-Type": "application/octet-stream"}
   success        : (file, request) ->
      finishUpload(file)

sampleQuoteDropzone.on 'processing', (file) ->
   upload_uri = getUploadUri(file)
   sampleQuoteDropzone.options.url = upload_uri

使用上面的代码上传可以正常工作，但是正如我所说的，当我将上传的文件打开到文本编辑器中时，它以以下代码开头:

Upload works fine using the above code but as said when I open the uploaded file into a text editor it starts with following code:

------WebKitFormBoundaryw4bIakMBbkp7ES2E
Content-Disposition: form-data; name="file"; filename="IMG_5652.jpg"
Content-Type: image/jpeg

如果我删除这些行并保存文件，它将起作用.

If I delete these lines and save the file it will work.

但是，在Dropzone外部使用常规ajax调用上传文件时，不会出现此问题.以下是工作代码:

But this problem is not seen when uploading file using a regular ajax call outside Dropzone. Following is the working code:

$.ajax
     url: data.upload_uri
     type: 'PUT'
     contentType: 'application/octet-stream'
     data: file
     processData: false
     success: (response) ->
        finishUpload(file, data)

任何人都可以请教如何解决此问题吗?

Can anyone please advise how to solve this problem?

推荐答案

我用以下代码解决了这个问题:

I solved the problem with following code:

sampleQuoteDropzone.on 'sending', (data, xhr, formData) ->
   _send = xhr.send
   xhr.send = ->
      _send.call(xhr, data)

实际上是在此处找到的.在将问题发布到此处之前，我已经看到了这一点，但是不确定这是否是正确的问题/解决方案.我联系了BrickFTP，他们很快就回答说这种解决方案可能对我有用，是的，确实可以.

This solution was actually found here. I saw this before posting this question here, but wasn't sure if this is the right problem/solution. I contacted BrickFTP and they responded fairly quickly saying this solution may work for me, and yes it certainly does.

这篇关于使用Dropzone将文件上传到BrickFTP的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！