bboss mvc结合jsonp实现跨站跨域应用间通讯功能介绍

简介: 本文介绍bboss mvc结合jsonp实现跨站跨域应用间通讯功能的使用方法和实现机制,切入主题。 bboss最新版本下载: https://github.com/bbossgroups/bbossgroups-3.5 bboss mvc最新版本通过mvc json插件MappingJacksonHttpMessageConverter支持jsonp数据协议来实现跨站跨域应用之间的交互通讯,使用方法如下。
本文介绍bboss mvc结合jsonp实现跨站跨域应用间通讯功能的使用方法和实现机制,切入主题。
bboss最新版本下载:
https://github.com/bbossgroups/bbossgroups-3.5
bboss mvc最新版本通过mvc json插件MappingJacksonHttpMessageConverter支持jsonp数据协议来实现跨站跨域应用之间的交互通讯,使用方法如下。
1.服务器端实现
服务器端部署在实例工程:bestpractice\demoproject中,服务端程序为/demoproject/src/org/frameworkset/mvc/HelloWord.java

服务端控制器方法通过制定注解@ResponseBody的datatype属性为jsonp来指示mvc框架需要将响应值转换为jsonp函数+json参数数据的合法JavaScript脚本返回到客户端
以便实现跨站跨域请求交互,HelloWord.java提供了两个方法一个是应用于使用jquery的请求,一个应用于JavaScript标记请求
public @ResponseBody(datatype="jsonp") JsonpBean jsonpwithjquery()
	{
		JsonpBean jsonpbean = new JsonpBean();
		jsonpbean.setPrice("91.42");
		jsonpbean.setSymbol("IBM jquery jsonp");
		return jsonpbean;

	}
	public @ResponseBody(datatype="jsonp") JsonpBean jsonp()
	{
		JsonpBean jsonpbean = new JsonpBean();
		jsonpbean.setPrice("91.42");
		jsonpbean.setSymbol("IBM");
		return jsonpbean;
	}

分别对应请求地址为:
http://localhost:8081/demoproject/examples/jsonpwithjquery.page
http://localhost:8081/demoproject/examples/jsonp.page
2.客户端实现
客户端应用和服务器应用属于两个不同站点或者不同域名,
客户端部署在bboss-mvc的web应用中,对应的访问地址为:
http://localhost:8081/bboss-mvc/jsp/jsonp/testjsonp.jsp
testjsonp.jsp相关的代码如下:
<!-- 普通的jsonp调用示例开始,定义跨域回调函数 -->
	<script type="text/javascript">
        	function jsonpCallback(result)
        	{
				alert("aaa:" + result.symbol);//弹出跨站 请求返回的json数据对象的symbol属性的值
        	}
    	</script>
    <!-- 普通的jsonp调用示例,向另一个应用demoproject发起mvc请求,并指参数callback(参数名字可任意指定)指定回调函数jsonpCallback-->
	<script type="text/javascript" src="http://localhost:8081/demoproject/examples/jsonp.page?jsonp_callback=jsonpCallback"></script>
	<!-- 普通的jsonp调用示例结束-->
	
	<!-- 采用jquery实现jsonp调用示例开始-->
	<script src="<%=request.getContextPath() %>/include/jquery-1.4.2.min.js" type="text/javascript"></script>   
	<!-- 采用jquery实现jsonp调用示例--> 
	<script type="text/javascript">
        $(function() {
            $.getJSON("http://localhost:8081/demoproject/examples/jsonpwithjquery.page?jsonp_callback=?", function(data) {
            	alert("bbb:" + data.symbol);//弹出跨站 请求返回的json数据对象的symbol属性的值
            });
            //jsonp1337140657188({"postalcodes":[{"adminName2":"Westchester","adminCode2":"119","postalcode":"10504","adminCode1":"NY","countryCode":"US","lng":-73.700942,"placeName":"Armonk","lat":41.136002,"adminName1":"New York"}]});
            $.getJSON("http://www.geonames.org/postalCodeLookupJSON?postalcode=10504&country=US&callback=?", function(data) {
            	alert( data.postalcodes[0].adminName2);//这是一个互联网跨域调用的实例,确保能够上网,弹出跨站 请求返回的json数据对象数组属性的第一个元素的属性adminName2的值
            }); 
        });        
    </script>
	<!-- 采用jquery实现jsonp调用示例结束-->


bboss mvc对jsonp提供了默认的支持,服务端json数据请求分别带了参数jsonp_callback
http://localhost:8081/demoproject/examples/jsonpwithjquery.page?jsonp_callback=?
jsonpCallback=?,是因为使用了jquery的$.getJSON方法来发起该请求,回调函数是个匿名函数,jquery框架会为该匿名函数产生一个随机函数名称,然后将?替换为实际的函数名称
提交给服务器端
http://localhost:8081/demoproject/examples/jsonp.page?jsonp_callback=jsonpCallback
jsonp_callback=jsonpCallback,可以看出我们已经直接指定了回调函数的名称,就是之前定义的实名函数jsonpCallback()

需要说明的是,回调函数对应的参数名称jsonp_callback是MappingJacksonHttpMessageConverter内置的默认的回调函数参数名称,
我们可以全局地改变这个参数的名称,在bboss-mvc.xml文件中在MappingJacksonHttpMessageConverter插件上修改f:jsonpCallback属性的值即可:
<property class="org.frameworkset.http.converter.json.MappingJacksonHttpMessageConverter"
					f:jsonpCallback="jsonp_callback"/>



3.执行实例
我们只需要将bboss-mvc下的WebRoot和bestpractice\demoproject\WebRoot对应的应用部署到tomcat并启动tomcat,然后在浏览器中输入
http://localhost:8081/bboss-mvc/jsp/jsonp/testjsonp.jsp
既可以看到实际的效果
目录
相关文章
|
6月前
|
前端开发 Java 测试技术
Java一分钟之Spring MVC:构建Web应用
【5月更文挑战第15天】Spring MVC是Spring框架的Web应用模块,基于MVC模式实现业务、数据和UI解耦。常见问题包括:配置DispatcherServlet、Controller映射错误、视图解析未设置、Model数据传递遗漏、异常处理未配置、依赖注入缺失和忽视单元测试。解决这些问题可提升代码质量和应用性能。注意配置`web.xml`、`@RequestMapping`、`ViewResolver`、`Model`、`@ExceptionHandler`、`@Autowired`,并编写测试用例。
339 3
|
2月前
|
设计模式 开发框架 前端开发
MVC 模式在 C# 中的应用
MVC(Model-View-Controller)模式是广泛应用于Web应用程序开发的设计模式,将应用分为模型(存储数据及逻辑)、视图(展示数据给用户)和控制器(处理用户输入并控制模型与视图交互)三部分,有助于管理复杂应用并提高代码可读性和维护性。在C#中,ASP.NET MVC框架常用于构建基于MVC模式的Web应用,通过定义模型、控制器和视图,实现结构清晰且易维护的应用程序。
52 2
|
1月前
|
前端开发 Java
【案例+源码】详解MVC框架模式及其应用
【案例+源码】详解MVC框架模式及其应用
60 0
|
3月前
|
供应链 前端开发 Java
服装库存管理系统 Mybatis+Layui+MVC+JSP【完整功能介绍+实现详情+源码】
该博客文章介绍了一个使用Mybatis、Layui、MVC和JSP技术栈开发的服装库存管理系统,包括注册登录、权限管理、用户和货号管理、库存管理等功能,并提供了源码下载链接。
服装库存管理系统 Mybatis+Layui+MVC+JSP【完整功能介绍+实现详情+源码】
|
3月前
|
存储 前端开发 数据库
神秘编程世界惊现强大架构!Web2py 的 MVC 究竟隐藏着怎样的神奇魔力?带你探索实际应用之谜!
【8月更文挑战第31天】在现代 Web 开发中,MVC(Model-View-Controller)架构被广泛应用,将应用程序分为模型、视图和控制器三个部分,有助于提高代码的可维护性、可扩展性和可测试性。Web2py 是一个采用 MVC 架构的 Python Web 框架,其中模型处理数据和业务逻辑,视图负责呈现数据给用户,控制器则协调模型和视图之间的交互。
40 0
|
5月前
|
JSON 前端开发 Java
Spring第四课,MVC终章,应用分层的好处,总结
Spring第四课,MVC终章,应用分层的好处,总结
|
5月前
|
前端开发 Java Maven
如何在Spring MVC中实现图片的上传和下载功能
如何在Spring MVC中实现图片的上传和下载功能
|
6月前
|
前端开发 JavaScript 开发者
深入理解MVC和MVVM:构建现代Web应用的利器
深入理解MVC和MVVM:构建现代Web应用的利器
|
5月前
|
前端开发 测试技术 API
探索安卓应用的架构演进:从MVC到MVVM
本篇文章将深入探讨安卓应用开发中的架构演进,特别关注从传统的MVC(Model-View-Controller)到现代流行的MVVM(Model-View-ViewModel)架构的转变。通过对比两种架构的设计理念、实现方式和实际应用案例,解析MVVM在提高代码可维护性和可测试性方面的优势。
66 0
|
6月前
|
设计模式 存储 前端开发
Java的mvc设计模式在web开发中应用
Java的mvc设计模式在web开发中应用