formdata怎么传数组_关于javascript：将数组附加到FormData
并通过A。。。
我使⽤Ajax提交⼀个包含数组、⽂本字段和⽂件的多部分表单。
因此，我将每个var附加到主数据中
var attachments = ElementById('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数据库中。
$.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发送阵列，⽅法如下：
var formData = new FormData;
var arr = ['this', 'is', 'an', 'array'];
for (var i = 0; i < arr.length; i++) {
formData.append('arr[]', arr[i]);
}
您可能会发现本⽂很有⽤：如何在查询字符串中传递数组？
@oleg在formData.append('arr[]', arr[i])；中写arr[]需要什么？为什么arr不正确？我两个都试过了，但只有arr[]起作⽤。
@totoro因为在arr的情况下，您只需在每个循环迭代中重新定义这个值，最后，最终的值将等于最后⼀个数组元素，⽽不是整个数组
@如果重新定义是这样的话，那么arr[]中有什么不同，为什么不重新定义arr[]？arr[]也是⼀个字符串。在我的例⼦中，当测试arr和arr[]时，都没有被重新定义。我在formdata中得到了多个数组，键相同，但值不同。所以我得到了值为1的arr，另⼀个值为2的arr。
@托托罗是的，你是对的，我的错。我认为这是服务器端特有的问题。不同的语⾔可能不同地解析查询字符串。例如，PHP的⾏为与您所描述的⼀样，但我看到了⽰例(如果内存使⽤Java)，其中EDCOX1(2)也适⽤于数组。在本主题中，有⼀个更详细的问题答案。
如果有⼈想要发布⼀组对象，您可以将此答案扩展如下：for (var i = 0; i < myArr; i++) { var myItemInArr = myArr[i]; for (var prop in myItemInArr) { fileData.append(`myArr[${i}][${prop}]`, myItemInArr[prop]); } }。
@我认为这是规范的⼀部分。
⼀个只有⼀个项的数组怎么样？那需要特别处理吗？
您有⼏个选项：将其转换为JSON字符串，然后⽤PHP解析(推荐)
JS
var json_arr = JSON.stringify(arr);
PHP
$arr = json_decode($_POST['arr']);
或者使⽤@curios的⽅法
通过FormData发送阵列。不推荐：⽤序列化数据，然后⽤PHP反序列化
JS
// Use or any other delimiter you want
var serial_arr = arr.join("");
PHP
$arr = explode("", $_POST['arr']);
问题是数组包含实数⾏，带有空格和标点符号。我不想把事情搞砸。
当您使⽤JSON对其进⾏编码和解析时，数据不会丢失。试试看；)
如果您使⽤的是带有⾃动映射或类似功能的ASP.NET，那么@好奇的答案就是您需要的。
@Richard de Wit如果您有这样的数据⽂件或表单数据，您将在json.stringfy中丢失它们。
不使⽤对象数组
我更喜欢细线化，更简单。因为您需要执⾏某种递归来使⽤[]传递数组，但很好地知道可以这样做。
类型脚本版本：
export class Utility {
public static convertModelToFormData(model: any, form: FormData = null, namespace = ''): FormData {
let formData = form || new FormData();
let formKey;
if (!model.hasOwnProperty(propertyName) || !model[propertyName]) continue;
let formKey = namespace ? `${namespace}[${propertyName}]` : propertyName;
if (model[propertyName] instanceof Date)
formData.append(formKey, model[propertyName].toISOString());
else if (model[propertyName] instanceof Array) {
model[propertyName].forEach((element, index) => {
const tempFormKey = `${formKey}[${index}]`;
});
}
else if (typeof model[propertyName] === 'object' && !(model[propertyName] instanceof File))
else
formData.append(formKey, model[propertyName].toString());
}
return formData;
}
}
使⽤：
let formData = vertModelToFormData(model);
这是⼀个⽼问题，但我最近遇到了这个问题，即随⽂件⼀起发布对象。我需要能够发布⼀个对象，以及对象和数组的⼦属性。下⾯的函数将遍历⼀个对象并创建正确的FormData对象。
// formData - instance of FormData object
// data - object to post
function getFormData(formData, data, previousKey) {
if (data instanceof Object) {
Object.keys(data).forEach(key => {
const value = data[key];
if (value instanceof Object && !Array.isArray(value)) {
FormData(formData, value, key);
}
if (previousKey) {
key = `${previousKey}[${key}]`;
if (Array.isArray(value)) {
value.forEach(val => {
formData.append(`${key}[]`, val);
});
} else {
formData.append(key, value);
}
});
}
}
这将转换以下JSON-
{
name: 'starwars',
year: 1977,
characters: {
good: ['luke', 'leia'],
bad: ['vader'],
},
}
进⼊以下表单数据
name, starwars
year, 1977
characters[good][], luke
characters[good][], leia
characters[bad][], vader
它对我很有⽤，只需要在append中的值上应⽤字符串(value)(否则它将失败，因为true/false)。另外，它应该是(value !== null) && formData.append(key, value)，⽽不是formData.append(key, value)，否则它在空值上失败。
typeof array将所有类型输⼊添加到FormData
const formData = new FormData();
for (let key in form) {
Array.isArray(form[key])
form[key].forEach(value => formData.append(key + '[]', value))
: formData.append(key, form[key]) ;
如果有嵌套的对象和数组，填充FormData对象的最佳⽅法是使⽤递归。
function createFormData(formData, data, key) {
if ( ( typeof data === 'object' && data !== null ) || Array.isArray(data) ) {
for ( let i in data ) {
if ( ( typeof data[i] === 'object' && data[i] !== null ) || Array.isArray(data[i]) ) {
createFormData(formData, data[i], key + '[' + i + ']');
} else {
formData.append(key + '[' + i + ']', data[i]);
}
}
} else {
formData.append(key, data);
}
}
下⼀版本适⽤于包含简单值数组的模型：
function convertModelToFormData(val, formData = new FormData(), namespace = '') {
if((typeof val !== 'undefined') && (val !== null)) {
if(val instanceof Date) {
formData.append(namespace, ISOString());
} else if(val instanceof Array) {
for(let element of val) {
convertModelToFormData(element, formData, namespace + '[]');
}
} else if(typeof val === 'object' && !(val instanceof File)) {
for (let propertyName in val) {
if(val.hasOwnProperty(propertyName)) {
convertModelToFormData(val[propertyName], formData, namespace ? namespace + '[' + propertyName + ']' : propertyName);
}
}
} else {
formData.append(namespace, String());
}
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论