python 抓取html存入json python获取网页json数据

目录

Ajax上传文件

jQuery + formData

原生XMLHttpRequest + formData

"伪"Ajax(iframe标签+form)

原生XMLHttpRequest

使用普通的Aax发送请求需要引入JQuery，可能在一些业务上(性能上)，指定不能导入JQuery，因此只能使用原生的Ajax代码发送请求

GETfunctionAjaxGETSubmit1() {var xhr = newXMLHttpRequest();//回调函数，相当于success:
xhr.onreadystatechange = function(){//回调函数根据状态执行，状态值readyState
//0-未初始化，尚未调用open()方法；
//1-启动，调用了open()方法，未调用send()方法；
//2-发送，已经调用了send()方法，未接收到响应；
//3-接收，已经接收到部分响应数据；
//4-完成，已经接收到全部响应数据；
if (xhr.readyState == 4) {//接收服务端返回的数据
console.log(xhr.responseText)
}
};//创建连接
xhr.open('GET','/ajax1.html');
xhr.send(null)
}
POSTfunctionAjaxPOSTSubmit() {var xhr = newXMLHttpRequest();//回调函数，相当于success:
xhr.onreadystatechange = function(){//回调函数根据状态执行，状态值readyState
//0-未初始化，尚未调用open()方法；
//1-启动，调用了open()方法，未调用send()方法；
//2-发送，已经调用了send()方法，未接收到响应；
//3-接收，已经接收到部分响应数据；
//4-完成，已经接收到全部响应数据；
if (xhr.readyState == 4) {//接收服务端返回的数据
console.log(xhr.responseText)
}
};//创建连接
xhr.open('POST','/ajax1.html');//POST传递时需要，设置请求头
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset-UTF-8');
xhr.send("p=456")
}

from django.shortcuts importrender,HttpResponsedefajax1(request):print(request.GET)print(request.POST)print(request.body)
ret= {'status':True,'message':'....'}importjsonreturn HttpResponse(json.dumps(ret))

Views

“伪”Ajax(iframe标签+form)

iframe标签可以通过不更新界面的情况下，跨域请求

方式一：

伪Ajax提交

基于Iframe + form表单

提交

functionAjaxSubmit() {
document.getElementById('fm').submit();
}//相当于回调函数
functionreloadIframe(ths) {//this=当前标签
//基于document来
console.log(ths);
console.log(ths.contentWindow);
console.log(ths.contentWindow.document.body.innerHTML);//基于JQuery来找
console.log($(ths).contents().find('body').html());varcontent=ths.contentWindow.document.body.innerHTML;varobj=JSON.parse(content);if(obj.status){
alert(obj.message);
}
}

方式二：(推荐)

伪Ajax提交

基于Iframe + form表单

提交

functionAjaxSubmit() {
document.getElementById('iframe').οnlοad=reloadIframe;
document.getElementById('fm').submit();
}//相当于回调函数
functionreloadIframe() {varcontent= this.contentWindow.document.body.innerHTML;varobj=JSON.parse(content);if(obj.status){
console.log(obj.message)
}
}

from django.shortcuts importrender,HttpResponsedefajax1(request):print(request.GET)print(request.POST)print(request.body)
ret= {'status':True,'message':'....'}importjsonreturn HttpResponse(json.dumps(ret))

Views

Ajax上传文件

使用formData对象来封装数据

文件上传

上传

上传

//Jquery+formData
functionAjaxFileSubmit1() {vardata= newFormData();
data.append('k1','v1');
data.append('k2','v3');
data.append('k3',document.getElementById('img').files[0]);
$.ajax({
url:'/ajax1.html',
type:'POST',
data: data,
success:function(arg) {
console.log(arg)
},
processData:false,
contentType:false})
}//原生XMLHttpRequest
functionAjaxFileSubmit2() {vardata= newFormData();
data.append('k1','v1');
data.append('k2','v3');
data.append('k3',document.getElementById('img').files[0]);varxhr= newXMLHttpRequest();//回调函数，相当于success:
xhr.onreadystatechange= function(){//回调函数根据状态执行，状态值readyState
//0-未初始化，尚未调用open()方法；
//1-启动，调用了open()方法，未调用send()方法；
//2-发送，已经调用了send()方法，未接收到响应；
//3-接收，已经接收到部分响应数据；
//4-完成，已经接收到全部响应数据；
if(xhr.readyState== 4) {//接收服务端返回的数据
console.log(xhr.responseText);
}
};//创建连接
xhr.open('POST','/ajax1.html');
xhr.send(data);
}

from django.shortcuts importrender,HttpResponsedefajax1(request):print(request.GET)print(request.POST)print(request.FILES)
ret= {'status':True,'message':'....'}importjsonreturn HttpResponse(json.dumps(ret))

Views

iframe标签+form(推荐)

提交

functionAjaxFileSubmit() {
document.getElementById('iframe').οnlοad=reloadIframe;
document.getElementById('fm').submit();
}//相当于回调函数
functionreloadIframe() {varcontent= this.contentWindow.document.body.innerHTML;varobj=JSON.parse(content);
console.log(obj.message)
}

jsonp

Ajax发送跨区请求，返回的响应，因为浏览器的同源策略(XMLHttpRequest支持)而被拦截，因此可以默认通过XMLHttpRequest方式发的请求是无法做到跨域请求的。

jsonp.html:1 Access to XMLHttpRequest at 'http://127.0.0.1:8002/chen.html?nid=2' from origin 'http://127.0.0.1:8001' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

因此为了避免使用XMLHttpRequest能发送请求，而使用和

jsonp是一种语言规范

应用A

function submitJsonp() {
$.ajax({
url:'http://127.0.0.1:8002/chen.html',
type:'GET',
dataType:'jsonp',
//传送过去的是方法名 http://127.0.0.1:8002/chen.html？callback=list
jsonp:'callback',
jsonpCallback:'list',
})
}
function list(arg) {
console.log(arg)
}

应用B

def chen(request):
name = request.GET.get('callback')
return HttpResponse('%s("test2返回");'%(name,))