Ajax发送POST请求对数据的封装
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请求对数据的封装的更多相关文章
- AJAX的来龙去脉(由来)-如何被封装出来的--ajax发送异步请求(四步操作)
<黑马程序员_超全面的JavaWeb视频教程vedio\JavaWeb视频教程_day23_ajax> \JavaWeb视频教程_day23_ajax\day23ajax_avi\14.打 ...
- 16 react 发送异步请求获取数据 和 使用Redux-thunk中间件进行 ajax 请求发送
1.发送异步请求获取数据 1.引入 axios ( 使用 yarn add axios 进行安装 ) import axios from 'axios'; 2. 模拟 在元素完成挂载后加载数据 并初始 ...
- AJAX发送PUT请求引发的血案
如果直接发送ajax=put形式的请求 是拿不到请求体中的数据的. Tomcat: 1.将请求体中的数据,封装一个map ...
- Ajax发送XML请求案例
Ajax发送XML请求需求: 根据输入的国家,输出这些国家下面的城市. 如果请求参数较多,而且请求参数的结构关系复杂,则可以考虑发送XML请求.XML请求的实质还是POST请求,只是在发送请求的客户端 ...
- ajax发送PUT请求,使用HttpPutFormContentFilter过滤器接受办法
相信在使用ajax发送put请求时候,肯定遇到过后端数据无法被接受到的405错误. 为什么会遇到这个问题? 1.首先查看Tomcat源码 关于如何将数据封装到Request public class ...
- AJAX发送异步请求教程详解
AJAX 一.AJAX简介 什么是 AJAX ? AJAX = 异步 JavaScript 和 XML. AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可 ...
- 使用Ajax发送http请求(get&post请求)
本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 同步和异步 同步和异步的概念 同步:必须等待前面的任务完成,才能继续后面 ...
- 原生JS实现ajax 发送post请求
1. [代码]原生JS实现ajax 发送post请求 <script> var oStr = ''; var postData = {}; var oAjax = null; //post ...
- IT兄弟连 JavaWeb教程 使用AJAX发送POST请求并获取响应
POST请求用于向服务器发送应该被保存的数据,因此POST请求天然比GET请求多需要一份需要被保存的数据.那么这些数据应该放在何处呢?毕竟,我们的open()方法接收的三个参数都没有合适的位置. 答案 ...
随机推荐
- JAVA常见安全问题复现
地址来源于乌云知识库,作者z_zz_zzz 0x01 任意文件下载 web.xml的配置: <servlet> <description></description> ...
- (原创)Callable、FutureTask中阻塞超时返回的坑点
直接上代码 import java.util.concurrent.Callable; public class MyCallable implements Callable<String> ...
- flask框架~简易编写
flaks框架: 先导报 from flask import Flask 重定向模块:redirect url_for是简易寻址跳转 jsonify强转为json格式 建立flask对象:app = ...
- SQL将原始数据进行MD5加密转存
先来描述下情况吧,首先有一批用户之前批量录入后默认的密码为6个8然后进行MD5加密后进行存储的,现在需要对其更改根据用户身份证号后6位作为密码. 1.首先发现我们sqlserver05以上的版本是自带 ...
- oracle 11g RAC数据库监听配置相关
oracle RAC 监听配置基本和单实例的配置相同 11g之后 安装RAC的过程中,不需要执行netca来手动创建监听,在安装集群软件的时候,会自动创建监听程序: 而在DBCA建库的时候,又会自动创 ...
- C# 多线程学习系列四之ThreadPool取消、超时子线程操作以及ManualResetEvent和AutoResetEvent信号量的使用
1.简介 虽然ThreadPool.Thread能开启子线程将一些任务交给子线程去承担,但是很多时候,因为某种原因,比如子线程发生异常.或者子线程的业务逻辑不符合我们的预期,那么这个时候我们必须关闭它 ...
- storm_常用命令
1)nimbus:启动nimbus守护进程 storm nimbus 2)supervisor:启动supervisor守护进程 storm supervisor 3)ui ...
- flex布局下, 内容改变 不重新渲染问题
当使用flex布局时,flex内元素包含的内容改变时,浏览器不会进行重新渲染, 答案引用 http://stackoverflow.com/questions/23474191/flexbox-hei ...
- 02-02:springboot 整合filter
1.通过注解扫描完成Filter组件的注册 1.1编写filter (添加拦截的servlet) //@WebFilter(filterName = "FirstFilter",u ...
- JavaScript -- Window-框架
-----025-Window-框架.html----- <!DOCTYPE html> <html> <head> <meta http-equiv=&qu ...