jQuery.ajax设置请求头实现post请求发送数据的格式（Form Data和Request Payload）

已于 2023-04-27 12:41:10 修改
阅读量7.5w 收藏 42
点赞数 9
分类专栏： web前端 前端技术分享 文章标签： jQuery.ajax设置请求头实现post请求发送数据的格
于 2018-09-25 09:54:36 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xutongbao/article/details/82834963
版权

 Request Payload 请求头部的 Content-Type: application/json，请求正文是一个 json 格式的字符串

Form Data 请求头部的 Content-Type: application/x-www-form-urlencoded，请求正文是类似 get 请求 url 的请求参数

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>ajax设置请求头</title>
</head>
<body>
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript">
    $(function() {
        var myAction = {};

        $.extend(myAction, {
            test: function() {
                $.ajax({
                    url: 'http://10.10.10.52/api/v1/tasks/a956d066-a6e2-11e8-828e-000c29af35cf',
                    type: 'put',
                    dataType: 'json',
                    //data: JSON.stringify({data:{status: "start"}}),
                    data: {name: "xu", foo: 'bar'},
                    cache: false,
                    headers: { 
                        "Authorization":"Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJrZW4iLCJpYXQiOjE1Mzc1NTQzMDksImRhdGEiOnsidXNlcm5hbWUiOiJ4dXRvbmdiYW8iLCJpc19zdXBlcnVzZXIiOjEsImlkIjoxNywibG9naW5fdGltZSI6MTUzNzU1NDMwOX0sImV4cCI6MTUzODE1NDMwOX0.32Lys4hjjY2XRpM2r9YSmpYA798u821m_M5Tzb6wxIU",
                        'Content-Type': 'application/x-www-form-urlencoded'  //multipart/form-data;boundary=--xxxxxxx   application/json
                    },                
                    success: function(res){
                        if (res.code === 200) {
                            
                        }   
                    },
                    error: function(e) {

                    }
                });
            }
        });

        var init = function() {
            myAction.test();
        }();
    })
    </script>
</body>

</html>

 

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>ajax设置请求头</title>
</head>
<body>
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript">
    $(function() {
        var myAction = {};

        $.extend(myAction, {
            test: function() {
                $.ajax({
                    url: 'http://10.10.10.52/api/v1/tasks/a956d066-a6e2-11e8-828e-000c29af35cf',
                    type: 'put',
                    dataType: 'json',
                    data: JSON.stringify({data:{status: "start"}}),
                    //data: {name: "xu", foo: 'bar'},
                    cache: false,
                    headers: { 
                        "Authorization":"Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJrZW4iLCJpYXQiOjE1Mzc1NTQzMDksImRhdGEiOnsidXNlcm5hbWUiOiJ4dXRvbmdiYW8iLCJpc19zdXBlcnVzZXIiOjEsImlkIjoxNywibG9naW5fdGltZSI6MTUzNzU1NDMwOX0sImV4cCI6MTUzODE1NDMwOX0.32Lys4hjjY2XRpM2r9YSmpYA798u821m_M5Tzb6wxIU",
                        'Content-Type': 'application/json'  //application/x-www-form-urlencoded  application/json
                    },                
                    success: function(res){
                        if (res.code === 200) {
                            
                        }   
                    },
                    error: function(e) {

                    }
                });
            }
        });

        var init = function() {
            myAction.test();
        }();
    })
    </script>
</body>

</html>

开源项目地址：

https://github.com/xutongbao/learn-chatgpt

徐同保
关注
  • 9
    点赞
  • 踩
  • 42
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
专栏目录
通过Jsoup发送Request Payload方式的Ajax post请求
_
11-14 1482
最近在做一个旅游类的网站，在使用爬虫时，发现某程网站上某一个景点的用户评论这部分数据是通过Ajax异步请求动态加载的，首先通过Chrome跟踪异步请求，发现有两次请求， 前一次请求方法的OPTION,后一次请求才是POST而且返回目标数据，不过两次请求的url是一样的，直接在地址栏输入url返回的是没有用户评论信息的json格式的数据， 这说明某程服务器并没有接收到可用的...
$.ajax() 请求头,$.ajax应用之请求头headers
weixin_32434033的博客
08-05 5707
昨天项目中，由于要请求token验证，后台给出的方案是采用请求头返回token数据，给出的API文档是这样的由于之前一直都是采用请求体发送请求，服务器在应答体李返回数据。和这个不一样；采用jq的$.ajax()函数发送请求，代码如下$.ajax({type: 'POST',url: '/token',headers:{"appId":appId,"appKey":appKey,"Content-T...
Servlet获取AJAX POST请求中参数以form data和request payload形式传输的方法
08-28
主要介绍了Servlet获取AJAX POST请求中参数以form data和request payload形式传输的方法,结合实例形式详细分析了post数据发送及获取请求数据的原理与相关操作注意事项,需要的朋友可以参考下
jquery ajax request payload,post请求 request payload问题
weixin_39534873的博客
08-05 683
把下面这段代码放到整个项目的config里 就 ok了。视频里忘提了。这样就可以和jquery一样用。后台按照普通的表单获取参数方式就行了angular.config(function($httpProvider) {$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;ch...
Postman快捷功能-快速填写请求头
最新发布
若不知道要驶向哪个码头，那么任何风都不会是顺风。
05-22 1433
大家好，之前给大家分享关于 Postman 工具的基础使用，今天给大家介绍一个快捷功能，可以一定程度提高我们使用 Postman 工具的效率，在我们进行接口测试时，几乎每个接口都需要填写 Headers，且 Headers 中的参数大多是公共参数，这意味着每个接口都需要填写这些完全相同的参数。通常的操作是在每个 Headers 中按照键值对的形式逐个填写，但这样填写既费时又费力。接下来将介绍三种快速设置 Headers 的方法。
ajax设置header(请求头)的方式
qq_44724587的博客
08-11 3209
ajax设置header(请求头)，将token放到请求头
入手Ajax最好的文章---第五部分
rainux
07-21 166
Code Is Never Die ! HTTP协议简介 什么是通信 通信，就是信息的传递和交换。 通信三要素： 通信的主体 通信的内容 通信的方式 现实生活中的通信 案例：张三要把自己考上某个大学的好消息写信告诉自己的好朋友李四 其中： 通信的主体是张三和李四； 通信的内容是考上大学； 通信的方式是写信； 互联网中的通信 案例： 服务器把大学的简介通过响应的方式发送给客户端浏览器。 其中， 通信的主体是服务器和客户端浏览器； 通信的内容是大学的简介； 通信的方式是响应； 什么是通信协议 通
ajax常见请求头
m0_70798838的博客
03-19 578
是Ajax默认的请求类型，浏览器的原生 form 表单，如果不设置 enctype 属性，那么最终就会以 application/x-www-form-urlencoded 方式提交数据。这也是一个常见的 POST 数据提交的方式。我们使用表单上传文件时，就要让 form 的 enctype 等于这个值。相比于JSON，XML不能更好的适用于数据交换，它包含了太多的包装, 而且它跟大多数编程语言的数据模型不匹配。application/json是用来告诉服务端消息主体是序列化后的 JSON 字符串。
[AJAX]原生AJAX——自定义请求头
weixin_61972561的博客
07-03 1359
[AJAX]原生AJAX——自定义请求头
python爬虫实现POST request payload形式的请求
09-17
Python爬虫实现POST请求，尤其是以request payload形式发送数据，是一种常见的网络抓取技术，尤其在处理需要提交复杂数据或模拟登录的场景中至关重要。在HTTP请求中，POST请求通常用于向服务器提交数据，而数据的...
POST方法发送payload形式的请求1
08-03
在处理某些特定的POST请求时，我们可能会遇到一种名为"request payload"的数据格式，它与传统的"Form data"有所不同。本文将详细介绍"payload"形式的POST请求，以及如何使用Python的requests库来实现这种请求。 ...
jQuery的ajax发送FormData的方式
01-23
<html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <form id="form"> <input type="text" name="username"> <input type="file" name="file"> <input type="button" id="btn" value="提交"> </form> [removed][removed] [removed] var form = $('#form')[0]; // 获取到表单的DOM对象形式 $('#btn').on('click', function () { // 1 使用FormData进行表单的数据处理 var fd = new FormData(form); // 2 使用$.ajax发送fd // 需要指定两个属性 // - processData : false // - contentType : false $.ajax({ method : 'POST', url : '/ajax_Day5/datas03.php', data : fd, success : function (data) { console.log(data); }, processData : false, contentType : false }); }); [removed] </body> </html>
Python爬虫:Request Payload和Form Data的简单区别说明
09-16
在Python爬虫开发中，了解网络请求的细节至关重要，尤其是HTTP请求中的`Request Payload`和`Form Data`。这两者都是用于向服务器提交数据的方式，但它们之间存在一些关键的区别。 首先，`Form Data`是当我们在HTML...
官方Payload.bin格式固件VAB镜像提取工具 完美好用+带教程
06-11
官方Payload.bin格式固件VAB镜像提取工具 完美好用+带教程 官方卡刷包固件里分区目前都是Payload.bin格式的，以前都是使用其他解密工具先把官方包解压出里面的Payload.bin文件在次解开其中的分区 此资源直接可以解...
Payload.bin格式解包+刷写工具
06-15
Payload.bin格式刷写工具 此工具非常方便 目前机型很多的官方卡刷包里都是Payload.bin格式的卡刷包 我们需要里面的某一个分区的haunt，使用这个工具非常简单就可以提取出来 也可以使用这个工具刷写 有需要的友友可以...
Fastboot模式刷写 Payload.bin格式工具 可视化图形
05-30
本篇将详细介绍“Fastboot模式刷写Payload.bin格式工具”以及与其相关的知识点。 首先，Payload.bin是一种特殊的文件格式，通常用于在Fastboot模式下执行刷机操作。这种格式的文件包含了设备固件更新所需的数据，...
jQuery.ajax post请求
idoits的博客
09-16 961
jQuery.ajax post请求
$.ajax请求，请求头添加Token认证
新起点的博客
09-06 5815
关于JQ ajax的作用我就不多叙述了,网上有许多的demo,但是对于如何使用token验证访问者身份的demo却寥寥无几,接下来我就献上我现在项目中所使用的案例。
jq ajax请求头传参数,jquery用post方法请求数据，怎么在header里传参？
weixin_42313980的博客
08-06 4440
在网上找到了这种方法：$.ajax({//请求类型，这里为POSTtype:'POST',//你要请求的api的URLurl:url,//是否使用缓存cache:false,//数据类型，这里我用的是jsondataType:"json",//必要的时候需要用JSON.stringify()将JSON对象转换成字符串data:JSON.strigify({key:value}),...
request payload转为form data
03-16
将request payload转换为form data的方法如下： 1. 首先，需要将request payload中的数据解析出来，可以使用JSON.parse()方法将其转换为JSON对象。 2. 然后，需要将JSON对象中的数据转换为form data格式。可以使用URLSearchParams对象来实现这一步骤。 3. 最后，将转换后的form data作为请求体发送给服务器即可。 需要注意的是，如果request payload中包含文件等二进制数据，无法直接转换为form data格式，需要使用multipart/form-data格式发送请求。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

徐同保

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值