美文网首页
转换formdata参数格式

转换formdata参数格式

作者: ITtian | 来源:发表于2017-04-11 20:36 被阅读2616次

在formdata中传递复杂参数时,很头疼,期望是一个样子,结果到了后台又是另一个样子,介绍几个基本的formdata格式

传递一个普通的对象obj:{name:'testname',age:'testage'}
需要写成这个样子
‘obj[name]’:'testname'
‘obj[age]’:'testage'

传递一个数组arr:['name','age','sex']
需要写成这个样子
'arr[]':'name'
'arr[]':'age'
'arr[]':'sex'

此时有这样一个结构,怎么传,一个个写出来,想死的心都有了,而且还会涉及到文件的异步上传(不然不会用formdata),所以找了个方法,总结一下:数组会加上[],对象会写成这样obj[property]

var params = {
        name:'testname',
        obj:{
            innername:'innername',
            innerage:23,
            inneraddress:[
                {
                    city:'shanghai',
                    area:'pudong'
                },
                {
                    city:'jiangsu',
                    area:'nanjing'
                },
            ]
        }
    }
var objectToFormData =function(obj, form, namespace) {
      var fd = form || new FormData();
      var formKey;
      if(obj instanceof Array){
        for(var item of obj ){
          if(typeof item === 'object' && !(item instanceof File)){
            this.objectToFormData(item, fd, namespace+'[]');
          }else{
            // 若是数组则在关键字后面加上[]
            fd.append(namespace+'[]',item)
          }

        }
      }else{
        for(var property in obj) {
          if(obj.hasOwnProperty(property) && obj[property]) {

            if(namespace) {
              // 若是对象,则这样
              formKey = namespace + '[' + property + ']';
            } else {
              formKey = property;
            }

            // if the property is an object, but not a File,
            // use recursivity.
            if(typeof obj[property] === 'object' && !(obj[property] instanceof File)) {
                // 此处将formKey递归下去很重要,因为数据结构会出现嵌套的情况
                this.objectToFormData(obj[property], fd, formKey);
            } else {

              // if it's a string or a File object
              fd.append(formKey, obj[property]);
            }

          }
        }
      }
      return fd;

    };

测试一些,解析出来的数据结构传到后台和我们预期的结果一样:

[keys:]
name 
obj[innername] 
obj[innerage] 
obj[inneraddress][][city] 
obj[inneraddress][][area] 
obj[inneraddress][][city] 
obj[inneraddress][][area] 
[values]:
testname 
innername 
23 
shanghai 
pudong 
jiangsu 
nanjing

相关文章

  • 转换formdata参数格式

    在formdata中传递复杂参数时,很头疼,期望是一个样子,结果到了后台又是另一个样子,介绍几个基本的formda...

  • Axios POST FormData格式请求

    目录 前言 使用axios进行post请求的时候,默认是传递的json格式的参数,当接口需要FormData格式的...

  • ffmpeg使用教程

    常用命令 1.主要参数: 2.视频参数: 3.音频参数: 1. 视频格式转换 (其实格式转换说法不太准确,但大家都...

  • axios使用之参数FormData转换

    最近在项目中使用了axios来代替jQuery的ajax。假如你后台接收的的请求类型是post,然后参数是form...

  • 这是什么格式

    这就是formdata格式/

  • flutter 上传图片

    上传文件格式的图片,重点是不仅是图片要放在FormData里,其他参数也要 _uploadImage(File i...

  • 360lib 投影格式转换

    360lib 投影格式分类 投影格式转换 分为两种,不同投影格式之间的转换和相同格式但不同参数的转换,其中Inpu...

  • FFmpeg命令行练习(4)

    ffmpeg工具 参数具体说明: 转封装格式从AVI格式转换为MP4格式 视频编码从AVC转换为MPEG4格式 视...

  • JS下的网络请求学习记录

    常见post数据格式 四种常见post的数据格式 FormData对象的使用 FormData对象的使用官方文档 ...

  • FormData提交Base64图片数组

    java后台提供了接口,使用的是formdata格式提交参数,最开始提交的是file文件,在电脑上测试一切正常。 ...

网友评论

      本文标题:转换formdata参数格式

      本文链接:https://www.haomeiwen.com/subject/zlnuattx.html