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('提交成功')
修改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>
修改urls路由
from django.conf.urls import url from django.contrib import admin from app01 import views urlpatterns = [ url(r'^admin/', admin.site.urls), url(r'upload/',views.Upload.as_view(),name='upload'), ]
基于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/GET path=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
修改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>
修改urls路由
from django.conf.urls import url from django.contrib import admin from app01 import views urlpatterns = [ 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'), ]