关于Jquery跨域请求php数据

时间 2019-11-12

标签关于 jquery 请求 php 数据栏目 JQuery 繁體版

原文原文链接

什么引发了ajax不能跨域请求的问题？javascript

ajax自己其实是经过XMLHttpRequest对象来进行数据的交互，而浏览器出于安全考虑，不容许js代码进行跨域操做，因此会警告。跨域的安全限制都是指浏览器端来讲的，服务器端是不存在跨域安全限制的。因此针对这2种状况衍生出2类跨域解决方案，一类是服务器端作中转相似代理方式，一类是js处理浏览器端的真正跨域访问。php

<script type="text/javascript" src="./jquery-1.6.4.min.js"></script>  
<script type="text/javascript">  
    function short(){  
        var url_long=$("#url_long").val();  
        var source=$("#source").val();  
        var request = "http://api.t.sina.com.cn/short_url/shorten.json?url_long="+url_long+"&source="+source+"&callback=?";  
        //&callback=? 必须加上，myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。jquery api 文档上有说明。  
        $.ajax({  
            dataType: "jsonp",//跨域访问 dataType 必须是jsonp 类型。  
            url: request,  
            type:"GET",  
            jsonp:"callback",//传递给请求处理程序或页面的，用以得到jsonp回调函数名(通常默认为:callback)
            jsonpCallback:"flightHandler",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名，也能够写"?"，jQuery会自动为你处理数据
            success: function(response) {  
                $("#shortUrl").html("短地址为："+response[0].url_short);  
            },  
             error: function(XMLHttpRequest, textStatus, errorThrown) {  
                alert("status"+XMLHttpRequest.status);  
                alert("readyState"+XMLHttpRequest.readyState);  
                alert("textstatus"+textStatus);  
                alert(errorThrown);  
            }  
        });  
        return false;  
    }  
    </script>  
});

php后端：html

ult = json_encode(array($data));
echo "flightHandler($result)";
//此处的flightHandler是上面$ajax中jsonpCallback定义的名称,因为jquery已经封装好了jsonp能够直接拿去用。
//当使用jsonp时，使用 JSONP 形式调用函数时，如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。
//有人建议此处的函数名称能够弄成动态获取的，为了实现不一样的操做代码范例：
$method = isset($_GET[‘method’])?trim($_GET[‘method’]):’flightHandler’;//获取方法名称
$result = json_encode(array($data));
echo $method ."($result)";

或者java

 print_r($_GET['callback'] . '(' . urldecode(json_encode($rs_info_arr)) . ')');

注意两点:
1. datatype 必须为jsonp
2.callback=? 必须加上，开始没加上，success：function 一直没有响应（返回了数据）。
3.charset="utf-8" 为utf-8 ,文件的保存格式也应该是encoding utf-8 。

若是采用form 表单提交，不需考虑跨域问题。jquery

<html lang="zh" xml:lang="zh" xmlns="http://www.w3.org/1999/xhtml"><head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
 meta charset="utf-8">
 <title>Tools</title>
</head>
<body >
  <div>
 欢迎使用地址转写工具，请输入连接<br><br>
  <form action="http://api.t.sina.com.cn/short_url/shorten.json" method="get">
物品连接：<input type="string" name="url_long" /><br>
 
     APIkey     <input type="string" name="source" value="1681459862" /><br><br>
  <input type="submit" name="submit" value="提交" />
  </form>
  </div>
</body>