(1)域名不同,即两个不同的应用。
(2)域名相同,但是端口不同,即同一个应用中的不同子系统。
(1)创建testjsonp.jsp页面
<%@ page language="java" contenttype="text/html; charset=utf-8" pageencoding="utf-8"%> <!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <script type="text/javascript" src="/js/jquery-1.6.4.js"></script> <title>insert title here</title> </head> <body> <textarea id="text" style="width: 1200px; height: 200px;"></textarea> <input type="button" value="测试异步跨越" onclick="testajax()" /> <script type="text/javascript"> function testajax(){ $.ajax({ url:"http://localhost:8081/category.json", type: "get", success: function (data) { $("#text").val(json.stringify(data)); } }); } </script> </body> </html>
测试发现,ajax跨越请求失败了。
在前面的测试中,我们发现ajax跨越请求时,json数据被浏览器禁用了。
原因:浏览器禁止远程加载json数据。(浏览器安全机制)
如何解决呢?
答:使用jsonp方式。
浏览器允许跨越加载同源数据。
即在javascript脚本中发送请求,就可以远程加载js格式数据。
(1)异步请求的时候,加上一个名为callback的回调函数
(2)在接口中,将返回的json格式数据,伪装成js脚本格式。
(3)得到js格式数据后,提取里面的json数据。
<script type="text/javascript"> function testajax(){ $.ajax({ url:"http://localhost:8081/category.json", type: "get", datatype: "jsonp", //jsonp请求 jsonp:"callbackfunction", //请求参数名 jsonpcallback:"showdata", //回调函数名称 success: function (data) { $("#text").val(json.stringify(data)); } }); } </script>
(1)jsonp是ajax技术中的一种异步请求方式。
(2)jsonp能实现跨越请求。
(3)jsonp跨越时,需要指定一个回调函数,并使用该函数将返回的数据伪装成js脚本。
(4)获取返回的js脚本后,jsonp自动提取其中的json数据。
如对本文有疑问, 点击进行留言回复!!
Java Class.forName()用法和newInstance()方法原理解析
网友评论