还真的有. 在jsp文件中常常通过通过<script>标签引入一段js代码, 这段代码凡是来历于网络, 也就是差异源. 那么我们不妨通过<srcipt>标签完成Ajax请求, 这样便顺带办理了跨域问题.
下面照旧沿用上面的案例举办演示.
我们对发送ajax的jsp举办修改
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>Title</title> <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"></script> <script> function doCallBack(data){ var str = JSON.stringify(data); alert(str); } </script> </head> <body> <script src="http://localhost:7070/order/loadOrderList3?uid=111&callBack=doCallBack"></script> </body> </html>
上面的代码中, 我们首先界说了doCallBack()函数, 它吸收一个字符串参数, 而且会把吸收到的字符串显示出来.
然后在<body>标签中编写<script>标签, 我们将通过<script>标签请求订单系统, 订单系统将会返回一段js代码, 这段js代码会挪用doCallBack()要领.
为了可以或许拼接出doCallBack(字符串参数...)js代码, 我们在订单系统中作如下操纵.
@RequestMapping("/loadOrderList3") @ResponseBody public String loadOrderList3(String uid, String callBack){ //模仿订单数据 Order o1 = new Order(); o1.setId("111"); o1.setTotal(333.33); o1.setDate("2019-4-29"); Order o2 = new Order(); o2.setId("222"); o2.setTotal(444.44); o2.setDate("2019-5-29"); Order o3 = new Order(); o3.setId("333"); o3.setTotal(555.55); o3.setDate("2019-6-29"); List<Order> list = new ArrayList<>(); list.add(o1); list.add(o2); list.add(o3); //拼接js代码 String result = callBack + "(" + JSON.toJSONString(list) + ")"; return result; }
这个想法是不是很妙? 大白这个道理之后, 我们可以利用jQuery利便举办JSONP操纵, 在上面的代码中我们工钱指定了一个名为doCallBack的函数, 而jQuery会随机用时间戳生成一个函数名, 道理和上面是一样的.
所以完成一开时点击超链接发送Ajax请求只需要如下几步.
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>Title</title> <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"></script> <script> function sendAjax(){ $.getJSON("http://localhost:7070/order/loadOrderList3?callBack=?","uid=111", function (data) { var str = JSON.stringify(data); alert(str); }); } </script> </head> <body> <a href="javascript:sendAjax()">sendAjax</a> </body> </html>
小结
上面两种办理步伐在思路上有着本质的差异. 方案一抓住CORS跨域会见问题的本质, 在后端加上响应头办理跨域问题. 方案二JSONP操作的是<script>标签可以或许跨域获取js代码的特性, 绕过跨域问题.