构建一个集成了 Web 服务的可移植 Java 旅行应用程序(3)

look_w

步骤 6. 部署一个 Spring 应用程序MyVacations 通过 UserService 获取用户信息，并使用 UserService    在用户上次登录期间保存的值配置搜索。用户可以看到酒店清单作为搜索结果出现在地图上。同样在这个例子中，控制器并非配置在 xml 配置文件中，而是由    Spring 框架动态监测到，因为 servlet 配置文件中包含这条指令。

1	<context:component-scan base-package="com.myvacations.app" />

The first controller, HomeController, is called to display the                  login page.

1 2 3 4 5 6 7 8

/** * Simply selects the home view to render login page. */ @RequestMapping(value = "/", method = RequestMethod.GET) public String home(Locale locale, Model model) {           return "login"; }

HotelsController 在登录页面提交时激活。
此控制器通过一个带有 "username" 参数的 HTTP get 请求进行调用，访问 UserService                          以获取在此用户上次访问期间保存的所有用户偏好信息。
此控制器使用 RestTemplate 胡对 UserService 进行 RESTful 调用。RestTemplate 是一个 Spring                            帮助器类，用于客户端的 HTTP 访问。getForObject() 方法负责接收和返回该对象，而   负责将它转化为 HTTP 请求与 HTTP 响应。在我们的例子中，这个类用于调用                            RESTful 服务，比如 UserService。                                                                                    

1 2 3 4 5 6 7 8 9 10 11

@RequestMapping(value = "/hotels", method = RequestMethod.GET) public String getHotels(@ModelAttribute("username") String username,Model model) {               logger.debug("BEGIN HotelsController: username=" + username);     RestTemplate restTemplate = applicationContext.getBean("restTemplate",     RestTemplate.class);     user = (UserData) restTemplate.getForObject(new     URI("http://userservice.ng.Bluemix.net/userpref?username="+username),     UserData.class);

步骤                          7. 集成服务 您需要集成服务以将更多的数据带给 MyVacations。我将会提供两个集成服务的例子：

• Expedia RESTful 服务生成酒店的相关信息。
• Google 地图服务将酒店形象地显示在地图上。

让我们首先集成 Expedia Web 服务，以获取酒店的相关信息。首先必须在   上注册一个开发人员帐号和一个 API 密钥。
单击 Submit 按钮将激活 SearchController，它是 Hotels.jsp                            中的一个 Ajax 调用。

1 2 3 4 5 6

$.get('/search',   $("#ricerca").serialize(),   function (data, status) {     if (status == 'success') {                           if (data.toString()==""){             $("#map_canvas").hide();

在 SearchController 中调用了 ExpediaClient 来获取 HotelSummary                          List。

1 2 3

List<HotelSummary> response=null; response = (new ExpediaClient()).getHotels(         location, dateFrom, dateTo, numAdults, numChildren);

ExpediaClient 使用 UserService 获得的用户信息，提取出在 JSON 响应中解码的 ExpediaObjects。

1 2 3

ExpediaObjects hotels= (ExpediaObjects) restTemplate.getForObject(buildQueryHotelsURL(location,dal,al,numAdulti,numBambini), ExpediaObjects.class);

示例接着使用 Google 地图服务在地图上以可视化方式显示从 Expedia 获得的酒店列表。
Google Maps API 支持在 Web 页面上嵌入一幅 Google 地图图像。在开始之前，您需要 Google 提供的一个特殊 API  密钥。该密钥是免费的，但您必须创建一个 Google 帐号。

1 2	<script src="//maps.googleapis.com/maps/api/js? key=YOUR_API_KEY&sensor=TRUE_OR_FALSE"></script>

为了与 Google Maps API 进行交互，我选择使用 jQuery-ui-map。这是一个优秀的 jQuery 插件，用于在 Web  和移动应用程序中嵌入地图。它支持用户查看地图和标签，并利用踪迹的高级服务与管理、街景模式视图和 JSON 中地理数据的动态加载。
当创建另一个 div 或另一个类似的 HTML 容器时，便可运行 gmap（插件的关键方法，允许我们调用 Google    Maps API 的函数）在地图上显示标记引用的坐标。

1 2 3 4 5

var map =  $('#map_canvas').gmap({      'center': new google.maps.LatLng(data[0].latitude,data[0].longitude),      'minZoom': 5,      'zoom': 8          });

我们已经创建了一幅地图，它以第一家酒店的地理坐标为中心。
现在，我们为结果列表中的每家酒店都创建一个标记，并把它们放在地图上。

1 2 3 4 5 6

$.each(data, function (i, m) {    $('#map_canvas').gmap('addMarker', {       'position': new google.maps.LatLng(m.latitude,                       m.longitude),       'bounds': true    }) .click(function () {…

注册一个函数 on-click 事件，用于加载对酒店进行简要描述的信息窗口。

1 2 3

$('#map_canvas').gmap('openInfoWindow', {                                       'content': descr                                   },