jsonp和CORS跨域实现

写js时总是会遇到跨域请求的问题,现在了解了两种方法,记录之:

1)jsonp,使用jquery封装的$.ajax,返回数据类型要设置为jsonp,示例:

     $.ajax({
        type: 'get',
        contentType: "application/json; charset=utf-8",      
        url: "http://localhost:8080/aqi/getCityList.php",
        dataType: 'jsonp',</span>
        jsonp: "callback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(默认为:callback)
        jsonpCallback:"success_jsonpCallback",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名</span>
        success:function(json){
          getCityListSuccess(json);
        },
        error: function (data, textStatus, errorThrown) {
            console.log("error" + ' ' + JSON.stringify(data) + textStatus + errorThrown);
        }
    });

或者使用$.getJson,在调用的url添加&callback=?

$.getJSON("http://localhost:8080/aqi/getDetailsByTimepointAndCityId.php?callback=?", { "time_point": time_point, "city_id": city_id}, function (json) {
            $('#radar-dialog').css("display", "block");
            $('#radar-dialog').dialog({
                title: radar_cityname + "市," + timepoint,
                width: 350,
            });
            formatRadarData(json);
        });

PHP端的代码为:

<?php
   header("Content-Type: text/html;charset=utf-8");
  $db_name="aqidata.db";
   $conn = new sqlite3($db_name);
   $callback = $_GET['callback'];
   $resultarray=array();
  $sql = "select * from 'city' where 1=1 order by id";
  $result = $conn->query($sql);
  $i=0;
  while ($row = $result->fetchArray(SQLITE3_ASSOC)) {
     $resultarray[$i]=$row;
       $i++;
  }
   echo $callback.'('.json_encode($resultarray).')';


?>

注意:1、ajax中要指定jsonp参数,然后后端要把回调函数名称写入到返回值中。

我参考的博文是:http://www.cnblogs.com/xcxc/p/3729660.html


2)用CORS(Cross-Origin Resource Sharing),这个官方草案。

就是在后端代码(php)加入:
header("Access-Control-Allow-Origin:*");






  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值