首页 > 代码库 > 使用jquery实现跨域请求数据
使用jquery实现跨域请求数据
首先处理服务器代码，使返回的数据符合特定的格式，为了方便这里使用了php
test.php代码如下
1 <?php 2 $con = mysql_connect("localhost","root","root"); 3 mysql_select_db("test", $con); 4 5 $result = mysql_query("select username,password from user"); 6 while ($row = mysql_fetch_array($result)) { 7 $com[] = $row; 8 } 9 10 $callback = $_GET["jsonpcallback"];11 $json=json_encode($com);12 echo $callback.‘(‘."$json".‘)‘;13 ?>
$json的输出值为[{"0":"1","username":"1","1":"1","password":"1"},{"0":"admin","username":"admin","1":"1","password":"1"}]，是一个标准的json，但这个页面需要处理跨域，所以需要把json包裹成callback([{"0":"1","username":"1","1":"1","password":"1"},{"0":"admin","username":"admin","1":"1","password":"1"}])的格式输出给浏览器
html代码如下
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 5 <title>Insert title here</title> 6 <script src="js/jquery.min.js" type="text/javascript"></script> 7 <script> 8 $(function(){ 9 var URL="http://localhost/test.php";10 $.ajax({11 type : ‘GET‘,12 url : URL,13 dataType : ‘jsonp‘,14 jsonp : ‘jsonpcallback‘,15 success : function(data) {16 alert(JSON.stringify(data));17 }18 });19 });20 </script>21 </head>22 </html>
输出结果
jsonp只支持"GET"的请求，这是加载跨域数据的原理决定的，虽然jquery使用了$.ajax()函数获取数据，但是jsonp获取数据真正做法并不是ajax，而是使用动态加载js的方式。
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。