Postman的FormData传参用法详解

这篇具有很好参考价值的文章主要介绍了Postman的FormData传参用法详解。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

        今年上半年因为做毕设的原因,有自己接触到后端,也是用过了postman去测试接口,看到了postman那边的参数形式,一直对这个formData有想法。

        在做毕设前后端对接接口过程中,一般get或者delete请求我都会使用url拼接的形式,因为根据restAPI格式,这两者我基本上都是拿来获取某个东西的详情信息,或者删除某个东西的详情信息,而至于最经常使用到的post请求,我一般使用的都是采取json格式的语法进行传参在json里前端只要传过去对应的对象即可,但是一直对于这个formData这个传参方式有点误解,听名字感觉像是表单传参过去的。
 

一.创建一个formData对象实例的方式

1、创建一个空对象

var formData = new FormData();//通过append方法添加数据
复制代码

2、使用已有表单来初始化对象

//表单示例
<form id="myForm" action="" method="post">
    <input type="text" name="name">名字
    <input type="password" name="psw">密码
    <input type="submit" value="提交">
</form>
//方法示例
// 获取页面已有的一个form表单
var form = document.getElementById("myForm");
// 用表单来初始化
var formData = new FormData(form);
// 我们可以根据name来访问表单中的字段
var name = formData.get("name"); // 获取名字
var psw = formData.get("psw"); // 获取密码
// 当然也可以在此基础上,添加其他数据
formData.append("token","kshdfiwi3rh");
复制代码

二. 操作方法

formData里面存储的数据是以健值对的形式存在的,key是唯一的,一个key可能对应多个value。
如果是使用表单初始化,每一个表单字段对应一条数据,它们的HTML name属性即为key值,它们value属性对应value值。
1.获取值

//通过get(key)/getAll(key)来获取对应的value
formData.get("name"); // 获取key为name的第一个值
formData.get("name"); // 返回一个数组,获取key为name的所有值
复制代码

2 添加数据

//通过append(key, value)来添加数据,如果指定的key不存在则会新增一条数据,如果key存在,则添加到数据的末尾
formData.append("k1", "v1");
formData.append("k1", "v2");
formData.append("k1", "v3");
复制代码

获取值时方式及结果如下:

formData.get("k1"); // "v1"
formData.getAll("k1"); // ["v1","v2","v3"]
复制代码

3.设置修改数据

//set(key, value)来设置修改数据,如果指定的key不存在则会新增一条,如果存在,则会修改对应的value值
formData.append("k1", "v1");
formData.set("k1", "1");
formData.getAll("k1"); // ["1"]
复制代码

4.判断是否存在对应数据

//has(key)来判断是否对应的key值
formData.append("k1", "v1");
formData.append("k2",null);
 
formData.has("k1"); // true
formData.has("k2"); // true
formData.has("k3"); // false
复制代码

5.删除数据

//delete(key)删除数据
formData.append("k1", "v1");
formData.append("k1", "v2");
formData.append("k1", "v1");
formData.delete("k1");
 
formData.getAll("k1"); // []
复制代码

三.JQuery实例

//添加数据方式见上二。
//processData: false, contentType: false,多用来处理异步上传二进制文件。
 $.ajax({
    url: 'xxx',
    type: 'POST',
    data: formData,                    // 上传formdata封装的数据
    dataType: 'JSON',
    cache: false,                      // 不缓存
    processData: false,                // jQuery不要去处理发送的数据
    contentType: false,                // jQuery不要去设置Content-Type请求头
    success:function (data) {           //成功回调
        console.log(data);
    }
});
复制代码

·

/**
 * 将以base64的图片url数据转换为Blob文件格式
 * @param urlData 用url方式表示的base64图片
 */
function convertBase64UrlToBlob(urlData) {
    var bytes = window.atob(urlData.split(',')[1]); //去掉url的头,并转换为byte
    //处理异常,将ascii码小于0的转换为大于0
    var ab = new ArrayBuffer(bytes.length);
    var ia = new Uint8Array(ab);
    for(var i = 0; i < bytes.length; i++) {
        ia[i] = bytes.charCodeAt(i);
    }
    return new Blob([ab], {
        type: 'image/png'
    });
}
复制代码

以上是我对FormData的理解和使用。文章来源地址https://www.toymoban.com/news/detail-515460.html

到了这里,关于Postman的FormData传参用法详解的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 【Postman】Postman接口测试进阶用法详解:断言、全局与环境变量、关联、批量执行用例、读取外部文件实现参数化

    Postman断言使用JavaScript语言编写,写在Postman的【Tests】 标签中。 【Tests】中的脚本在发送请求之后执行,它会把断言的结果(PASS/FAIL)最终在【Test Results】 标签页中。 断言响应状态码是否为200(Status code is 200) 断言响应体JSON数据校验(Response body:JSON value check) 断言响应体

    2024年02月15日
    浏览(59)
  • postman中使用formdata数据获取参数编写pre-request Script获取参数自动生成sign

    postman中header部分变量利用脚本生成相应的数据 timestamp:通过脚本获取生成的变量 sign:通过脚本获取生成的变量 body中的参数是form-data格式: 所有的参数需要根据实际的接口参数填写   程序片段: 由于本人的接口的加密方式是入参的参数按照字母排序然后加密字符串,所以

    2024年02月11日
    浏览(58)
  • Postman传参的JSON格式

    实体类: json格式: 1.JSON数值({ “key” : value}) 2.JSON字符串({ “key” : “value”}) 3.JSON数组({ “key” : [value]}) 4.JSON对象({ “key” : {value}}) 5.JSON对象数组({ “key” : [{“key1”: “value1”},{“key2”: “value2”}]}) 6.JSON数组对象({“key”:{“key1”:[value1,value2]}})

    2024年02月12日
    浏览(40)
  • postman批量执行请求,通过json传参

    \\\"authUid\\\":\\\" {{authUid}} \\\", 加粗为需要替换的参数 可通过Excel自动填充功能构造数据 学习借鉴:https://www.cnblogs.com/l0923/p/13419986.html

    2024年02月17日
    浏览(41)
  • Postman传参是Json字符串

    进入Postman以后,点击Body,点击raw,将Json参数复制到空白框里,点击末尾,选择JSON格式。

    2024年02月11日
    浏览(46)
  • C# WebApi传参及Postman调试

    欢迎来到本文,本篇文章将会探讨C# WebApi中传递参数的方法。在WebApi中,参数传递是一个非常重要的概念,因为它使得我们能够从客户端获取数据,并将数据传递到服务器端进行处理。WebApi是一种使用HTTP协议进行通信的RESTful服务,它可以通过各种方式传递参数。在本文中,

    2024年04月15日
    浏览(29)
  • postman----传参格式(json格式、表单格式)

      本文主要讲解postman使用post请求方法的2中传参方式:json格式、表单格式 首先了解下,postman进行接口测试,必须条件是: ♥请求地址 ♥请求协议 ♥请求方式 ♥请求头 ♥参数 json格式 先看一下接口文档,根据接口文档,在postman中填入必要的参数信息 post请求方式,使用 

    2024年02月14日
    浏览(39)
  • axios (用法、传参等)

    是一个专注于网络请求的库。 中文官网地址: http://www.axios-js.com/ 可直接点击这里跳到中文官网 英文官网地址: https://www.npmjs.com/package/axios 可直接点击这里跳转到英文官网 直接引入 然后在全局下就有这个方法了 结果: 结论: 调用 axios 方法得到的返回值是 Promise 对象 然后

    2024年02月09日
    浏览(35)
  • 多个对象入参PostMan测试传参方式

    多个对象入参 使用postMan测试 但是怎么传值后端都接收不到数据  前言:因为需要写一个分页查询 但是组里现场的传值方式都是这种所以 就遇到了两个参数不知道怎么传值的情况 在这写了一个简单的方法测试PostMan怎么传值两个对象的情况  简单的测试 接口代码: 其中实体类

    2024年02月16日
    浏览(38)
  • postman form-data传参java实现

    java实现: 第二种方式: 导入依赖:

    2024年02月12日
    浏览(44)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包