Couchdb 如何从浏览器上载文件（附件）？

我无法上传附件以使浏览器正常工作

有些提示是，有些则是。非常好，但我无法将其转换为AJAX上传

我正在寻找一个超级简单的HTML/JavaScript示例（带或不带jQuery），介绍如何在不使用jQuery.coach.app.js包装器的情况下，将文件从（相对现代的）浏览器上传到db。越简单越好

---

谢谢你的帮助

好的，这是您的纯JavaScript文件上传实现

基本算法如下所示：

PUT host/database/document/filename?revision=latest-revision

从文件输入元素获取文件

获取文件名并键入文件对象

获取要将文件附加到的文档的最新文档版本

使用获取的修订将文件附加到文档

HTML部分基本上由一个包含两个元素的简单表单组成，一个输入类型为

file

，一个按钮类型为

submit

上传

现在转到JavaScript部分

window.onload=function（）{
var app=函数（）{
var baseUrl=http://127.0.0.1:5984/playground/';
var fileInput=document.forms['upload'].elements['file']；
document.forms['upload'].onsubmit=function（）{
上传文件（'foo'，fileInput.files[0]）；
返回false；
};
var uploadFile=函数（docName，file）{
var name=encodeURIComponent（file.name），
type=file.type，
fileReader=新的fileReader（），
getRequest=new XMLHttpRequest（），
putRequest=新的XMLHttpRequest（）；
getRequest.open（'GET'，baseUrl+encodeURIComponent（docName），
正确的）；
getRequest.send（）；
getRequest.onreadystatechange=函数（响应）{
if（getRequest.readyState==4&&getRequest.status==200）{
var doc=JSON.parse（getRequest.responseText）；
putRequest.open（'PUT'，baseUrl）+
encodeURIComponent（docName）+'/'+
名称+'？版本='+文件_版本，正确）；
setRequestHeader（'Content-Type'，Type）；
readAsArrayBuffer（文件）；
fileReader.onload=函数（readerEvent）{
发送（readerEvent.target.result）；
};
putRequest.onreadystatechange=函数（响应）{
if（putRequest.readyState==4）{
console.log（putRequest）；
}
};
}
};
};
};
app（）；
};

基本上，我通过将自己的函数绑定到表单的

onsubmit

事件并返回false来拦截表单的

submit

事件

在该事件处理程序中，我使用两个参数调用我的主函数。第一个是文档名，第二个是要上载的文件

在我的

uploadFile（）

函数中，我设置了文件名、文件类型并获取了一些实例。第一个HTTP请求是获取文档当前版本的GET请求。如果该请求成功，我将通过设置先前获得的版本、正确的内容类型来准备PUT请求（实际的上载请求），然后将文件转换为ArrayBuffer。完成后，我只发送我刚刚准备好的HTTP请求，然后放松

独立附件上载方案如下所示：

PUT host/database/document/filename?revision=latest-revision

当然，在HTTP请求头中使用正确的内容类型

---

注意：我很清楚我在这里根本没有使用防御性编程，我故意这么做是为了简洁。

很好的示例和解释。这正是我要找的！请注意，这里不使用jQuery，因为它不支持readerEvent.target.result返回的ArrayBuffer对象。我花了几个小时才弄明白，所以我想把它写下来给其他人看。答案非常好，但使用名为

document

的局部变量在客户端JavaScript中是不允许的。只是说。。。