Làm chủ Grails: Các dịch vụ Grails và bản đồ Google pps

Làm chủ Grails: Các dịch vụ Grails và bản đồ Google Hòa trộn công nghệ bên ngoài vào trong một ứng dụng Grails Scott Davis , Tổng Biên tập, AboutGroovy.com Tóm tắt: Scott Davis cho bạn

Làm chủ Grails: Các dịch vụ Grails và bản đồ Google

Hòa trộn công nghệ bên ngoài vào trong một ứng dụng Grails

Scott Davis , Tổng Biên tập, AboutGroovy.com

Tóm tắt: Scott Davis cho bạn biết làm cách nào bạn có thể nhúng các bản đồ vào

một ứng dụng Grails sử dụng những dịch vụ Web và APIs sẵn có miễn phí trong

bộ cài đặt mới nhất này của Làm chủ Grails Ông sử dụng ứng dụng mẫu lập kế

hoạch-chuyến đi từ những cài đặt trước và đưa nó tới mức tiếp theo bằng mã địa lí, Các bản đồ Google, và những dịch vụ Grails

Tôi đã xây dựng một ứng dụng lập kế hoạch-chuyến đi từ bài viết đầu tiên trong loạt bài này Giờ khung làm việc Người điều khiển-Khung nhìn-Mô hình (Model-View-Controller (MVC)) cơ bản đó đang ở đây, ta sẵn sàng để hòa trộn với những

kĩ thuật bên ngoài Cụ thể, ta sẽ thêm một bản đồ Tôi có thể nói, "Tôi đang đặt một chuyến đi từ Denver tới Raleigh, với những điểm dừng ở San Jose và Seattle dọc đường đi," nhưng một bản đồ sẽ giúp mô tả chuyến đi tốt hơn Bạn có thể biết rằng Seattle và Raleigh ở những phía đối diện nhau của nước Mỹ, nhưng một bản

đồ giúp bạn hình dung khoảng cách giữa hai thành phố này

Cho bạn một ý tưởng ban đầu về ứng dụng gì sẽ làm ở phần cuối của bài viết này, hãy vào trang http://maps.google.com và nhập mã IATA DEN trong hộp tìm kiếm Bạn nên kết thúc ở Sân bay Quốc tế Denver, như được biểu diễn trong Hình 1 (Biết thêm về những mã IATA, xem bài viết của tháng trước.)

Hình 1 Sân bay Denver, nhờ Các bản đồ của Google

Bên cạnh việc hiển thị các sân bay của Mỹ bạn tạo một bảng HTML, lập kế chuyến đi cũng sẽ vẽ được các sân bay trên một bản đồ Tôi sẽ sử dụng API Các bản đồ Google miễn phí trong bài viết này Bạn có thể sử dụng API Các bản đồ Yahoo! miễn phí hoặc bất kỳ cái nào khác (xem Tài nguyên) Một khi bạn hiểu những điều cơ bản về bản đồ Web trực tuyến, bạn sẽ hiểu rằng các API khác nhau

hoạch-có thể hoán đổi cho nhau một cách hợp lí Trước khi bạn hoạch-có thể ánh xạ một phần của giải pháp, bạn cần hiểu làm thế nào để một chuỗi ba kí tự đơn giản như DEN biến đổi thành một điểm trên bản đồ

Mã địa lí

Khi bạn nhập DEN vào Các bản đồ Google, ứng dụng thực hiện một phép biến đổi nhỏ đằng sau Bạn có thể nghĩ tới những địa phương về mặt địa chỉ đường phố như Đường 123 Main, nhưng các bản đồ Google cần một điểm vĩ độ/kinh độ để hiển thị nó trên bản đồ Hơn nữa bắt buộc bạn cung cấp điểm vĩ độ/kinh độ của mình, nó dịch các địa chỉ người dùng có thể đọc được vào những vĩ độ/kinh độ

thay cho bạn Phép biến đổi này được gọi là mã địa lí (geocoding) (xem Tài

nguyên)

Về bài viết này

Grails là một khung làm việc phát triển Web hiện đại mà hòa trộn với các kỹ thuật Java™ quen thuộc như Spring và Hibernate với các thực hành đương thời như quy ước qua cấu hình Ghi vào Groovy, Grails cho bạn sự tích hợp liền một mạch với

mã Java của bạn trong khi việc thêm một cách mềm dẻo và linh động của một ngôn ngữ tập lệnh Sau khi bạn học Grails, bạn sẽ không bao giờ nhìn việc phát triển Web lại theo cách tương tự

Một phép biến đổi tương tự xảy ra khi bạn lướt Web Về kỹ thuật, cách duy nhất

để liên lạc với một máy chủ Web từ xa là địa chỉ IP của máy chủ cung cấp May thay, bạn không cần nhập địa chỉ IP của mình Bạn nhập một URL thân thiện vào trình duyệt Web của bạn, và nó thực hiện việc gọi máy chủ Hệ thống Tên Miền (Domain Name System (DNS)) Máy chủ DNS đổi URL thành địa chỉ IP tương ứng, và trình duyệt thực hiện kết nối HTTP tới máy chủ từ xa Tất cả điều này là trong suốt với người dùng DNS thực hiện Web vô cùng dễ dàng để sử dụng Những trình sinh mã địa lí (geocoder) thực hiện việc tương tự cho các ứng dụng bản đồ dựa trên Web

Tìm kiếm Web nhanh trên trình sinh mã địa kí miễn phí mang lại một số khả năng

phù hợp với nhu cầu mã hóa địa lí của những người lập kế hoạch chuyến đi Cả Google và Yahoo! cung cấp các dịch vụ mã địa lý như một phần tiêu chuẩn của

các API của họ, nhưng với ứng dụng này, tôi sẽ sử dụng dịch vụ mã địa lý miễn phí được cung cấp trên geonames.org (xem Tài nguyên) RESTful API của nó cho phép tôi chỉ ra rằng tôi đang cung cấp một mã IATA thay vì một giới hạn tìm kiếm-văn bản chung chung Tôi không có gì chống lại các cư dân của Ord, Ned., nhưng tôi quan tâm nhất là Sân bay Quốc tế Chicago O'Hare

Nhập URL

http://ws.geonames.org/search?name_equals=den&fcode=airp&style=full vào trình duyệt Web của bạn Bạn nên xem XML trả về được trình bày trong Ví dụ 1:

Ví dụ 1 XML trả về từ yêu cầu mã địa lý

</geonames>

Tham số name_equals trong URL bạn nhập vào là mã IATA cho sân bay Nó chỉ

là một phần của URL mà cần bị thay đổi cho mỗi truy vấn fcode=airp chỉ ra rằng

mã đặc trưng bạn đang tìm kiếm là một sân bay Tham số style — short, medium, long, hoặc full — chỉ rõ tính đầy đủ của câu trả lời XML

Giờ đây bạn có một trình sinh mã địa lý, bước tiếp theo là tích hợp nó vào ứng

dụng Grails của bạn Để làm được như vậy, bạn cần một dịch vụ

Những dịch vụ Grails

Bằng điểm này trong loạt bài Làm chủ Grails, bạn có một ý tưởng hay về các phân

lớp miền, các kiểm soát, và các Trang Máy chủ Groovy (GSP) tất cả làm việc với nhau trong một kiểu tổ hợp như thế nào Chúng làm cho các thao tác cơ bản

Tạo/Truy lục/Cập nhật/Xóa (Create/Retrieve/Update/Delete (CRUD)) dễ dàng trên một kiểu dữ liệu đơn Dịch vụ mã địa lý này vượt một chút ra ngoài phạm vi của các phép biến đổi Ánh xạ Quan hệ Đối tượng Grails (Grails Object Relational Mapping (GORM)) từ các bản ghi cơ sở dữ liệu quan hệ tới POGOs (các đối tượng Groovy cũ đơn giản) Ngoài ra, dịch vụ sẽ có thể được sử dụng bởi nhiều hơn một phương thức Cả save và update sẽ cần mã địa lý mã IATA, như bạn sẽ thấy ở một thời điểm Grails cung cấp cho bạn một nơi để lưu trữ các phương thức được sử dụng phổ biến mà vượt qua bất kỳ lớp miền đơn: các dịch vụ

Để tạo một dịch vụ Grails, gõ grails create-service Geocoder ở dòng lệnh Xem grails-app/services/GeocoderService.groovy, được trình bày ở Ví dụ 2, trong một

bộ soạn thảo văn bản:

Ví dụ 2 Một dịch vụ Grails nhiều nhánh-ra

serviceMethod tên là một trình giữ chỗ mà có thể được thay đổi thành cái gì đó hơn là mô tả (Các dịch vụ có thể chứa nhiều phương thức như bạn muốn.) Trong

Ví dụ 3, tôi thay đổi tên thành geocodeAirport:

Ví dụ 3 Phương thức dịch vụ trình sinh mã địa lý geocodeAirport()

class GeocoderService {

boolean transactional = false

// http://ws.geonames.org/search?name_equals=den&fcode=airp&style=full def geocodeAirport(String iata) {

def base = "http://ws.geonames.org/search?"

def qs = []

qs << "name_equals=" + URLEncoder.encode(iata)

qs << "fcode=airp"

qs << "style=full"

def url = new URL(base + qs.join("&"))

def connection = url.openConnection()

def result = [:]

if(connection.responseCode == 200){

def xml = connection.content.text

def geonames = new XmlSlurper().parseText(xml)

result.name = geonames.geoname.name as String

result.lat = geonames.geoname.lat as String

result.lng = geonames.geoname.lng as String

result.state = geonames.geoname.adminCode1 as String result.country = geonames.geoname.countryCode as String }

else{

log.error("GeocoderService.geocodeAirport FAILED") log.error(url)

log.error(connection.responseCode)

log.error(connection.responseMessage)

}

Các dịch vụ Groovy không thể truy cập một cách trực tiếp từ một URL Nếu bạn muốn kiểm tra phương thức dịch vụ mới này trong trình duyệt Web của bạn, thêm một bao đóng đơn giản cho AirportController, như được trình bày trong Ví dụ 4:

Ví dụ 4 Cung cấp một URL cho một dịch vụ trong một bộ điều khiển

import grails.converters.*

class AirportController {

def geocoderService

def scaffold = Airport

def geocode = {

def result = geocoderService.geocodeAirport(params.iata)

render result as JSON

Để kiểm tra dịch vụ, nhập URL

http://localhost:9090/trip/airport/geocode?iata=den trong trình duyệt Web của bạn Bạn nên xem kết quả được thể hiện trong Ví dụ 5:

Ví dụ 5 Các kết quả của yêu cầu trình sinh mã địa lý

ưu điểm của dịch vụ mã địa lý mới này

class Airport{

static constraints = { name()

iata(maxSize:3) city()

state(maxSize:2) country()

Khi tạo một Airport mới, tôi sẽ giới hạn các trường người dùng-có thể soạn thảo là iata và city Trường iata là cần thiết cho truy vấn mã địa lý làm việc Tôi để city ở đây bởi vì tôi muốn cung cấp thông tin đó cho bản thân DEN thực sự là ở Denver, nhưng ORD (Chicago O'Hare) thì ở Rosemont, Ill., và CVG (Cincinnati, sân bay Ohio) là ở Florence, Ky Để hai trường này trong create.gsp và xóa phần còn lại,

do đó bây giờ create.gsp giống như Ví dụ 7:

Ví dụ 7 Thay đổi create.gsp

<g:form action="save" method="post" >

Hình 2 Tạo biểu mẫu Airport

Biểu mẫu này được đưa tới bao đóng save trong AirportController Thêm đoạn mã trong Ví dụ 8 vào bộ điều khiển để thực hiện gọi tới geocodeAirport trước khi Airport mới được lưu lại:

Ví dụ 8 Thay đổi bao đóng save

def save = {

def results = geocoderService.geocodeAirport(params.iata)

def airport = new Airport(params + results)

if(!airport.hasErrors() && airport.save()) {

flash.message = "Airport ${airport.id} created"

Số lượng lớn phương thức là giống hệt những gì bạn thấy nếu bạn gõ grails

generate-controller Airport ở dấu nhắc lệnh Sự khác biệt duy nhất với bao đóng được sinh ra mặc định là hai dòng đầu tiên Dòng thứ nhất có HashMap từ dịch vụ trình sinh mã địa lý Dòng thứ hai kết hợp results HashMap với params HashMap (Vâng, việc hòa nhập hai HashMaps trong Groovy đơn giản như việc thêm chúng với nhau.)

Nếu lưu trữ cơ sở dữ liệu hoàn thành, bạn được gửi một lần nữa tới hành động chỉ dẫn, không có thay đổi nào được yêu cầu cho show.gsp, như được trình bày trong Hình 3:

Hình 3 Thể hiện biểu mẫu Airport

Để hỗ trợ việc soạn thảo một Airport, để lại các trường iata và city trong edit.gsp Bạn có thể sao chép và dán phần còn lại của các trường từ show.gsp để thực hiện chúng chỉ đọc (Hoặc nếu bạn đã đặt "sao chép và dán là hình thức thấp nhất của lập trình hướng đối tượng" từ bài viết trước đó, bạn có thể giải nén các trường phổ biến vào một mẫu riêng và hoàn trả nó trên cả show.gsp và edit.gsp.) Ví dụ 9 trình bày thay đổi edit.gsp:

Ví dụ 9 Thay đổi edit.gsp

<td valign="top" class="value">${airport.state}</td> </tr>

<tr class="prop">

<td valign="top" class="name">Country:</td>

<td valign="top" class="value">${airport.country}</td> </tr>

<tr class="prop">

<td valign="top" class="name">Lat:</td>

<td valign="top" class="value">${airport.lat}</td> </tr>

<tr class="prop">

<td valign="top" class="name">Lng:</td>

<td valign="top" class="value">${airport.lng}</td> </tr>

</tbody>

</table>

</div>

Hình 4 Biểu mẫu soạn thảo Airport

Nhấn chuột vào nút Update gửi các giá trị biểu mẫu tới bao đóng update Thêm

dịch vụ gọi và bản đồ băm trộn vào mã mặc định, như được trình bày trong Ví dụ 10:

Ví dụ 10 Thay đổi bao đóng update

def update = {

def airport = Airport.get( params.id )

if(airport) {

def results = geocoderService.geocodeAirport(params.iata) airport.properties = params + results

if(!airport.hasErrors() && airport.save()) {

flash.message = "Airport ${params.id} updated"

Tại thời điểm này, bạn đã tích hợp hoàn toàn mã địa lí vào ứng dụng của bạn cũng giống như Các bản đồ Google Mất một chút thời gian để xem xét toàn bộ các vị trí trên ứng dụng của bạn mà bạn đang thu nhận các địa chỉ — các khách hàng, các nhân viên, các văn phòng từ xa, kho hàng, các địa phương bán lẻ, v.v Bằng việc thêm một cặp các trường để lưu trữ vĩ độ/kinh độ và trộn vào dịch vụ mã địa lí, bạn đang thiết lập cho bản thân mình những bản đồ dễ dàng để hiển thị các đối tượng — đó chính là những gì tôi sẽ làm tiếp theo

Các bản đồ Google

Hầu hết mọi người đồng ý rằng Các bản đồ Google thiết lập chuẩn giúp dễ sử dụng hơn khi nó thành bản đồ Web Một vài người nhận ra rằng việc dễ dùng này

mở rộng cho việc nhúng một bản đồ Google vào trang Web của riêng bạn Đưa tọa

độ vĩ độ/kinh độ cho các điểm dữ liệu là phần bài tập khó nhất, và chúng ta sẵn sàng giải quyết vấn đề đó

Để nhúng một Bản đồ Google vào ứng dụng Grails của bạn, điều trước tiên bạn cần làm là có một khóa API miễn phí Trang đăng kí chi tiết các điều khoản sử dụng Về cơ bản, Google cung cấp API cho bạn miễn phí với điều kiện ứng dụng của bạn cũng là miễn phí Điều này có nghĩa là bạn không thể bảo vệ ứng dụng Các bản đồ Google của bạn bằng mật khẩu, tính phí cho việc truy cập vào nó, hoặc

lưu trữ nó đằng sau tường lửa (Shameless plug: My book GIS for Web Developers

cho bạn tập các hướng dẫn từng bước cho việc xây dựng một ứng dụng giống Bản

đồ Google sử dụng dữ liệu miễn phí và phần mềm nguồn mở; xem Tài nguyên Điều này giải phóng bạn khỏi những hạn chế Google đặt trên API của bạn)

Khóa API được gắn với một URL và thư mục cụ thể Gõ http://localhost:9090/trip

trên biểu mẫu và nhấn nút Generate API Key Trang xác nhận cho thấy khóa API

được sinh ra của bạn, nó liên quan đến URL, và một trang Web mẫu, như họ nói,

"để bạn bắt đầu trên con đường lập bản đồ"

Để kết hợp trang mẫu này vào ứng dụng Grails của bạn, tạo một tập tin có tên map.gsp trong thư mục grails-app/views/airport Sao chép trang mẫu từ Google vào map.gsp Ví dụ 11 cho thấy các nội dung của map.gsp:

Ví dụ 11 Một trang Web Bản đồ Google đơn giản

<meta http-equiv="content-type" content="text/html; charset=utf-8"/>

<title>Google Maps JavaScript API Example</title>

<script

src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABCDE" type="text/javascript"></script>

<body onload="load()" onunload="GUnload()">

<div id="map" style="width: 500px; height: 300px"></div>

</body>

</html>

Chú ý rằng khóa API của bạn được nhúng vào tập lệnh URL ở đầu trang Trong phương thức load, bạn đang thể hiện một đối tượng GMap2 mới Đây là bản đồ

mà xuất hiện ở <div /> với ID của map ở cuối của trang Nếu bạn muốn bản đồ lớn hơn, điều chỉnh độ rộng và chiều cao trong thuộc tính style của Cascading Style Sheets (CSS) Hiện nay bản đồ được tập trung vào Palo Alto, Calif ở mức độ phóng 13 (Mức 0 là mức thu nhỏ tất cả các trường hợp Khi các số tăng lên, bạn có khung nhìn các đường phố rõ hơn) Bạn sẽ điều chỉnh các giá trị này chỉ trong một thời điểm Trong khi chờ đợi, thêm một bao đóng map rỗng vào AirlineController, như được trình bày ở Ví dụ 12:

Ví dụ 12 Thêm bao đóng map