JSONP 구현
- 高洛峰원래의
- 2016-12-24 17:37:481217검색
교차 도메인 데이터를 얻으려면 jsonp를 사용하세요.
js 부분
(function(window, document) {
'use strict';
var jsonp = function(url, data, callback) {
//1、挂载回调函数
var fnsuffix = Math.random().toString().replace('.', '');
var cbFuncName = 'my_json_cb' + fnsuffix;
window[cbFuncName] = callback;
//2、将data转换成url字符串的形式
//{id=1,count=4}==>id=1&count=4
var querystring = url.indexOf('?') == -1 ? '?' : '&'; //判断url中最后是否有？，没有则为？
for (var key in data) {
querystring += key + '=' + data[key] + '&';
}
//3、处理url中回调函数 url+=callback=sdgade
querystring += 'callback=' + cbFuncName;
//querystring=?id=1&count=4&callback=sdgade
//4、创建一个script标签
var scriptElement = document.createElement('script');
scriptElement.src = url + querystring;
//5、把script标签放到页面上
document.body.appendChild(scriptElement);
};
window.$jsonp = jsonp;
})(window, document)테스트
<!DOCTYPE html>
<html>
<head>
<title>jsonp</title>
</head>
<body>
<div id="htt"></div>
<script type="text/javascript" src="http.js"></script>
<script>
(function(){
$jsonp('http://api.douban.com/v2/movie/in_theaters',{},
function(data){
document.getElementById('htt').innerHTML=JSON.stringify(data);
});
})()
</script>
</body>
</html>결과가 페이지에 표시되어 획득이 성공했음을 나타냅니다.
JSONP 구현과 관련된 더 많은 글은 PHP 중국어 홈페이지를 주목해주세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.