标签：pos console creat class result xmlhttp put get 方式
在需要访问不同域的接口的数据的时候，一般有两种方式:
第一种:使用requests模块,在业务逻辑中直接访问别的域的接口，获取数据,然后将返回的数据显示到前端页面上;
这个时候，访问的流程是: 客户端-->server请求其他域的接口--->返回数据到server--->返回到客户端
import requests
def req(request):
response = requests.get(‘http://php.weather.sina.com.cn/xml.php?city=%B1%B1%BE%A9&password=DJOYnieT8234jlsK&day=0‘)
# print(response.content) #字节
response.encoding = ‘utf-8‘
# print(response.text) #字符串
return render(request,‘req.html‘,{‘result‘:response.text})
第二种:使用js直接请求别的域的接口,获取数据,最长用的是jsonp;
<h1>后台获取的结果</h1>
{{ result }}
<h1>js获取的结果</h1>
<input type="button" value="获取数据" onclick="getContent();">
<div id="container"></div>
<script>
function getContent() {
/*
var xhr = new XMLHttpRequest();
xhr.open(‘GET‘,‘http://php.weather.sina.com.cn/xml.php?city=%B1%B1%BE%A9&password=DJOYnieT8234jlsK&day=0‘);
xhr.onreadystatechange = function () {
console.log(xhr.responseText);
};
xhr.send()
*/
var tag = document.createElement(‘script‘);
tag.src = ‘http://www.jxntv.cn/data/jmd-jxtv2.html?callback=list_=145376870403‘; //在创建src属性的时候，就会发送请求
document.head.appendChild(tag);
document.head.removeChild(tag);
}
function list(arg) {
console.log(arg);
}
</script>
jsonp请求的原理:浏览器具有同源策略，对于ajax请求,不接受不同域的数据,而对于script标签没有此约束,在创建script标签的src属性的时候,页面在加载src的链接的时候,也会执行(发送链接的请求)链接的地址,如果链接是http get的接口,会返回对应的数据,这样就实现了获取不同域的接口的数据的目的;
需要注意的是:接口返回的数据,一定要符合js格式,否则数据没有办法被处理,一般我们在src的get请求链接，会携带参数？callback=list,使用callback表示需要被返回的数据的格式,这样就可以在定义专门处理返回的数据的方法了; jsonp只能发送get请求,不能发送其他的请求;
使用jquery+jsonp请求数据如下:
function list(arg) {
console.log(arg);
}
function getContent() {
$.ajax({
url : ‘http://www.jxntv.cn/data/jmd-jxtv2.html?callback=list_=145376870403‘,
type : ‘POST‘,
dataType: ‘jsonp‘,
jsonp: ‘callback‘,
jsonpCallback:‘list‘
})
}
第三种:cors:跨域资源共享,就是在server端设置响应头来实现的;
参考博客:http://www.cnblogs.com/wupeiqi/articles/5703697.html
标签：pos console creat class result xmlhttp put get 方式
原文地址：http://www.cnblogs.com/cqq-20151202/p/6942073.html
