JSONP 跨域Ajax請求，利用js對獲取到的資料進行處理.
阿新 • • 發佈：2018-12-01
先看看獲取到的資料:
前端內容ajax 使用jsonp跨域請求方式,理解如下：
JSONP本質: 利用script標籤src跨域訪問，獲得一個回撥函式，再利用回撥函式引數內容獲取返回的資料args
img src 亦可以， Form src會被本地同源策略阻止XMLHttpRequest阻止
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>JSONP跨域請求</title> </head> <body> <input type="button" onclick="jsonp1()" value="jsonp跨域請求"></button> <div id="parent_div"> </div> <script src="/static/jquery-3.3.1.min.js"></script> <script> function jsonp1(){ $.ajax({ url: "http://www.jxntv.cn/data/jmd-jxtv2.html", type:"GET", //JSONP只能傳送get請求，預設GET data:{uid:1}, dataType:"jsonp", jsonp:"callback", //回撥函式用list包裹 jsonpCallback:"list" }); } //取出包裹到list函式中的值 function list(args){ console.log(args); console.log(args["data"]) for (var i = 0; i<args["data"].length; i++){ for (var j = 0; j < args["data"][i]["list"].length;j++){ //alert(args["data"][i]["list"][j]["name"]) tar = document.createElement("span"); tar.innerHTML = args["data"][i]["list"][j]["name"]; document.getElementById("parent_div").appendChild(tar); } } //$("#parent_div").html(obj.data) } </script> </body> </html>
後臺views.py資料：
from django.shortcuts import render,HttpResponse
import uuid,os,json
def jsonp(request):
return render(request,"jsonp.html")本文參考老男孩教學資料，感謝.