Ajax发送POST请求把数据到后端后,后端收到数据并解析出来

示列一:

Ajax发送请求,这里主要是发送一个数组的数据类型到后端,如果没有先把数组进行格式化成字符串的话,后端就收了就是一个字符串类型,为了后端接收的是一个列表的类型,所以先进行JSON.stringify()进行数据的转化:

var tr = $(":checked").parent().parent();
if(tr.length != 0){
tr.each(function(){
postList.push($(this).attr('id')); // 选择的id
});
//console.log(postList); // [1,2,3] if(postList != ''){
$.ajax({
url: '/demo/user/',
type: 'POST',
dataType: 'JSON',
// data: JSON.stringify(postList), //这里是把列表转化为字符串
data: JSON.stringify({ // 把键值对格式转化为字符串
'postList':postList,
'value':status
}),
success:function (arg) {
if(arg.status){
alert(arg.msg);
window.location.reload();
}else {
alert(arg.msg);
}
}
});
}
}else{
alert('请选择要设置的用户')
}

  

Py后端接收:

def users_list(request):
if request.method == "POST":
content = request.body # 字节
content = str(content, encoding='utf-8') # 字符串
result = json.loads(content) # 再通过json解析成一个字典,字典包含前端传的列表
# print('结果', result,type(result)) # {'value': 'True', 'postList': ['5']} <class 'dict'>
response = {'status':False,'msg':None}
# for id in result:
for id in result['postList']:
print(id)
return JsonResponse(response)

示列二:

Ajax发送请求:

$.ajax({
url: '/demo/user/',
type: 'POST',
dataType: 'JSON',
// data: JSON.stringify(postList), //这里是把列表转化为字符串
data:{ // 把键值对格式转化为字符串
'username':'ray',
'password':'123456'
},
success:function (arg) {
if(arg.status){
alert(arg.msg);
window.location.reload();
}else {
alert(arg.msg);
}
}
}); 这里data也可以用FormData来封装数据,例如:
var data = new FormData();
data.append('name',$(":input[name='name']").val());
data.append('file',$(":input[name='file']")[0].files[0]); //文件

  

Py后端接收:

def ajaxpost(request):
result = {}
if request.method == "POST":
username = request.POST.get('username ')
password= request.POST.get('password')
return Jsonresponse(result)

  

总结:

这里主要是记录Ajax发送数据对数据格式的封装。

① 如果前端需要发送一个列表格式的数据给后端,则需要通过 JSON.stringify() 先把数据转换为字符串发送给后端,后端可以通过request.body获取到数据并把数据用 json.reloads 解析出来。

② 如果前端直接发送一个键值对的数据给后端,后端在接收数据的时候可直接通过request.POST获取即可。

Ajax发送POST请求对数据的封装的更多相关文章

  1. AJAX的来龙去脉(由来)-如何被封装出来的--ajax发送异步请求(四步操作)

    <黑马程序员_超全面的JavaWeb视频教程vedio\JavaWeb视频教程_day23_ajax> \JavaWeb视频教程_day23_ajax\day23ajax_avi\14.打 ...

  2. 16 react 发送异步请求获取数据 和 使用Redux-thunk中间件进行 ajax 请求发送

    1.发送异步请求获取数据 1.引入 axios ( 使用 yarn add axios 进行安装 ) import axios from 'axios'; 2. 模拟 在元素完成挂载后加载数据 并初始 ...

  3. AJAX发送PUT请求引发的血案

    如果直接发送ajax=put形式的请求      是拿不到请求体中的数据的.           Tomcat:              1.将请求体中的数据,封装一个map             ...

  4. Ajax发送XML请求案例

    Ajax发送XML请求需求: 根据输入的国家,输出这些国家下面的城市. 如果请求参数较多,而且请求参数的结构关系复杂,则可以考虑发送XML请求.XML请求的实质还是POST请求,只是在发送请求的客户端 ...

  5. ajax发送PUT请求,使用HttpPutFormContentFilter过滤器接受办法

    相信在使用ajax发送put请求时候,肯定遇到过后端数据无法被接受到的405错误. 为什么会遇到这个问题? 1.首先查看Tomcat源码 关于如何将数据封装到Request public class ...

  6. AJAX发送异步请求教程详解

    AJAX 一.AJAX简介 什么是 AJAX ? AJAX = 异步 JavaScript 和 XML. AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可 ...

  7. 使用Ajax发送http请求(get&post请求)

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 同步和异步 同步和异步的概念 同步:必须等待前面的任务完成,才能继续后面 ...

  8. 原生JS实现ajax 发送post请求

    1. [代码]原生JS实现ajax 发送post请求 <script> var oStr = ''; var postData = {}; var oAjax = null; //post ...

  9. IT兄弟连 JavaWeb教程 使用AJAX发送POST请求并获取响应

    POST请求用于向服务器发送应该被保存的数据,因此POST请求天然比GET请求多需要一份需要被保存的数据.那么这些数据应该放在何处呢?毕竟,我们的open()方法接收的三个参数都没有合适的位置. 答案 ...

随机推荐

  1. 检查iOS项目中是否使用了IDFA

    (1)什么是IDFA 关于IDFA,在提交应用到App Store时,iTunes Connect有如下说明:   这里说到检查项目中是否包含IDFA,那如何来对iOS项目(包括第三方SDK)检查是否 ...

  2. [视频]K8飞刀 ms15022 office漏洞演示动画

    [视频]K8飞刀 ms15022 office漏洞演示动画 https://pan.baidu.com/s/1eQnV8qQ

  3. SQLAlchemy的ORM

    表关系: 表之间的关系存在三种:一对一.一对多.多对多.而SQLAlchemy中的ORM也可以模拟这三种关系.因为一对一其实在SQLAlchemy中底层是通过一对多的方式模拟的,所以先来看下一对多的关 ...

  4. AndroidStudio打包apk,安装出现签名冲突--解决办法

    Android UiAutomator2项目部署到jenkins上,实现自动打包,并自动push&安装到设备上 遇到问题: 可成功实现自动打包并push到设备上后,install -r 的时候 ...

  5. opencv实现正交匹配追踪算法OMP

    //dic: 字典矩阵: //signal :待重构信号(一次只能重构一个信号,即一个向量) //min_residual: 最小残差 //sparsity:稀疏度 //coe:重构系数 //atom ...

  6. 为什么要设置Java环境变量(windows)

    在学习JAVA的过程中,涉及到多个环境变量(environment variable)的概念,如PATH.正确地配置这些环境变量,是能够顺利学习.开发的前提.而经常出现的问题是:有的学习者能够按照提示 ...

  7. 数据库设计 Step by Step (2)——数据库生命周期

    引言:数据库设计 Step by Step (1)得到这么多朋友的关注着实出乎了我的意外.这也坚定了我把这一系列的博文写好的决心.近来工作上的事务比较繁重,加之我期望这个系列的文章能尽可能的系统.完整 ...

  8. rabbitmq 生产环境配置

    目录 一 rabbitmq 生产部署 1.1 rabbitmq.conf 1.2 advanced.config 1.3 rabbitmq-env.conf 1.4 在生产环境中不适用的策略. 一 r ...

  9. linux添加用户、修改密码

    1.在root下添加用户用 adduser 命令 # 添加用户 admin [root@flm] #sudo adduser admin 2.添加用户登录密码 # 为用户 admin 修改密码 [ro ...

  10. 和我一起打造个简单搜索之ElasticSearch入门

    本文简单介绍了使用 Rest 接口,对 es 进行操作,更深入的学习,可以参考文末部分. 环境 本文以及后续 es 系列文章都基于 5.5.3 这个版本的 elasticsearch ,这个版本比较稳 ...