如何设置独立附件内容类型答案

【问题标题】：How To Set A Standalone Attachment Content Type如何设置独立附件内容类型
【发布时间】：2012-11-08 01:15:40
【问题描述】：

我已经能够创建一个独立的附件，但是 content_type 最终是 multipart/form-data。我做错了什么？代码后面是帖子的响应，然后是请求；您可以在请求中看到 Request Payload 中的内容类型正确。

代码：

 function uploadFile() {
    var fd = new FormData();
    var file = document.getElementById('fileToUpload').files[0];
    fd.append("fileToUpload", document.getElementById('fileToUpload').files[0]);
    var xhr = new XMLHttpRequest();
    xhr.upload.addEventListener("progress", uploadProgress, false);
    xhr.addEventListener("load", uploadComplete, false);
    xhr.addEventListener("error", uploadFailed, false);
    xhr.addEventListener("abort", uploadCanceled, false);
    xhr.open("PUT", "http://usr:pswd@localhost:5984/db_test/testdoc7/"+ file.name +"?rev=1-967a00dff5e02add41819138abb3284d");

    xhr.send(fd);
  }

回复：

{
   "_id": "testdoc7",
   "_rev": "2-2841dcd640adb94de525e486be34052e",
   "_attachments": {
       "P9025287.JPG": {
           "content_type": "multipart/form-data; boundary=----WebKitFormBoundary9QNXLDTeW13Gc1ip",
           "revpos": 2,
           "digest": "md5-VcoscthaPUYoWHBmCBaAnA==",
           "length": 3083669,
           "stub": true
       }
   }
}

请求：

Request URL:http://usr:pswd@localhost:5984/db_test/testdoc7/P9025287.JPG?rev=1-967a00dff5e02add41819138abb3284d
Request Method:PUT
Status Code:201 Created
Request Headersview source
Accept:*/*
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Content-Length:3083669
Content-Type:multipart/form-data; boundary=----WebKitFormBoundary9QNXLDTeW13Gc1ip
Cookie:AuthSession=YmRyaG9hOjUwOUFFNDg3OnR23NsQsqdQvnKp7HX_0g90grXw
Host:localhost:5984
Origin:http://localhost:5984
Referer:http://localhost:5984/estante_test/_design/library/html5/html5test.html
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_2) AppleWebKit/537.11 (KHTML, like Gecko) Chrome/23.0.1271.64 Safari/537.11
Query String Parametersview URL encoded
rev:1-967a00dff5e02add41819138abb3284d
Request Payload
------WebKitFormBoundary9QNXLDTeW13Gc1ip
Content-Disposition: form-data; name="fileToUpload"; filename="P9025287.JPG"
Content-Type: image/jpeg


------WebKitFormBoundary9QNXLDTeW13Gc1ip--
Response Headersview source
Cache-Control:must-revalidate
Content-Length:71
Content-Type:text/plain; charset=utf-8
Date:Wed, 07 Nov 2012 22:45:40 GMT
ETag:"2-2841dcd640adb94de525e486be34052e"
Location:http://localhost:5984/estante_test/testdoc7/P9025287.JPG
Server:CouchDB/1.2.0 (Erlang OTP/R15B)

【问题讨论】：

标签： file-upload couchdb couchapp

【解决方案1】：

您的代码正在将整个表单的正文放入 CouchDB。我怀疑如果您查看附件，您会发现不仅 Content-Type 不正确。这样的事情应该会更好：

function uploadFile() {
  var file = document.getElementById('fileToUpload').files[0];
  var xhr = new XMLHttpRequest();
  xhr.upload.addEventListener("progress", uploadProgress, false);
  xhr.addEventListener("load", uploadComplete, false);
  xhr.addEventListener("error", uploadFailed, false);
  xhr.addEventListener("abort", uploadCanceled, false);
  xhr.open("PUT", "http://usr:pswd@localhost:5984/db_test/testdoc7/"+ file.name +"?rev=1-967a00dff5e02add41819138abb3284d");
  xhr.send(file);
}

之所以可行，是因为 File 接口继承自 Blob，因此 XHR2 send algorithm 将提交文件的原始数据，并根据文件条目的 .type 属性设置 mime 类型。

请注意，至少有些浏览器没有为文件提供良好的 MIME 类型猜测，因此除非您通过 xhr.setRequestHeader() 为自己提供覆盖，否则您最终可能仍会使用“application/octet-stream”作为类型。

【讨论】：