标签: form-data

我使用jQuery的ajax函数将文件发送到服务器端PHP脚本时遇到问题.可以获取文件列表$('#fileinput').attr('files')但是如何将此数据发送到服务器？使用文件输入时$_POST,服务器端php脚本上的结果array()为0(NULL).

我知道这是可能的(虽然我到目前为止还没有找到任何jQuery解决方案,只有Prototye代码(http://webreflection.blogspot.com/2009/03/safari-4-multiple-upload-with-progress.html) ).

这似乎是相对较新的,所以请不要通过XHR/Ajax提及文件上传,因为它肯定有用.

我需要Safari 5中的功能,FF和Chrome会很好但不是必需的.

我现在的代码是:

$.ajax({
    url: 'php/upload.php',
    data: $('#file').attr('files'),
    cache: false,
    contentType: 'multipart/form-data',
    processData: false,
    type: 'POST',
    success: function(data){
        alert(data);
    }
});

我已经尝试过 console.log并使用它循环for in.

这是FormData上的MDN参考.

两次尝试都在这个小提琴中.

var fd = new FormData(),
    key;

// poulate with dummy data

fd.append("key1", "alskdjflasj");
fd.append("key2", "alskdjflasj");

// does not do anything useful

console.log(fd);

// does not do anything useful

for(key in fd) {
    console.log(key);
}

如何检查表单数据以查看已设置的键.

我有以下代码:

var req = require('request');

req.post('someUrl',
   { form: { username: 'user', password: '', opaque: 'someValue', logintype: '1'}, },
   function (e, r, body) {
      console.log(body);
});

如何为此设置标题？我需要用户代理,内容类型以及标题中的其他内容:

headers = { 
   'User-Agent': 'Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.110 Safari/537.36',
   'Content-Type' : 'application/x-www-form-urlencoded' 
};

我尝试过多种方式,但我可以发送标题或表单数据,但都无法发送.

你能告诉我这是错的吗:

var formdata = new FormData();
formdata.append("key", "value");
console.log(formdata);

我的输出看起来像这样,我找不到我的"关键" - "价值"对

FormData
*__proto__: FormData
**append: function append() { [native code] }
***arguments: null
***caller: null
***length: 0
***name: "append"
***prototype: append
***__proto__: function Empty() {}
*constructor: function FormData() { [native code] }
**arguments: null
**caller: null
**length: 0
**name: "FormData"
**prototype: FormData
**toString: function toString() { [native code] }
*__proto__: Object
**__proto__: Object
**__defineGetter__: function __defineGetter__() { [native code] }
**__defineSetter__: function __defineSetter__() { [native code] }
**__lookupGetter__: function …

我怎样才能将我的JS对象转换为FormData？

我想要这样做的原因是,我有一个我用~100表单字段值构造的对象.

var item = {
   description: 'Some Item',
   price : '0.00',
   srate : '0.00',
   color : 'red',
   ...
   ...
}

现在我被要求将上传文件功能添加到我的表单中,当然这是不可能通过JSON,因此我打算转移到FormData.那么有什么方法可以将我的JS对象转换为FormData？

我正在使用ajax提交包含数组,文本字段和文件的多部分表单.

我将每个VAR附加到主数据上

var attachments = document.getElementById('files'); 
var data= new FormData();

for (i=0; i< attachments.files.length; i++){
    data.append('file', attachments.files[i]);
    console.log(attachments.files[i]);

    data.append ('headline', headline);
    data.append ('article', article);
    data.append ('arr', arr);
    data.append ('tag', tag);

然后我使用ajax函数将其发送到PHP文件以存储在sql DB中.

$.ajax({    
    type: "post",
    url: 'php/submittionform.php',
    cache: false,
    processData: false,
    contentType: false,
    data: data,
    success: function(request) {$('#box').html(request); }
})

但在PHP方面,arr变量(即数组)显示为字符串.

当我不使用ajax作为表单数据发送它但使用简单$.POST选项时我会在PHP端将其作为数组获取,但是我也无法发送文件.

任何解决方案

如何通过formdata传递整个模型对象并将其转换为控制器中的模型类型？

以下是我尝试过的!

JavaScript部分:

model = {
             EventFromDate: fromDate,
             EventToDate: toDate,
             ImageUrl: imgUrl,
             HotNewsDesc: $("#txthtDescription").val().trim(),
        };
formdata.append("model",model);

然后通过AJAX传递它,它将是一个字符串,如果我检查Request.Form["model"]结果的值将是相同的,那就是它将作为字符串接收并且值将是"[object object]"

有没有办法通过formdata传递模型并在控制器中接收它？

如何将HTML5 FormData对象转换为JSON？没有Jquery并像处理对象一样处理FormData中的嵌套属性.

我目前正在使用以下代码上传从剪贴板粘贴的图像:

// Turns out getAsFile will return a blob, not a file
var blob = event.clipboardData.items[0].getAsFile(), 
    form = new FormData(),
    request = new XMLHttpRequest();
form.append("blob",blob);
request.open(
            "POST",
            "/upload",
            true
        );
request.send(form);

结果是上传的表单字段,其名称与此类似:Blob157fce71535b4f93ba92ac6053d81e3a

有没有办法设置此或接收此文件名客户端,而不进行任何服务器端通信？

我正在尝试实现文件上传API,这里给出:
Mediafire文件上传

我能成功上传后的数据和获取数据,但不知道如何发送X-文件名的属性,这是为了将头数据作为API指南中给出.

我的代码:

xmlhttp=new XMLHttpRequest();
var formData = new FormData();

formData.append("Filedata", document.getElementById("myFile").files[0]);

var photoId = getCookie("user");
// formData.append("x-filename", photoId);            //tried this but doesn't work
// xmlhttp.setRequestHeader("x-filename", photoId);   //tried this too (gives error) [edited after diodeous' answer]

xmlhttp.onreadystatechange=function()
{
    alert("xhr status : "+xmlhttp.readyState);
}

var url = "http://www.mediafire.com/api/upload/upload.php?"+"session_token="+getCookie("mSession")+"&action_on_duplicate=keep";

xmlhttp.open("POST", url);
// xmlhttp.setRequestHeader("x-filename", photoId);   //tried this too, doesnt work. Infact nothing gets uploaded on mediafire.  [edited after apsillers' answer]
// cant get response …