使用JSONP来取代AJAX进行跨域
说到用JavaScript动态加载内容，一般都会想到AJAX。
但AJAX所用的XML其实并非必须，还有其他类型的数据结构（例如JSON和HTML）也可以实现。
而且AJAX有个很大的问题：由于JavaScript的安全限制，AJAX的跨域非常麻烦。
但如果使用JSONP的话，问题就很容易搞定了。
JSONP就是JSON with Padding的缩写，意思是JSON加上一些填充。
那么究竟填充什么呢？这就要说下原理了。
当使用script标签时，浏览器可以加载来自外域的JavaScript文件。而JSON本身就是一个JavaScript的对象，所以浏览器也可以直接加载它们。
但单纯的加载毫无用处，因为JSON只是数据，我们还需要处理它。因此，假如用括号将JSON数据包围起来，然后传给一个JavaScript function，那这个function就能处理这个JSON数据了。
因此从技术上来说，JSONP并不是数据，而是JavaScript代码，和JSON是2个稍有区别的东西。
首先来看最简单的实现：
客户端：
<html> <head> <title>JSONP Test</title> <script> function test(text) {alert(text.hello);} </script> <script src="test.json"></script> </head> <body> </body> </html>
服务器端（就是那个test.json）
test({"hello": "hello world!"})
在浏览器中打开这个页面，将会弹出一个对话框，内容是hello world!。
事实上，我们的test.json文件就是个JavaScript文件，它调用test方法，并将其中的JSON数据（{"hello": "hello world!"}）作为参数。
也就是说，JSONP就是一次函数调用而已，明白这点就好办了。
不过动态加载当然不可能直接用script标签来做，但JavaScript是可以操作DOM的，所以我们只需要把script标签添加到DOM，就能实现动态加载了。
当然，改写DOM是个很麻烦的过程，我们可以使用一些JavaScript库来实现，下面就给个jQuery和GAE的例子：
客户端：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="author" content="keakon" /> <title>JSONP Test</title> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("jquery", "1.3.1"); </script> </head> <body> <script> $.getJSON("http://localhost:8080/?jsoncallback=?", function (json) { alert(json.text); } ); </script> </body> </html>
服务器端（本来是发在Google的论坛的，所以注释用的是英文，将就看吧）：
import wsgiref.handlers
from google.appengine.ext import webapp
class MainHandler(webapp.RequestHandler):
def get(self):
# Since browsers can't handle application/json as a text,
# and actually, it's a JavaScript code, not JSON, while I request jsoncallback,
# I use text/javascript to both display and process it.
self.response.headers['Content-Type'] = 'text/javascript; charset=UTF-8'
json = {"text": "Hello world!"} # the json data I want to output
jsoncallback = self.request.get('jsoncallback') # the jsoncallback argument
# if doesn't contain jsoncallback argument, simply output it
# otherwise, it should output jsoncallback_argument(json data)
# eg: hello({"text": "Hello world!"})
output = '%s(%s)' % (jsoncallback, json) if jsoncallback else json
self.response.out.write(output)
def main():
application = webapp.WSGIApplication([('/', MainHandler)])
wsgiref.handlers.CGIHandler().run(application)
if __name__ == '__main__':
main()
jQuery隐藏了很多实现，实际上它会自动判断jsoncallback=?，然后将?替换为一个随机生成的函数名（实际上就是我们的匿名函数），于是就形成了一次函数调用。
注意jsoncallback不是必须的，只是jQuery需要它的名字类似callback。
而且大多数都遵循这个命名规则，所以JSONP也被叫作JSON with callbacks。
个人也比较喜欢后者，因为更加贴近其原理，而不是其表面现象（填充了函数名和括号的JSON）。
当然，你可以更改这个函数名，但必须使用$.AJAX函数的jsonp参数来指定，$.getJSON函数是不提供这个参数的。
还在为AJAX跨域苦恼的不妨试试JSONP吧，而且JSON本身比XML也方便很多。
文章来自网络，个人收藏，如有冒犯敬请原谅！
