python+ajax+jsonp具体实现,基于jQuery实现的python服务端的jsonp跨域请求方案

说明:在代码中已经做好了注释,细看理解再实践,这里用的后端是python,其他语言逻辑是一样的

1、版本one

前端(设置端口与后端不同,与后端不再一个频道~,跨域了):

<script>
window.onload=function () {
   $.ajax({
       url: 'http://127.0.0.1:9000/ajaxjupyter',//http://127.0.0.1:9000/ajaxjupyter?callbackfun=jsonpCallback&temp_result=temp_result
       type: 'get',
       dataType: 'jsonp',
       jsonp:"callbackfun",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(默认为:callback)
       jsonpCallback:"jsonpCallback",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,如果定义了就success:function(){}就失效
       data: {
           temp_result:“123123123”
       },
   });
}

 function jsonpCallback(data) {//处理返回信息的函数
           console.log(data)
       }
</script>

后端(端口9000,与前端不再一个频道~,跨域了):

class AjaxjupyterHandler(HomeHandler):
    def get(self):
        temp_result = self.get_argument("temp_result", "")
        callbackfun = self.get_argument("callbackfun", "") #接受callback的名字callbackfun=jsonpCallback

        res = dict()
        res["status"] = 0
        res["info"] = "添加成功"
        res["temp_result"] = temp_result

        self.set_header("content-type", "application/json")
        data = json.dumps(res)
        self.write(''+callbackfun+'('+data+')')


2、版本two(简化版)

前端(与后端不再一个频道~,跨域了):

<script>
   window.onload=function () {
   $.ajax({
       url: 'http://127.0.0.1:9000/ajaxjupyter',
       //http://127.0.0.1:9000/ajaxjupyter?callback=一串随机数就在不用关心是什么,这个随机数是用来调用success:function(){}的&temp_result=temp_result
       type: 'get',
       dataType: 'jsonp',

       data: {
           temp_result:“12312312312”
       },
       success:function (data) {
           console.log(data)
       }
   });
}
</script>

后端python版本(与前端不再一个频道~,跨域了):

class AjaxjupyterHandler(HomeHandler):
    def get(self):
        temp_result = self.get_argument("temp_result", "")
        callback_test = self.get_argument("callback", "")
        # 前端没定义jsonp的值,是默认的jsonp=callback,这里接收的参数叫callback就行,其值赋给callback_test是一串随机数

        res = dict()
        res["status"] = 0
        res["info"] = "添加成功"
        res["temp_result"] = temp_result

        self.set_header("content-type", "application/json")
        data = json.dumps(res)
        self.write(''+callback_test+'(' + data + ')')

猜你喜欢

转载自blog.csdn.net/tcf_jingfeng/article/details/80066769
今日推荐