Ajax幾種請求方式(jQuery, XMLHttpRequest),原生Ajax, Django
阿新 • • 發佈:2018-12-01
三種方式 直接上前端程式碼:
1. jquery ajax
2. XMLHttpRequest GET方式
3. XMLHttpRequest POST方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Ajax請求的幾種方式</title> </head> <body> <p><button id="jQueryAjax" onclick="ajax1()">Query Ajax</button></p> <p><button id="XHRAjax1" onclick="ajax2()">XMLHttpRequest Ajax GET</button></p> <p><button id="XHRAjax2" onclick="ajax3()">XMLHttp Request Ajax POST</button></p> <script src="/static/jquery-3.3.1.min.js"></script> <script> //jquery ajax function ajax1() { $.ajax({ url:"/ajax1", data:{"name":123}, type:"GET", success:function (arg) { console.log(arg) } }); } //原生XMLHttpRequest GET方式請求 function ajax2(){ //獲取XMLHttpRequest物件 var xlr = new XMLHttpRequest(); //提前設定返回狀態改變時如何接收資料 xlr.onreadystatechange=function () { //狀態4表示資料返回 if(xlr.readyState==4){ console.log(xlr.responseText); } }; //設定傳送方式和url xlr.open("GET","/ajax2?name=raylu"); //傳送 xlr.send(); } //原生XMLHttpRequest POST方式請求 function ajax3(){ //獲取XMLHttpRequest物件 var xlr = new XMLHttpRequest(); //提前設定返回狀態改變時如何接收資料 xlr.onreadystatechange=function () { //狀態4表示資料返回 if(xlr.readyState==4){ console.log(xlr.responseText); } }; //設定傳送方式和url xlr.open("POST","/ajax3/"); //POST方式提交需要設定請求頭 xlr.setRequestHeader('Content-Type','application/x-www-form-urlencoded; charset-UTF-8'); //傳送12 xlr.send("name=raylu"); } </script> </body> </html>
後臺View程式碼:
from django.shortcuts import render,HttpResponse def view(request): return render(request,"index.html") # Create your views here. #通過jQuery請求 def ajax1(request): if request.method=="POST": print(request.POST) return HttpResponse("123") else: print(request.GET) return HttpResponse("456") #通過原生的XMLHttpRequest進行GET請求 def ajax2(request): if request.method=="POST": print(request.POST) return HttpResponse("123") else: print(request.GET) return HttpResponse("456") #通過原生的XMLHttpRequest進行POST請求 def ajax3(request): if request.method=="POST": print(request.POST) return HttpResponse("123") elif request.method=="GET": print(request.GET) return HttpResponse("456")
url路由:
from django.contrib import admin
from django.urls import path
from app1 import views
urlpatterns = [
path('admin/', admin.site.urls),
path('index/', views.view),
path('ajax1/', views.ajax1),
path('ajax2/', views.ajax2),
path('ajax3/', views.ajax3),
]
settings:
STATIC_URL = '/static/' STATICFILES_DIRS=[ os.path.join(BASE_DIR,"static") ]
注意使用POST提交時把CSRF註釋掉,否則需要在前端加入{% csrf_token %}