from提交ajax,form表单提交与ajax消息传递

这篇博客探讨了前端表单提交与Ajax异步请求的差异,包括数据编码格式、文件传输及Json数据处理。在Django中,form表单与Ajax提交的数据可以通过request.POST和request.body获取。Ajax发送Json数据时需要注意contentType设置。同时,介绍了自定义Django中间件来处理请求和响应,并展示了如何在Ajax中处理文件上传。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

form表单提交与ajax消息传递

1.前后端传输数据编码格式contentType:

urlencoded

对应的数据格式:name=xxx&password=666

后端获取数据:request.POST

ps;django会将urlencoded编码的数据解析自动放到request.POST

formdata

form表单传输文件的编码格式

后端获取文件格式数据:request.FILES

后端获取普通键值对数据:request.POST

application/json

ajax发送json格式数据

需要注意的点

编码与数据格式要一致

2.form表单与ajax异同点:

(1) form表单不支持异步提交局部刷新

(2) form表单不支持传输json格式数据

(3) form表单与ajax默认传输数据的编码格式都是urlencoded

3.ajax传普通数据

{##}

提交~

$('#d1').click(function () {

$.ajax({

// 提交的地址

url:'/index/',

// 提交的方式

type:'post',

// 提交的数据

data:{'name':'sean','password':'123'},

// 回调函数

success:function (data) { // data接收的就是异步提交返回的结果

alert(data)

}

})

})

4.ajax传文件数据

$('#d1').click(function () {

var formdata = new FormData();

// FormData对象不仅仅可以传文件还可以传普通的键值对

formdata.append('name','owen');

// 获取input框存放的文件

//$('#i1')[0]由Jquery对象变为js对象

formdata.append('myfile',$('#i1')[0].files[0]);

$.ajax({

url:'',

type:'post',

data:formdata,

// ajax发送文件需要修改两个固定的参数

processData:false, // 告诉浏览器不要处理我的数据

contentType:false, // 不要用任何的编码,就用我formdata自带的编码格式,django能够自动识别改formdata对象

// 回调函数

success:function (data) {

alert(data)

}

})

})

5.ajax传json数据:

$('#d1').click(function () {

$.ajax({

url:'', // url参数可以不写,默认就是当前页面打开的地址

type:'post',

contentType:'application/json',

data:JSON.stringify({'name':'nick','hobby':'study'}),

success:function (data) {

alert(data)

}

})

})

后台:

import json

from django.http import JsonResponse

def ajax_json(request):

if request.method == 'POST':

print(request.body) # json格式只有通过request.body才能查看

res = json.loads(request.body.decode('utf-8'))

hobby = res.get('hobby')

return HttpResponse('OK') # 必须返回HttpResponse对象

return render(request, 'ajax_json.html')

6.form表单

form_up

后台:

def index(request):

if request.method == 'POST':

print(request.POST) # 普通的键值对:

print(request.body)

#print(request.FILES)

#传文件< MultiValueDict: {'myfile': [ < InMemoryUploadedFile: day17课件.md(application / octet - stream) >]} >

return HttpResponse('OK')

return render(request, 'index.html')

七Django默认有七个中间件

Django默认有七个中间件,但是django暴露给用户可以自定义中间件并且里面可以写五种方法

中间件可以定义五个方法,分别是:(主要的是process_request和process_response)

有response需要加上return

process_request(self,request)

process_response(self, request, response)

process_view(self, request, view_func, view_args, view_kwargs)

process_template_response(self,request,response)

process_exception(self, request, exception)

'mymiddleware.middleware.MyMiddleWare1'

from django.utils.deprecation import MiddlewareMixin

class MyMiddleWare(MiddlewareMixin):

def process_request(self,request):

print('我是第一个自定义的中间件中process_request方法')

def process_response(self,request,response):

print('我是第一个自定义的中间件中process_response方法')

return response

拷贝方法:

import copy

params = copy.deepcopy(request.POST)

params["firstname"] = "zhao"

print(params)

request.POST = params

#可利用深拷贝在POST中手动添加键值对

#https://www.cnblogs.com/zgf-666/p/9161910.html

中间件代码:

from django.utils.deprecation import MiddlewareMixin

import json

class MyMiddleWare(MiddlewareMixin):

def process_request(self,request):

print('我是第一个自定义的中间件中process_request方法')

import copy

params = copy.deepcopy(request.POST)

# params["firstname"] = "zhao"

# print(params)

# request.POST = params

if not request.POST:

if request.body:

# < QueryDict: {'username': ['dasdas']} >

res = json.loads(request.body.decode('utf-8'))

print(res,type(res))

for k,v in res.items():

params[k] = v

request.POST = params

# print(request.POST)

def process_response(self,request,response):

print('我是第一个自定义的中间件中process_response方法')

return response

Form表单提交,Ajax请求,&dollar;http请求的区别

做过前端同学想必都避免不了要和后台server打交道.而以下这三种与后台交互的方式想必大家都不陌生. Form表单提交,Ajax请求,Angular的$http请求 以前一直搞不清楚什么时候应该用哪种 ...

form表单提交转为ajax方式提交

//action的值是请求的url地址

form表单提交和ajax提交优先级

form中若定义action,那么,ajax将不能执行.form默认提交的请求优先级高于ajax

使用form表单提交请求如何获取后台返回的数据?

问题描述 一般的form表单提交是单向的:只能给服务器发送数据,但是无法获取服务器返回的数据,也就是无法读取HTTP应答包. 想要真正的半双工通讯一般需要使用Ajax, 但是Ajax对文件传输也很麻烦 ...

Checkbox框全选操作,form表单提交与jquery ajax提交两种处理方式

//1.jquery ajax

ajax form表单提交 input file中的文件

ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...

python中前后端通信方法Ajax和ORM映射(form表单提交)

后端从数据库获取数据给到前端: 第一种方式: admin.py文件代码: @admin.route('/showList') def show(): # 获取数据库所有文章数据,得到一个个对象 res ...

随机推荐

HW7&period;3

public class Solution { public static void main(String[] args) { char[][] answers = { {'A', 'B', 'A' ...

editpuls查找替换通配符

1  \t    Tab character.         tab符号 2  \n    New line.              新的一行(换行符) 3  .     Matches any ...

Oracle约束操作

约束的概念: 约束是在表中定义的用于维护数据库完整性的一些规则.通过为表中的字段定义约 束,可以防止将错误的数据插入到表中. 注意: 1.如果某个约束只作用于单独的字段,既可以在字段级定义约束,也可以 ...

Dubbo阿里Alibaba开源的分布式服务框架

[获奖公布]"我的2016"主题征文活动    程序猿全指南,让[移动开发]更简单!      [观点]移动原生App开发和HTML 5开发,你更看好哪个?   博客的神秘功能 D ...

mongodb中查询返回指定字段

mongodb中查询返回指定字段   在写vue项目调用接口获取数据的时候,比如新闻列表页我只需要显示新闻标题和发表时间,点击每条新闻进入详情页的时候才会需要摘要.新闻内容等关于此条新闻的所有字段.  ...

ORM PetaPoco 框架的 CRUD 操作

PetaPoco 的查询操作 public IEnumerable GetAll(string sqlString, object[] obj) { try { IEnumerabl ...

Chapter 3 Phenomenon——9

"You were over there," I suddenly remembered, and his chuckle stopped short. “你之前不在这里”我突然记 ...

Homebrew 安装 MySQL

安装 Homebrew brew doctor 确认 brew 在正常工作 brew update 更新包 brew install mysql 安装 MySQL ​ ==> Downloadi ...

JVM指令集(指令码、助记符、功能描述)

JVM指令集(指令码.助记符.功能描述) 指令码 助记符 功能描述 0x00 nop 无操作 0x01 aconst_null 指令格式:  aconst_null 功能描述:  null进栈. 指令 ...

Linux下设置mysql和tomcat开机启动

本文基于CentOS 64位     一.mysql设置开机启动 1.cp /usr/local/mysql/support-files/mysql.server /etc/init.d/mysql ...

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值