JSON

JSON指的是JavaScript对象方法（JavaScript Object Notation）
JSON是轻量级的文本数据交换格式
JSON独立于语言
JSON具有自我i描述，更易理解

Ajax

　　　　　AJAX(Asynchronous Javascript And XML) 翻译内容即“异步Javascript和XML”。即使用Javascript语言与服　　　　　　　　　　务器机型异步交互，传输数据为XML。 PS：传输数据不知是XML，JSON数据更常用

　　　　　AJAX除异步的特点外，还有浏览器页面局部刷新功能。

发送请求给服务器的途径

地址栏：get
form表单：支持get与post
超链接：click是get方式
Ajax请求：可以指定get和post PS：发Ajax请求一半返回HttpResponse()

简单的Ajax请求

　　修改views视图

 1 from django.shortcuts import render,HttpResponse,redirect
 2 from django.views import View
 3
 4 # Create your views here.
 5
 6 class Upload(View):
 7     def get(self,request):
 8         return render(request,'upload.html')
 9     def post(self,request):
10         print('已执行')
11         return HttpResponse('提交成功')

View Code

　　修改HTML

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
{% csrf_token %}
<input type="text" name="usm"><br>
<input type="password" name="pwd"><br>
<input type="file" name="file"><br>
<input type="button" value="提交" id="btn"><br>
<span class="conent"></span>
<script src="{% static 'js/jquery-3.4.1.js' %}"></script></body>
<script>$('#btn').click(function () {var csrf_data=$('[name=csrfmiddlewaretoken]').val();console.log(csrf_data);$.ajax({url:'{% url "upload" %}',type:'post',data:{csrfmiddlewaretoken:csrf_data},success:function (response) {$('.conent').text(response);alert(response)}})})
</script>
</html>

View Code

　　修改urls路由

from django.conf.urls import url
from django.contrib import admin
from app01 import viewsurlpatterns = [url(r'^admin/', admin.site.urls),url(r'upload/',views.Upload.as_view(),name='upload'),
]

View Code

基于Ajax的文件传输

　　　修改views视图

from django.shortcuts import render,HttpResponse,redirect
from pydiango4 import settings
from django.http import JsonResponse
import os# Create your views here.def login(request):return render(request,'login.html')def index(request):# if request.method=='POST':#     print('ok')print('已跳转')usm=request.POST.get('usm')pwd=request.POST.get('pwd')print(usm,pwd)if usm=='wmm' and pwd=='123':return HttpResponse('1')else:return HttpResponse('no')def upload(request):if request.method=='POST':file_obj=request.FILES.get('hede')# 接收文件用FILES而不是POST/GETpath=os.path.join(settings.BASE_DIR,'static_file','img',file_obj.name)with open(path,'wb')as f:for chunks in file_obj.chunks():# chunks()每次读取数据大小是稳定的
                f.write(chunks)dic={'asd':12,'zxc':15}return JsonResponse(dic,safe=True)# JsonResponse()用于将数据转化为json数据并返回# safe=True 当传输数据 非字典 类型时需要safe=False

View Code

　　　修改HTML

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<form method="post" action="{% url 'upload' %}" enctype="multipart/form-data">{% csrf_token %}<input type="file" name="hede"><input type="submit" id="btn">
</form>
</body>
<script src="{% static 'js/jquery-3.4.1.js' %}"></script>
<script>
$('#btn').click(function(){var formdata=new FormData();var file=$('[name=hede]')[0].files[0];var csrf_data=$('[name=csrfmiddlewaretoken]').val();formdata.append('file',file);formdata.append('csrfmiddlewaretoken',csrf_data);$.ajax({url:'{% url "login" %}',type:'post',data:formdata,processData:false,contentType:false,success:function () {}})
})</script>
</html>

View Code

　　　修改urls路由

from django.conf.urls import url
from django.contrib import admin
from app01 import viewsurlpatterns = [url(r'^admin/', admin.site.urls),url(r'login/',views.login,name='login'),url(r'index/',views.index,name='index'),url(r'upload/',views.upload,name='upload'),
]

View Code

转载于:https://www.cnblogs.com/lttlpp61007188/p/10950877.html

Django，Ajax，文件上传，ajax发送json数据，基于Ajax的文件上传相关推荐

Ajax 通过 Request Payload 体发送 JSON 数据体
为什么80%的码农都做不了架构师?>>> AJAX POST 发送数据有2种方式: Form Data 和 Request Payload . Form Data 是我们大家 ...
Arduino UNO 单片机读RFID RC522卡号发送Json数据
Arduino UNO 单片机读RFID RC522卡号发送Json数据记得添加库文件哦 /*Arduino Uno <-> RFID-RC52210 <-> SDA13 ...
c#实现ajax通信：向后台发送JSON字符串，接收响应字符串，并转换为对象
全栈工程师开发手册 (作者:栾鹏) c#教程全解 c#实现ajax通信,通过向服务器后台发送json数据,接收响应数据提交给前台. 其中包含两个主要函数,发送数据,接收响应数据的Http请求响应函数. ...
处理文件上传后返回json数据在IE出现文件下载问题(框架是spring boot)
处理文件上传后返回json数据在IE出现文件下载问题(框架是spring boot) 最近做了一个上传xml文件的功能,在谷歌浏览上传没有问题,可以返回正确的结果,但在ie浏览器上上传成功以后,一直提 ...
实现前后台数据交互（上传/回传单个JSON数据和上传/回传JSON数组）
一.上传单个JSON数据所需jar文件: 创建JSON实体类: package domain;public class Data1 {private String name;private Stri ...
spring mvc 返回json数据到ajax报错parseerror问题
最近使用ajax接收spring mvc传过来的json数据时总是出现parseerror的错误,错误源码如下: 前端: $.ajax({type: 'POST',url: "groupFu ...
python发送json数据_在Websockets上发送JSON
我有一个简单的Python tornado Websockets服务器,从JavaScript客户端接收消息.我正在尝试发送JSON数据,我找到的唯一解决方案是将JSON对象转换成字符串JSON,发送 ...
html表单发送json,在HTML表单上发送JSON数据提交
我有一个html表单,该表单有两个字段(名称,说明).当用户点击该表单的提交按钮时,我想以json格式提交表单数据.在HTML表单上发送JSON数据提交我试过如下: function submitD ...
PHP向第三方接口发送json数据
2019独角兽企业重金招聘Python工程师标准>>> 开发项目中,遇到需要向第三方接口发送json数据数据的情况,php默认发送数据形式为text,需要告诉第三方接口数据形式为js ...
jmeter发送json数据，报405、400错误解决方案
jmeter发送json数据,报405.400错误解决方案参考文章: (1)jmeter发送json数据,报405.400错误解决方案 (2)https://www.cnblogs.com/sunn ...

Django，Ajax，文件上传，ajax发送json数据，基于Ajax的文件上传

JSON

Ajax

发送请求给服务器的途径

简单的Ajax请求

基于Ajax的文件传输

Django，Ajax，文件上传，ajax发送json数据，基于Ajax的文件上传相关推荐

最新文章

热门文章