LUẬN VĂN:CROSS-DOMAIN AJAX CHO CÁC ỨNG DỤNG WEB MASHUP potx

Và khóa luận ‘Cross-domain Ajax cho các ứng dụng mashup’ trình bày những nghiên cứu tổng thể về mashup và cross-domain ajax, những cách thức để thực hiện cross-domain trong ajax.. Tiếp

KHOÁ LUẬN TỐT NGHIỆP ĐẠI HỌC HỆ CHÍNH QUY

Ngành: Công nghệ thông tin

ĐẠI HỌC QUỐC GIA HÀ NỘI TRƯỜNG ĐẠI HỌC CÔNG NGHỆ

Nguyễn Thị Hương

CROSS-DOMAIN AJAX CHO CÁC ỨNG DỤNG

WEB MASHUP

KHOÁ LUẬN TỐT NGHIỆP ĐẠI HỌC HỆ CHÍNH QUY

Ngành: Công nghệ thông tin

Cán bộ hướng dẫn: TS Nguyễn Hải Châu

HÀ NỘI - 2009

LỜI CẢM ƠN

Trong thời gian nghiên cứu và làm khóa luận, tôi xin chân thành cảm ơn đặc biệt đến thầy giáo hướng dẫn Nguyễn Hải Châu, người đã giúp tôi lựa chọn đề tài, hướng dẫn tìm tài liệu và đưa ra những nhận xét quan trọng giúp tôi hoàn thành tốt đề tài khóa luận tốt nghiệp Bên cạnh đó, tôi xin chân thành cảm ơn các thầy cô giáo trong khoa Công Nghệ Thông Tin – trường Đại học Công Nghệ - ĐHQGHN đã giảng dạy và trang bị cho tôi những kiến thức cơ bản trong học tập nghiên cứu khoá luận cũng như trong công việc sau này

Những lời động viên, khích lệ từ gia đình, sự chia sẻ, học hỏi từ bạn bè cũng là

đã góp phần rất nhiều cho khóa luận tốt nghiệp của tôi đạt kết quả tốt hơn

Do trình độ hạn chế nên trong quá trình làm khóa luận khó tránh khỏi những thiếu sót, tôi rất mong sự chỉ bảo thêm của thầy cô giúp tôi hoàn thành và đạt kết quả tốt hơn

Tôi xin chân thành cảm ơn !

Hà Nội, ngày 24 tháng 5 năm 2009

Nguyễn Thị Hương

TÓM TẮT KHÓA LUẬN TỐT NGHIỆP

Ngày nay, mashup ngày càng trở nên thịnh hành theo trào lưu Web 2.0 Mashup cho phép mọi người thể hiện khả năng sáng tạo bất tận bằng cách ‘nối’ hai hay nhiều ứng dụng web lại với nhau Và nếu có chính sách kiểm soát thích hợp, mashup có thể tạo nên một lớp ứng dụng mới hiệu quả và hữu ích trong rất nhiều môi trường Để mashup dữ liệu từ nhiều nguồn khác nhau đó, chúng ta phải thực hiện cross-domain Ajax Nhưng để cross-domain được, không phải là việc dễ vì yêu cầu bảo mật dữ liệu

và yêu cầu trang web đạt được những tính năng đầy đủ phải được hài hòa

Hiện có một số phương pháp cho việc cross-domain Và khóa luận

‘Cross-domain Ajax cho các ứng dụng mashup’ trình bày những nghiên cứu tổng thể về

mashup và cross-domain ajax, những cách thức để thực hiện cross-domain trong ajax Tiếp đó là việc nghiên cứu về hoạt động và lập trình Google Maps API để có cơ sở xây dựng một ứng dụng thử nghiệm với cross-domain cho mashup

MỤC LỤC DANH MỤC CÁC SƠ ĐỒ

THUẬT NGỮ VÀ CÁC CHỮ VIẾT TẮT

LỜI MỞ ĐẦU

CHƯƠNG I CROSS-DOMAIN AJAX VÀ ỨNG DỤNG ĐỂ XÂY DỰNG WEB

MASHUP 1

1.1 Giới thiệu chung về Cross-Domain Ajax 2

1.1.1 AJAX 2

1.1.2 XMLHttpRequest 2

1.1.1 Chính sách Same-Origin 3

1.1.3 Thẻ <script> 4

1.1.4 Gadget Aggregator 4

1.2 Giới thiệu về Mashup 4

1.3 Một số ứng dụng để xây dựng Web Mahup 7

1.3.1 Sử dụng Google Maps API 8

1.3.2 Sử dụng Amazon Web Services và Google Search APIs 9

1.3.3 Sử dụng Flickr API 11

1.3.4 Sử dụng ebay API 12

CHƯƠNG II CROSS-DOMAIN AJAX VÀ 14

CÁC GIẢI PHÁP THỰC HIỆN TRONG AJAX 14

2.1 Cross domain proxy 14

2.2 Cross domain JSON 15

2.2.1 JSONRequest.post 16

2.2.2 JSONRequest.get 17

2.2.3 JSONRequest.cancel 17

2.2.4 Bảo mật 17

2.2.5 Hoạt động của JSON 18

2.3 Cross domain sử dụng Flash 19

2.4 Subspace 20

2.4.1 Subdomain 22

2.4.2 Đơn Web Service 22

2.4.3 Đa Web Service 23

2.5 Giải pháp trong thế hệ tiếp theo 24

2.5.1 FlashXMLHttpRequest 24

2.5.2 ContextAgnosticXMLHttpRequest 24

CHƯƠNG III XÂY DỰNG ỨNG DỤNG THỬ NGHIỆM CROSS-DOMAIN AJAX 26

3.1 Giới thiệu về Google Maps 26

3.2 Giới thiệu về Google Maps API 26

3.2.1 Maps API Basics 27

3.2.2 Maps API Events 29

3.2.3 Maps API Controls 30

3.2.4 Map Overlays 31

3.2.5 Google Maps API Services 33

KẾT LUẬN 34 TÀI LIỆU THAM KHẢO

DANH MỤC CÁC SƠ ĐỒ

Hình 1 XmlHttpRequest với Ajax 3

Hình 2 Mashup nội dung từ nhiều nguồn .5

Hình 3 Dữ liệu tương tác hiển thị với Ajax 5

Hình 4 Khác nhau giữa ba website – Amazon, Google, eBay 6

Hình 5 Mashup làm việc 6

Hình 6 Tạo một mashup 7

Hình 7 Ứng dụng cho mashup 7

Hình 8 Đăng nhập Google Maps API key 8

Hình 9 Đăng nhập cho tài khoản Amazon Associates 9

Hình 10 Đăng nhập cho tài khoản AWS 10

Hình 11 Google Search API 10

Hình 12 Đăng nhập cho tài khoản Flickr API 11

Hình 13 Flickr photos search 12

Hình 14 Đăng nhập cho tài khoản Flickr API 12

Hình 15 Cross-domain Proxy 14

Hình 16 Hạn chế của cross domain XMLHttpRequest 15

Hình 17 Của cross domain JSON 16

Hình 18 Hoạt động của JSON 18

Hình 19 Lỗi 2044 19

Hình 20 Gọi ra dữ liệu từ domain đơn unstrusted 3rd-party .22

Hình 21 Kết nối đa web service 23

Hình 22 Mashup và các ứng dụng 26

Hình 23 Google Maps API 27

Hình 24 map_api_basic.html 27

Hình 25 map_api_event.html 29

Hình 26 map_api_overlay.html 32

Hình 27 map_api_polyline.html 33

Hình 28 map_api_geocoding.html 33

THUẬT NGỮ VÀ CÁC CHỮ VIẾT TẮT

AJAX Asynchronous JavaScript and XML

API Application Programming Interface

CSS Cascading Style Sheets

DOM Document Object Model

JSON JavaScript Object Noattion

HTML Hypertext Markup Languages

REST Representational state transfer

RSS Really Simply Syndication

SOAP Simple Object Access Protocol

XHTML Extensible HyperText Markup Language

XML Extensible Markup Language

XSLT Extensible Stylesheet Language Transformations

URL Uniform Resource Locator

LỜI MỞ ĐẦU

Vài năm trở lại đây, ngày càng nhiều công ty phát hành những chương trình cho phép kết hợp dữ liệu và dịch vụ trên web của các doanh nghiệp với nhau, đồng thời cũng phát triển hài hòa giữa bảo mật và các yêu cầu của khách hàng Chúng được trộn

lẫn (mashup) một cách thông minh và sáng tạo Nhưng có một vấn đề về bảo mật được

đưa ra khi bạn chuyển dữ liệu giữa các domain Với các hạn chế cross-domain, được xây dựng trên hầu hết các trình duyệt, là một sự khó khăn cho mashup Việc tìm hiểu

sử dụng web proxy hoặc JSON, để nâng cao các hiệu quả mashup

Đề tài ‘Cross-domain ajax cho các ứng dụng web mashup’ nhằm mục đích tìm

hiểu về cách thức và phương pháp thực hiện các lời gọi cross domain trong ajax Và trang bị kiến thức về thư viện ajax cross domain, Google Maps API để lập trình ứng dụng thử nghiệm cho mashup

Khóa luận được chia làm 3 chương:

Chương I là phần giới thiệu cross-domain ajax cùng một số vấn đề liên quan, và

các ứng dụng để xây dựng web mashup

Chương II sẽ giới thiệu chi tiết về cross-domain và cross-domain ajax, sau đó

sẽ là phần tóm tắt những giải pháp đang được thực hiện đối với cross-domain trong ajax

Chương III là chương dành cho việc nghiên cứu về hoạt động và lập trình

Google Maps (API), đó là một cơ sở cho việc xây dựng một ứng dụng thử nghiệm cross-domain cho mashup Và cuối cùng, là phần tổng kết bài khóa luận và phần tài liệu tham khảo

CHƯƠNG I CROSS-DOMAIN AJAX VÀ ỨNG DỤNG ĐỂ XÂY

DỰNG WEB MASHUP

1.1 Giới thiệu chung về Cross-Domain Ajax

Hãy lấy một ví dụ: sẽ rất tuyệt nếu bạn có thể lấy dữ liệu từ trang từ điển của

mình để dùng ở mọi trang web khác Điều đó đòi hỏi các trang đó cần mashup dữ liệu của bạn, và khi đó phải thực hiện cross-domain ajax Với rất nhiều ứng dụng hiện nay

sử dụng công nghệ ajax, nó tạo khả năng để gọi các dịch vụ web từ trong javascript của bạn

Để thực hiện cross-domain, có một vài phương pháp phổ biến thông qua JavaScript: Proxy, JSON, Flash

1.1.1 AJAX

Hầu như chúng ta đều đã biết tới hay thậm chí đang sử dụng nhiều Gmail, Google Map, hay các tiện ích tiện dụng của Flickr Thì hẳn chúng ta nên biết rằng những tính năng và cách thức tương tác với người dùng nhanh chóng, tiện lợi như vậy

mà các trang web này cung cấp chính là do AJAX

AJAX không phải là một ngôn ngữ mới, nó là sự kết hợp của một loạt các công nghệ khác nhau:

- XHTML + CSS với vai trò hiển thị thông tin

- Mô hình tương tác và hiển thị động DOM

- Trao đổi và truy cập/tác động lên thông tin sử dụng XML và XSLT

- Nhận thông tin không đồng bộ với đối tượng XMLHttpRequest

- JavaScript với vai trò kết hợp 4 công nghệ trên lại với nhau

Với AJAX, một file JavaScript có thể liên kết trực tiếp với server mà không cần tải lại trang web Công nghệ AJAX đã tạo cho ứng dụng Internet nhỏ gọn hơn, nhanh hơn và tương tác người dùng tốt hơn

Hình 1 XmlHttpRequest với Ajax

Ứng dụng Ajax sử dụng mẫu đối tượng XMLHttpRequest có thể chỉ tạo request tới cùng domain chúng định vị Điều đó bởi vì chính sách bảo mật cross-domain của JavaScript sandbox và nó có thể tránh khỏi tổn thương cross-site

Đối tượng XMLHttpRequest không cho phép gọi các mã từ một domain trong một web server khác Hiện tại, mashup bao gồm việc gọi web service từ API được tạo sẵn bởi các công ty như Google, Flickr, Yahoo, Nó có nghĩa rằng một lời gọi luôn luôn phải tạo cross-domain, nếu không bạn không thể thực hiện chúng

1.1.2 Chính sách Same-Origin

Trình duyệt sử dụng cookie như một phương pháp để xác thực người sử dụng duy nhất, và để thực hiện giao diện phù hợp với người sử dụng đó Để cookie có thể được sử dụng với mục đích như vậy, trình duyệt phải giữ cho cookie bí mật với các site khác Do đó, cookie chỉ được gửi trong cùng một site đã thiết lập chúng, và chính

sách như vậy được biết đến gọi là ‘Chính sách Same-Origin’ Nó cũng có nghĩa rằng –

“chỉ site chứa một vài thông tin trong trình duyệt mới có thể đọc hoặc chỉnh sửa thông tin đó” Điều này có nghĩa là phần lớn không thể tải script từ một domain sang domain khác Ví dụ những hành động sau bị cấm:

- Sử dụng một XMLHttpRequest() đến một domain khác (thành phần cốt lõi

Hạn chế của same-origin policy đối với JavaScript: sự điểu chỉnh truy cập đối

với inline frame (IFRAME) và đối tượng XMLHttpRequest

- IFRAME: có thể sử dụng để download văn bản HTML phong phú bên ngoài nguồn, nhưng nếu nội dung sang domain khác, trình duyệt sẽ không cho phép JavaScript trong trang chứa đọc hoặc sửa đổi văn bản bên trong frame và ngược lại

- XMLHttpRequest: có thể sử dụng để download văn bản XML bất kỳ, nhưng

nó không thể tải file từ domain khác

Như vậy trạng thái của cross-domain script không là ưu điểm cho phát triển web Mặc dù chính sách same-origin ngăn chặn những lỗi có thể xảy ra, nhưng nó cũng lại là hạn chế để nâng cấp (thậm chí là giảm) cho các thế hệ tiếp theo của ứng dụng web để phát triển

1.1.3 Thẻ <script>

Same-origin không áp dụng cho các thẻ script (mặc dù nó áp dụng trên các file JavaScript), script có thể được tải từ các domain khác và thực hiện với đặc quyền của trang chứa chúng

Những script từ xa này có thể được thêm vào trang một cách tự động để theo dõi những ai truy cập vào trang web của bạn, và bạn phải chạy chúng để có hiệu lực

Do đó, nó đảm bảo chỉ các file JavaScript hợp lệ mới có thể truy cập qua domain, và tất cả các file khác sẽ gây lỗi

1.1.4 Gadget Aggregator

Gadget aggregator như Microsoft Windows Live, Google Personalized

Homepage, thực hiện gộp các nội dung tương tác người dùng chọn từ các nguồn khác

nhau thành một trang đơn chính; và các Gadget bao gồm cả HTML và JavaScript, nó được thiết kế để có thể chèn vảo trong một trang gadget aggregator Các công cụ này

nằm trong một trang để cung cấp thông tin cần thiết tới người sử dụng, và nó ở phía client-side của một vài web service

1.2 Giới thiệu về Mashup

Trình duyệt web hiện nay đã được thiết kế để dễ dàng hơn và an toàn hơn trong lấy dữ liệu từ nhiều nguồn vào trong một trang Mashup là website hoặc ứng dụng web

mà phối hợp từ nhiều hơn một nguồn vào trong một trang hợp nhất Cũng như bạn hiểu mashup trong âm nhạc là một bản audio hay video được biên soạn từ những bản ghi khác, thường là từ các phong cách nhạc khác nhau

Ví dụ: Digg.com

Đối với phát triển web, mashup là một ứng dụng web phối hợp dữ liệu từ một hoặc nhiều nguồn vào một bộ công cụ Server tạo các request tới mỗi nguồn nội dung, chuyển giao thông tin nó nhận được, và phối hợp kết quả trong một trang để gửi tới trình duyệt

Hình 2 Mashup nội dung từ nhiều nguồn

Một ứng dụng Ajax + XML cho phép một trang web lấy dữ liệu từ server và tự cập nhật sử dụng mã JavaScript như ở hình 1.2 dưới đây

Hình 3 Dữ liệu tương tác hiển thị với Ajax

Với phương pháp này, người dùng có thể tương tác với nhiều giao diện người dùng mà không cần tải lại toàn bộ trang Server gửi một trang ban đầu tới trình duyệt,

nó gọi ngược lại tới server cho nội dung cần cập nhật

Trong vài năm trở lại đây, việc mở các API từ một số nguồn như Google, Yahoo, Last.fm, Flickr, YouTube và Amazon đã cho phép các nhà phát triển web thực hiện trong các ứng dụng của họ, với một lời gọi tới các API cần thiết, các tính năng như thêm ảnh, bản đồ, videos, và danh sách nhạc

Để hiểu hơn về mashup, chúng ta hãy giả sử có 3 người trực tuyến tại: Google,

Amazon và eBay Mashup của bạn sẽ cho phép mọi người tìm kiếm dữ liệu của

Amazon (ví dụ: giá những cuốn sách), so sánh chúng với trên trang eBay, và cuối cùng, xác định người bán Như vậy, bạn đã tới và xem xét 3 website khác nhau

Hình 4 Khác nhau giữa ba website – Amazon, Google, eBay

Cách chúng làm việc

Hình 5 Mashup làm việc

Mashup là một thể loại thú vị của ứng dụng web Sự kết hợp của các mô hình

dữ liệu, dịch vụ, là sự cung cấp cuối cùng cho sơ sở hạ tầng cần thiết để bắt đầu phát triển ứng dụng có thể thúc đẩy và hợp nhất số lượng lớn thông tin có sẵn trên web

Tạo một mashup, quá trình của chúng ta sẽ gồm các giai đoạn :

Hình 6 Tạo một mashup

Tiếp theo chúng ta sẽ tham khảo một số ứng dụng để xây dựng Web Mashup

1.3 Một số ứng dụng để xây dựng Web Mahup

Thường các ứng dụng web dùng mashup kết hợp bản đồ với nhiều loại dữ liệu

từ nhiều trên web

Hình 7 Ứng dụng cho mashup

Có một nhận xét rằng chúng đều sử dụng API Và hầu hết các nhà cung cấp

dịch vụ API yêu cầu bạn phải có một developer/application ID, một tài khoản người

dùng hoặc dịch dịch vụ của họ, hoặc cả hai Một vài dịch vụ cung cấp cho bạn một ID cho một số ứng dụng khi bạn viết chương trình trong khi những cái khác yêu cầu bạn

tự tạo một ID cho mình với mỗi ứng dụng bạn tạo ra

Trong khi quá trình đăng ký này nghe có vẻ phức tạp, nhưng thật sự nó chỉ tốn một vài phút để hoàn thành

Bạn hãy tham khảo xem một vài ứng dụng sau

1.3.1 Sử dụng Google Maps API

Google Maps API là một ứng dụng sử dụng bản đồ trực tuyến và là một trong những công nghệ mashup đặc trưng Một số APIs bản đồ khác là Yahoo!Maps Web services (http://developer.yahoo.com/maps/ ) Với Google Maps API, chúng sẽ nhận một vị trí và vẽ lên bản đồ Một điểm đánh dấu có thể được sử dụng để xác định vị trí,

và bạn có thể thêm các đoạn văn bản tới điểm đánh dấu đó

Với Google Maps API, bạn có thể tìm các địa điểm (như khách sạn, trạm đổ xăng, ) Và ngày nay, cuộc cách mạng ngành bản đồ diễn ra mạnh với khả năng hiển thị ảnh chụp vệ tinh chi tiết đến từng ngôi nhà

Để đăng nhập cho một Google Maps API key, đầu tiên bạn hãy truy cập vào

website http://code.google.com/apis/maps/ và tới đường link ‘Sign up for a Google Maps API key’

Hình 8 Đăng nhập Google Maps API key

Nếu bạn sử dụng Google Maps API trong một vài mashups được định vị tại các

server khác nhau, bạn có thể cần đến những key khác nhau Đó cũng chính là key cho phép bạn sử dụng API Key này sẽ là duy nhất cho bạn, cho ứng dụng của bạn hoặc thậm chí cho URL từ mashup của bạn được đưa ra dù nó hầu hết các key đều miễn phí

Dữ liệu được sử dụng trong Google Maps thường được chuyển đổi đến địa chỉ của điểm tung độ/hoành độ hoặc tại thành phố,

1.3.2 Sử dụng Amazon Web Services và Google Search APIs

Bạn có thể sử dụng API để tìm kiếm trong cơ sở dữ liệu của Amazon và thực hiện một thẻ mua sắm trong hai cách khác nhau Với Amazon, trọng tâm là trên dữ liệu bạn truy cập không cần trực tiếp các lời gọi SQL

Với Amazon, bạn cần truy cập tới Web Services API của API – nơi mà dữ liệu Amazon được lưu trữ Bạn cũng có thể cần thực hiện thẻ mua sắm và khả năng tìm kiếm (và đạt lợi nhuận) bán hàng thông qua trang web của bạn Dù đơn giản, nhưng nó yêu cầu bạn tạo 3 tài khoản riêng biệt: một tài khoản Amazon, một tài khoản Amazon Associate và một tài khoản Amazon Web Services (AWS)

Để có một tài khoản Amazon, bạn thật sự không phải làm gì cả, vì nó đơn giản chỉ gồm địa chỉ e-mail và mật khẩu, cùng với những thông tin khác bạn cung cấp

Để đăng kí cho một tài khoản Amazon Associate, ta tìm đến đường link

‘Associates Program’

Hình 9 Đăng nhập cho tài khoản Amazon Associates

Để đăng kí cho một tài khoản AWS, truy cập vào website

Hình 10 Đăng nhập cho tài khoản AWS

Với việc sử dụng Google Search API, nó cho phép bạn đặt chế độ tìm kiếm trên

trang web của bạn và trong mashup giống như trong Goolg Map API vậy Và sự thật rằng, hiện nay rất nhiều các công ty như Google, Yahoo!, cung cấp một loạt các API

cho việc tìm kiếm, lập bản đồ, và các mục đich khác

Hình 11 Google Search API

Bạn có thể cho phép người dùng tìm kiếm video, tin tức, sách, Như vậy là bạn cần giao diện của Amazon và giao diện của Google Search

1.3.3 Sử dụng Flickr API

Flickr API là một sự bổ sung tới APIs Flickr là một dịch vụ chia sẻ ảnh

(photo-sharing) Nó cho phép bạn tải ảnh của bạn lên và xem những ảnh đã được tải lên khác

Thông tin về mỗi bức ảnh có thể được sử dụng để bổ sung và tìm kiếm Quan trọng

nhất, ảnh có thể có các tag – các từ mà người chủ bức ảnh cảm thấy có thể sử dụng để nhận dạng bức ảnh Bạn có thể tìm kiếm Flickr cho phù hợp với những tag xác định

Bước đầu tiên bạn cũng truy cập để có được một API key Sau đó, bạn có thể khai thác APIs thể sử dụng API Explorer – cung cấp danh sách tất cả các biến và cho

phép bạn nhập dữ liệu tới các biến đó

Hình 12 Đăng nhập cho tài khoản Flickr API

Lần đầu tiên sử dụng Flickr, bạn cũng cần phải có được một Yahoo! ID để đạt

được quyền truy cập Trong Mashup phần mềm và thành phần của Web 2.0 được cấu trúc lại, liên kết lại và đạt được một sự thay đổi mẫu mã, thì Flickr bây giờ là một thành phần của Yahoo!

Những thông tin ở phía trái của trang web rất hữu ích, nhưng nó là tham chiếu

của API phía bên phải – rất quan trọng API routines được nhóm lại theo các loại Như

vậy, để xây dựng một mashup, bạn cần di chuyển xuống tới các phần hình ảnh và nhấn

tới flickr.photos.search để cho phép bạn tìm kiếm danh sách ảnh

Hình 13 Flickr photos search

1.3.4 Sử dụng ebay API

eBay API là một ứng dụng phức tạp nhất Nó đã được mở để third-party phát triển trong một thời gian dài và quy trình (đấu giá) cũng là phức tạp hơn quy trình mua

và bán thông thường cho một mức giá cố định

Tại eBay API, bạn sẽ tìm kiếm một mục nào đó sử dụng cả giao diện SOAP và giao diện REST Và kết quả sẽ được hiển thị trên một bản đồ Google dựa vào vị trí của người bán

Để bắt đầu truy cập tới eBay APIs, bạn đi tới eBay Developer Center tại

web, và sau đó đăng nhập

Hình 14 Đăng nhập cho tài khoản Flickr API

Mashup trong eBay cho phép bạn tìm kiếm các mục sử dụng các từ khóa Khi tìm thấy thấy kết quả, nó trả về một văn bản XML Văn bản này chứa các tiêu đề mỗi mục và giá của chúng cũng như vị trí người bán Các mục này sau đó được ánh xạ vào một bản đồ của Google với sự đánh dấu được cung cấp thông tin về đường liên kết tới trang eBay

Dữ liệu lấy từ eBay và cũng sử dụng bản đồ Google API