首页 > 其他分享 >Ajax发送数据

Ajax发送数据

时间:2023-11-03 20:57:48浏览次数:26  
标签:body json request ajax print Ajax 发送数据 格式

ajax发送json格式数据(contentType)

"""
前后端传输数据的时候一定要确保编码格式跟数据真正的格式是一致的
不要骗人家!!!

{"username":"jason","age":25}  
	在request.POST里面肯定找不到
	
	django针对json格式的数据 不会做任何的处理 
	
request对象方法补充
	request.is_ajax()
		判断当前请求是否是ajax请求 返回布尔值
"""

<script>
    $('#d1').click(function () {
        $.ajax({
            url:'',
            type:'post',
            data:JSON.stringify({'username': 'tiger', 'age': 18}),	# 用JSON格式的字符串
            dataType:'JSON',
            contentType:'application/json',  // 指定编码格式  # 这里需要指定!!!
            success:function () {

            }
        })
    })
</script>

# 注意:django后端针对json格式的数据不会做任何的处理,你需要自己去 request.body 中获取原生的二进制数据自己处理
"""
1.解码
2.反序列化

(json.loads能够自动先解码再反序列化)
"""
def ab_json(request):
    if request.is_ajax():
        # print(request.is_ajax())
        # print(request.POST)
        # print(request.FILES)
        # 针对json格式需要你手自己动处理
        # print(request.body)  # b'{"username":"tiger","age":18}'
        json_body = request.body

        # 方式一:清晰但是繁琐
        # json_str = json_body.decode('utf-8')
        # json_dict = json.loads(json_str)

        # 方式二:
        # json.loads括号内如果传入了一个二进制格式的数据那么内部会自动解码再反序列化
        json_dict = json.loads(json_body)
        print(json_dict, type(json_dict))    # {'username': 'tiger', 'age': 18}
    return render(request, 'ab_json.html')

"""
ajax发送json格式数据需要注意点
	1.contentType参数指定成:application/json
	2.数据是真正的json格式数据
	3.django后端不会帮你处理json格式数据需要你自己去 request.body 获取并处理
"""

ajax发送文件

"""
ajax发送文件需要借助于js内置对象FormData
"""
<script>
    // 点击按钮朝后端发送普通键值对和文件数据
    $('#d4').on('click', function (){
        // 1 需要先利用FormData内置对象
        let formDataObj = new FormData();
        // 2 添加普通的键值对
        formDataObj.append('username', $('#d1').val());
        formDataObj.append('password', $('#d2').val());
        // 3 添加文件对象
        formDataObj.append('myfile', $('#d3')[0].files[0]);		# 文件的固定写法!!!
        // 4 将对象基于ajax发送给后端
        $.ajax({
            url:'',
            type:'post',
            data:formDataObj,  // 直接将对象放在data后面即可
			
            # 两个关键参数
            // ajax发送文件必须指定的两个参数
            contentType:false,  // 不需使用任何编码 django后端能够自动识别formdata对象
            processData:false,  // 告诉你的浏览器不要对你的数据进行任何处理

            success:function (args){

            }
        })
    })
</script>

def ab_file(request):
    if request.is_ajax():
        if request.method == 'POST':
            print(request.POST)
            print(request.FILES)
    return render(request,'ab_file.html')

"""
总结:
    1.需要利用内置对象FormData
    	// 1 需要先利用FormData内置对象
        let formDataObj = new FormData();
        // 2 添加普通的键值对
        formDateObj.append('username',$('#d1').val());
        formDateObj.append('password',$('#d2').val());
        // 3 添加文件对象
        formDateObj.append('myfile',$('#d3')[0].files[0])
    
    2.需要指定两个关键性的参数
        contentType:false,  // 不需使用任何编码 django后端能够自动识别formdata对象
        processData:false,  // 告诉你的浏览器不要对你的数据进行任何处理
    
    3.django后端能够直接识别到formdata对象并且能够将内部的普通键值自动解析并封装到request.POST中 文件数据自动解析并封装到request.FILES中
"""

标签:body,json,request,ajax,print,Ajax,发送数据,格式
From: https://www.cnblogs.com/piggthird/p/17808482.html

相关文章

  • AJAX-事件循环(超详细过程)
    一.概念JS有一个基于事件循环的并发模型,事件循环负责执行代码、收集和处理事件以及执行队列中的子任务。定义:执行代码和收集异步任务的模型,在调用栈空闲,反复调用任务队列里回调函数的执行机制,就叫时间循环。原因:JS是単线程,为了让耗时的代码不阻塞其他代码运行,设计了事件循环模型二......
  • Ajax + java Servlet 制作Web进度条
     运行效果图  index2.jsp <%@pagelanguage="java"pageEncoding="UTF-8"%><!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN"><html><head><scripttype="text/javascript"langua......
  • php: ajax请求,在返回信息前面出现ufeff红点,导致解析错误
    问题:ajax请求,在返回信息前面出现ufeff红点,导致解析错误原因:PHP文件格式编码位utf-8bom  文件编码是含BOM的会导致出现这种情况解决:  第一种方法:PHP文件格式编码转化为utf-8  第二种方法:在接口echo输出前面,添加一个ob_clean()函数           ......
  • 10、SpringMVC之处理Ajax请求
    创建名为spring_mvc_ajax的新module,过程参考9.1节和9.5节10.1、SpringMVC处理Ajax请求10.1.1、页面请求示例<inputtype="button"value="测试SpringMVC处理Ajax请求"onclick="testAjax()"><scripttype="text/javascript">functiontestA......
  • AJAX-解决回调函数地狱问题
    一、同步代码和异步代码1.同步代码浏览器是按照我们书写代码的顺序一行一行地执行程序的。浏览器会等待代码的解析和工作,在上一行完成之后才会执行下一行。这也使得它成为一个同步程序。总结来说:逐行执行,需原地等待结果后,才继续向下执行2.异步代码异步编程技术使你的程序可以在一个......
  • AJAX的引入之传统请求带来的问题------计算机网络经典
    AJAX在浏览器当中发送异步请求,请求之间是独立的,谁也不用等谁类似于多线程并发,不会出现页面清空然后展示新的页面的效果实现局部刷新(靠多种技术一起做到的,而不是一个技术叫ajax)它是异步的(类似于多线程)准备一个前端页面用来发送传统的请求方式<!DOCTYPEhtml><htmllang=......
  • 手搭手Ajax经典基础案例省市联动
    环境介绍技术栈springboot+mybatis-plus+mysql软件版本mysql8IDEAIntelliJIDEA2022.2.1JDK1.8SpringBoot2.7.13mybatis-plus3.5.3.2pom.xml<?xmlversion="1.0"encoding="UTF-8"?><projectxmlns="http://maven.apache.org/POM/4.0.0"xmlns......
  • AJAX学习(四)-(axios核心的原理)
    一、Promise1.定义Promise对象用于表示一个异步操作的最终完成(或失败)及其结果值我们用一张图来清晰的看Promise位于哪里2.好处1.逻辑更清晰2.了解axios函数内部运作机制3.能解决回调函数地狱问题3.使用语法及步骤示例代码如下:<!DOCTYPEhtml><htmllang="en"><head><metacha......
  • form表单和ajax提交的重复
    form表单和ajax提交的重复form表单中input的submit类型和button按钮都会触发两次(有ajax的情况),当我们把input的type改成button类型就不会朝后端再发送POST请求了<formaction=""method="post">用户名:<inputtype="text"name="username"id="id_user">......
  • JavaSeript在发送AJAX请家时,URL的域名地址是使用绝对地址还是相对地呲?
    在发送AJAX请求时,URL的域名地址可以使用绝对地址或相对地址。绝对地址包含完整的协议、域名和路径,例如:http://example.com/api/data。这种方式适用于需要请求不同域名下的数据的情况。使用绝对地址时,可以确保请求准确地发送到指定的服务器。相对地址只包含相对于当......