标签：服务 div jquery jquer cal ade call oca rgs
在 Javascript 中跨域访问是比较常见的事情，这次记录使用flask写后端API，前端ajax调用时产生的跨域问题。
问题描述：跨域资源引起CORB。
解决方案：
前端代码：
// 回掉函数，默认callback=jQuery30004159376653216822_1550582355513 function showData(data) { console.info("Get Into showData"); // json对象转成字符串 var result = JSON.stringify(data); $("#text").val(result); } // 调用 $(document).ready(function () { $("#btn").click(function () { $.ajax({ url: "http://localhost:8080/load/data", type: "GET", dataType: "jsonp", //指定服务器返回的数据类型 jsonpCallback: "showData", // 指定回调函数名称或直接使用回掉函数success jsonp: "callback", // 默认callback回调函数 success: function (data) { console.info("Get Into success"); // json对象转成字符串 // var result = JSON.stringify(data); // $("#text").val(result); } }); }); });
服务端代码：
def get_params():
result = { "code": 0, "info": "请求成功", "data": [], } if request.method == ‘GET‘: callback = request.args.get("callback") ...... resp = "%s%s%s%s" % (callback, ‘(‘, json.dumps(result), ‘)‘) //拼接结果为callback(json.dumps(result))
return resp
方案解读：Jsonp 的实现原理就是：创建一个回调函数，然后在远程服务上调用这个函数并且将 JSON 数据形式作为参数传递，完成回调。上述前端代码中，创建回调函数callback，在后端代码中，获取到函数名，然后返回给前端时，需要将原返回数据与回调函数拼接为上述格式，完成回调，此时前端即可拿到返回的数据，跨域问题完美解决！
标签：服务 div jquery jquer cal ade call oca rgs
原文地址：https://www.cnblogs.com/weisunblog/p/12690252.html
