[jQuery] ajax跨域处理方式

转载于 2013-04-17 15:23:00 发布 · 57 阅读

文章标签：

#javascript #php #json #ViewUI

本文详细介绍了如何利用jQuery的ajax函数处理跨域请求问题，特别是当Ajax请求的目标域名与发起请求的域名不一致时，通过设置dataType为jsonp来实现跨域数据调用。

情景：

域名A：http://www.sharefamily.net

域名B：http://member.sharefamily.net

域名A要通过ajax，调用域名B的数据，这样就会出现ajax跨域名请求的问题。

如果你是使用了jQuery，那么就很好处理了，将ajax的dataType设置为jsonp就可以了。

域名A的js代码原来是：

        jQuery.ajax({
		url: 'http://member.sharefamily.net',
		type: 'get',
		dataType: 'json',
		success: function (rs) {
			//其它逻辑
		}
	});

修改为：

        jQuery.ajax({
		url: 'http://member.sharefamily.net',
		type: 'get',
		dataType: 'jsonp', //注意这里，主要使用 jsonp 这个方式
		success: function (rs) {
			//其它逻辑
		}
	});

如果域名B的后端程序原来输出的是json值，那么也要处理一下，如以下 PHP 代码：

        //存在$_GET['callback']，代表是跨域请求
        if (!empty($_GET['callback']))
        {
            echo $_GET['callback'] . '('.json_encode($rs) . ')';
        }
        else
        {
            echo json_encode($rs);
        }

Have fun with jQuery！