Xây dựng mạng xã hội chia sẽ lộ trình du lịch hello world trên nền tảng điện thoại thông minh iphone

ĐẠI HỌC ĐÀ NẴNG TRƯỜNG ĐẠI HỌC SƯ PHẠM KHOA TIN HỌC Tel (84-511)3841323 - 3841513, Fax (84-511) 3842953 Website: www.edu.udn.vn E-mail: Education@dng.vnn.vn KHÓA LUẬN TỐT NGHIỆP NGÀNH CỬ NHÂN CÔNG NGHỆ THÔNG TIN ĐỀ TÀI XÂY DỰNG MẠNG XÃ HỘI HỖ TRỢ NGƯỜI DÙNG LẬP VÀ CHIA SẺ LỘ TRÌNH DU LỊCH TRÊN NỀN TẢNG ĐIỆN THOẠI THƠNG MINH IPHONE Sinh viên Lớp Giảng viên hướng dẫn : Nguyễn Lê Xuân Vinh : 08CNTT01 : ThS Nguyễn Thanh Tuấn Đà Nẵng, tháng năm 20012 LỜI CẢM ƠN Tôi xin chân thành cảm ơn thầy cô khoa Tin học thầy cô giảng dạy trường Đại học Sư Phạm Đà Nẵng truyền đạt kiến thức quý báu cho năm học vừa qua Đặc biệt, xin chân thành cảm ơn thầy giáo Nguyễn Thanh Tuấn, khoa Tin học, trường Đại học Sư Phạm tận tình hướng dẫn, động viên giúp đỡ suốt thời gian thực đề tài Và để có kết ngày hôm nay, biết ơn gia đình động viên, khích lệ, tạo điều kiện thuận lợi suốt trình học tập trình thực đề tài tốt nghiệp Xin chân thành cám ơn giám đốc Ngơ Chí Trung, anh chị Công ty AsNet chân thành giúp đỡ lúc gặp khó khăn bạn khoa tin học – khóa 08 ủng hộ, giúp đỡ, chia sẻ kiến thức, kinh nghiệm tài liệu có cho tơi q trình nghiên cứu thực đề tài Một lần xin chân thành cám ơn! Đà Nẵng, tháng 5/2012 Sinh viên thực Nguyễn Lê Xuân Vinh LỜI CAM ĐOAN Chúng xin cam đoan : Những nội dung luận văn thực hướng dẫn trực tiếp ThS GV Nguyễn Thanh Tuấn Mọi tham khảo dùng luận văn trích dẫn rõ ràng tên tác giả, tên cơng trình, thời gian, địa điểm cơng bố Mọi chép không hợp lệ, vi phạm quy chế đào tạo, hay gian trá, chúng tơi xin chịu hồn toàn trách nhiệm Đà Nẵng, tháng 5/2012 Sinh viên thực Nguyễn Lê Xuân Vinh MỤC LỤC MỞ ĐẦU TỔNG QUAN LÝ THUYẾT 11 I Đặt vấn đề 11 II Giải pháp thực tiễn 11 II.1 Mạng xã hội chia sẻ địa điểm vạch lộ trình 11 II.2 Các vấn đề gặp phải 17 II.2.1 Khả bảo mật 17 II.2.2 Đã có nhiều mạng xã hội 19 III Các công nghệ sử dụng 19 III.1 Tổng quan Ruby on Rails 19 III.1.1 Giới thiệu 19 III.1.2 Điểm mạnh Ruby on Rails 20 III.1.3 Kiến trúc mơ hình MVC Ruby on Rails 22 III.2 Hệ điều hành iOS 27 III.2.1 Giới thiệu 27 III.2.2 Mơi trường trình duyệt Safari 28 III.3 Công nghệ Google Maps 29 III.3.1 Hệ thống đồ Google Maps 29 III.3.2 Cách hoạt động Google Maps API 31 III.4 Các công nghệ khác 31 III.4.1 Công nghệ HTML5 CSS3 31 III.4.2 Công nghệ jQuery Mobile 33 III.4.3 Định dạng XML 34 III.4.4 JSON 37 III.4.5 RESTful Webservice: 38 PHÂN TÍCH THIẾT KẾ HỆ THỐNG I 40 Phân tích yêu cầu 40 I.1 Hiện trạng vấn đề 40 I.2 Yêu cầu đặt 40 I.3 Giải pháp 40 II Giải yêu cầu 41 II.1 Kiến trúc hệ thống 41 II.2 Các chức hoạt động hệ thống 43 III Thiết kế hệ thống 44 III.1 Use case hệ thống 44 III.2 Sơ đồ hoạt động hệ thống 46 III.3 Sơ đồ chức 47 III.3.1 Chức hiển thị đồ 47 III.3.2 Chức đăng ký thành viên 48 III.3.3 Chức đăng nhập 51 III.3.4 Chức Add Location 53 III.3.5 Chức Directions 54 III.3.6 Chức Capture 57 III.3.7 Chức Share 58 III.4 Cơ sở liệu hệ thống 60 III.4.1 Mô tả bảng 60 III.4.2 Quan hệ bảng 61 III.5 Cài đặt công cụ hỗ trợ phát triển hệ thống 61 III.5.1 Công cụ Aptana 61 III.5.2 Cơng cụ hỗ trợ lập trình web iPhone Aptana 62 III.5.3 Cài đặt Framework Ruby on Rails 62 ĐÁNH GIÁ 64 I So sánh chức đề tài với hệ thống khác 64 II Kết 65 KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 75 I Kết luận 75 I.1 Kết đạt 75 I.1.1 Lý thuyết 75 I.1.2 Thực hành 75 I.2 Những hạn chế đề tài 76 II Hướng phát triển 76 TÀI LIỆU THAM KHẢO 77 DANH MỤC HÌNH Hình 1: Điện thoại thông minh iPhone 10 Hình 2: Mạng xã hội 12 Hình 3:Các mạng xã hội địa điểm 14 Hình 4: Mạng xã hội Foursquare 15 Hình 5: Mạng xã hội Kunkun 16 Hình 6: Hệ thống lập lộ trình Tourist Eye 17 Hình 7: Mơ hình MVC 23 Hình 8: Mơ hình MVC 24 Hình 9: Cấu trúc hoạt động mơ hình MVC 25 Hình 10: Hệ điều hành iOS iPhone 28 Hình 11: Trình duyệt Safari iPhone 29 Hình 12: Google Maps 30 Hình 13: Ứng dụng Google Maps API vào mobile 30 Hình 14: HTML5 32 Hình 15: CSS3 33 Hình 16: jQuery Mobile 34 Hình 17: XML 35 Hình 18: JSON 37 Hình 19: Sơ đồ kiến trúc RESTful Webservice 39 Hình 20: Tổng quan hệ thống 41 Hình 21: Kiến trúc hệ thống 42 Hình 22: Use-case đăng ký đăng nhập 44 Hình 23: Use-case chức hệ thống 45 Hình 24: Sơ đồ hoạt động hệ thống 46 Hình 25: Sơ đồ chức hiển thị đồ 48 Hình 26: Sơ đồ chức đăng ký 49 Hình 27: Sơ đồ chức đăng nhập 51 Hình 28: Sơ đồ chức Add Location 53 Hình 29: Sơ đồ chức Directions 55 Hình 30: Sơ đồ chức Capture 58 Hình 31: Sơ đồ chức Share 59 Hình 32: Table Users 60 Hình 33: Table Maps 60 Hình 34: Quan hệ bảng 61 Hình 35: Cửa sổ APTANA 62 Hình 36: Giao diện hệ thống với chức 65 Hình 37: Đăng ký thành viên 66 Hình 38: Đăng nhập thành viên 67 Hình 39: Hệ thống sau đăng nhập 68 Hình 40: Bản đồ hỗ trợ 69 Hình 41: Hiển thị địa danh du lịch qua biểu tượng 70 Hình 42: Chọn địa danh 71 Hình 43: Lộ trình qua địa danh 72 Hình 44: Chi tiết lộ trình 73 Hình 45: Chụp ảnh lộ trình 74 PHẦN MỞ ĐẦU Trong khoảng thời gian gần đây, công nghệ thơng tin có bước phát triển vượt bậc Công nghệ thông tin làm thay đổi lĩnh vực đời sống người Nhiều cơng việc địi hỏi sức người, tốn nhiều thời gian khứ với trợ giúp đỡ cơng nghệ chuyện trở nên đơn giản nhiều Cụ thể phát triển công nghệ thông tin thời gian gần tập trung vào lĩnh vực điện thoại thông minh – smartphone Kể từ điện thoại thông minh đời vào năm 1993 IBM với tính vượt trội giao tiếp giọng nói, hình cảm ứng, lịch làm việc, sổ danh bạ Và đến năm 2000 – 2002 hàng loạt điện thoại thông minh hãng công nghệ Nokia, LG, Palm đời với hệ điều hành riêng tính độc đáo Nhưng đến năm 2007, mẫu điện thoại thơng minh iPhone Apple tích hợp Internet đa phương tiện tạo xu hướng ngành công nghệ điện thoại thông minh Với hình cảm ứng đa điểm kho ứng dụng bao la Kể từ năm 2007 đến điện thoại thông minh hãng công nghệ liên tục phát triển với tính vượt trội, dần thay cho máy tính PC hay Laptop Cùng với phát triển công nghệ nhu cầu kết nối người ngày tăng Với đời mạng xã hội Facebook thu hút 600 triệu lượt người sử dụng chia sẻ thứ cho Những mạng xã hội phục vụ cho công việc Linked In, mạng xã hội chia sẻ địa điểm Foursquare, tiểu blog Twitter v v tích hợp điện thoại thơng minh Ở Việt Nam, đất nước với nhiều danh lam thắng cảnh tiếng, di sản văn hóa nhân loại thu hút lượng khách du lịch lớn Du khách đến với Việt Nam nhiều hình thức chung mục đích khám phá vẻ đẹp Việt Nam, vẻ đẹp pha trộn cổ kính đại Nắm bắt thực tế xảy ra, tơi nhận thấy cần phải có mạng xã hội hỗ trợ du khách lập lộ trình du lịch qua địa danh tiếng chia sẻ lộ trình với bạn bè khắp nơi giới Sinh viên thực hiện: Nguyễn Lê Xuân Vinh – Lớp: 08CNTT1 Trang Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch Được đồng ý giảng viên hướng dẫn, chọn đề tài “Xây dựng mạng xã hội chia sẻ lộ trình du lịch HelloWorld tảng điện thoại thông minh iPhone” cho luận văn tốt nghiệp Luận văn tổ chức sau: Phần 1: Mở đầu Phần 2: Nội dung đề tài Chương 1: Cơ sở lý thuyết vấn đề Chương 2: Phân tích thiết kế hệ thống Chương 3: Đánh giá Phần 3: Kết luận hướng phát triển Tài liệu tham khảo Trang PHẦN NỘI DUNG ĐỀ TÀI XÂY DỰNG MẠNG XÃ HỘI HỖ TRỢ NGƯỜI DÙNG LẬP VÀ CHIA SẺ LỘ TRÌNH DU LỊCH TRÊN NỀN TẢNG ĐIỆN THOẠI THƠNG MINH IPHONE Hình 1: Điện thoại thông minh iPhone Sinh viên thực hiện: Nguyễn Lê Xuân Vinh – Lớp: 08CNTT1 Trang 10 Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch Bước 3: Tạo demo app Ruby on Rails Vào cmd gõ lệnh rails new project -> tạo project Tiếp theo cd project -> di chuyển đến thư mục project Cuối rails server rails s -> khởi động server Ruby on Rails Vào browser gõ http://localhost:3000 để xem trang Ruby on Rails Trang 63 CHƯƠNG ĐÁNH GIÁ I So sánh chức đề tài với hệ thống khác Chức Hello World Foursquare Tourist Eye Chọn địa danh Người dùng chạm Thông qua định vị Chọn địa danh du lịch du lịch trực tiếp lên đồ GPS để chọn địa du lịch thông qua để chọn danh du lịch gợi ý hệ thống Vạch lộ trình du Lộ trình du lịch Khơng hỗ trợ chức Lộ trình du lịch lịch vẽ lập thông qua chi tiết đồ chuyến Sao lưu lộ trình Chụp đồ vẽ Không hỗ trợ chức Sao lưu vào hệ thống du lịch lộ trình du lịch chi tiết chuyến đồ vào nhớ thiết bị Chia sẻ lộ trình Chia sẻ lộ trình Chỉ chia sẻ địa điểm Chia sẻ lộ trình đến du lịch chụp lên mạng du lịch không chia sẻ thành viên xã hội khác lộ trình mạng xã hội khác Kết bạn Hệ thống chưa hỗ Hỗ trợ tốt Hỗ trợ tốt thành viên trợ tính Sinh viên thực hiện: Nguyễn Lê Xuân Vinh – Lớp: 08CNTT1 Trang 64 Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch II Kết - Giao diện bắt đầu chương trình Hình 36: Giao diện hệ thống với chức Mô tả: Giao diện truy cập vào hệ thống Hiển thị: Các chức Đăng ký (Register) Đăng nhập (Login) Trang 65 Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch - Chức đăng ký thành viên hệ thống Hình 37: Đăng ký thành viên Mơ tả: Chức Đăng ký (Register) Hoạt động: Sau chọn vào Register – hiển thị trang đăng ký thành viên Điền đầy đủ thông tin chọn Create User để đăng ký thành viên hệ thống Trang 66 Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch - Chức đăng nhập hệ thống Hình 38: Đăng nhập thành viên Mơ tả: Chức Đăng nhập (Login) Hoạt động: Sau đăng ký thành viên thành công, người dùng đăng nhập (Login) Điền đầy đủ thông tin đăng nhập chọn Login để truy cập vào hệ thống Trang 67 Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch - Hệ thống sau đăng nhập Hình 39: Hệ thống sau đăng nhập Mô tả: Hệ thống sau đăng nhập (Login) Hoạt động: Sau đăng nhập để truy cập vào hệ thống Các chức : Create Trip: tạo lộ trình du lịch Explorer: địa danh du lịch tiếng User’s Trip: trang quản lý lộ trình Contact: trang liên lạc với hệ thống Trang 68 Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch - Chức tạo lộ trình: Hình 40: Bản đồ hỗ trợ Mô tả: Chọn chức tạo lộ trình (Create Trip) Hoạt động: Chọn chức “Create Trip” để hiển thị đô hỗ trợ lập lộ trình du lịch Trang 69 Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch - Chức hiển thị địa danh du lịch Hình 41: Hiển thị địa danh du lịch qua biểu tượng Mô tả: Bản đồ với biểu tượng địa danh du lịch Hoạt động: Với chức “Places Type”, địa danh du lịch phân loại Người dùng việc chọn loại địa danh để hiển thị đồ Trang 70 Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch - Chức chọn địa danh Hình 42: Chọn địa danh Mơ tả: Chức chọn địa danh (Add Location) Hoạt động: Người dùng chọn địa danh cách chạm trực tiếp lên đồ Địa danh chọn có biểu tượng đánh dấu đồ Trang 71 Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch - Chức vạch lộ trình Hình 43: Lộ trình qua địa danh Mơ tả: Chức vạch lộ trình (Get Directions) Hoạt động: Sau chọn địa danh thành công, người dùng chọn “Get Directions” để hệ thống vạch lộ trình qua địa danh Trang 72 Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch - Chức hiển thị chi tiết lộ trình Hình 44: Chi tiết lộ trình Mơ tả: Chi tiết lộ trình (Details) Hoạt động: Hệ thống vạch lộ trình, người dùng chọn chức “Details” để hiển thị chi tiết lộ trình (Tổng đoạn đường, thời gian dự kiến, đường lộ trình) Trang 73 Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch - Chức chụp ảnh lộ trình Hình 45: Chụp ảnh lộ trình Mơ tả: Chụp ảnh lộ trình (Capture) Hoạt động: Người dùng chọn chức “Capture” để chụp lại lộ trình chi tiết dạng ảnh Trang 74 PHẦN KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN I Kết luận I.1 Kết đạt I.1.1 Lý thuyết - Thông qua việc thực đề tài, tơi có dịp áp dụng, củng cố kiến thức học, nắm vững howng quy trình phát triển ứng dụng website Cụ thể - Ứng dụng UML công cụ Software Ideas Modeler vào việc phân tích thiết kế hệ thống thơng tin - Tìm hiểu công nghệ phát triển ứng dụng web tảng điện thoại thông minh cách trao đổi liệu theo mơ hình Client/Server thơng qua RESTful Web Service - Tìm hiểu ngơn ngữ lập trình Ruby framework Ruby on Rails để xây dựng ứng dụng hỗ trợ công cụ Aptana iPhone Web Dev I.1.2 Thực hành - Cùng với trình tìm hiểu, nghiên cứu công nghệ kỹ thuật nêu lên, đề tài xây dựng hệ thống hỗ trợ người dùng lập chia sẻ lộ trình du lịch Việc sử dụng điện thoại thông minh làm tảng phát triển hệ thống giúp cho công việc lập lộ trình du lịch trở nên đơn giản - Phía Server sử dụng xử lý thơng tin tham số gửi từ Client - RESTful Webservice cầu nối Server Client, cung cấp dịch vụ: kết nối truyền tải sở liệu - Điện thoại thông minh hiển thị tốt đồ, lộ trình hỗ trợ tốt chức hệ thống Sinh viên thực hiện: Nguyễn Lê Xuân Vinh – Lớp: 08CNTT1 Trang 75 Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch I.2 Những hạn chế đề tài Bên cạnh mặt đạt được, hệ thống hạn chế: - Chỉ trọng phát triển chức đề tài, chức chia sẻ, lưu lộ trình chi tiết server cịn nhiều thiếu sót - Thiết kế giao diện, hệ thống tương tác với người dùng (User Interface / User Exprience) chưa thực đẹp - Hệ thống cần phải có Internet để hoạt động II Hướng phát triển - Hoàn thành chức kết bạn thành viên để chia sẻ lộ trình thành viên - Phát triển ứng dụng website thành ứng dụng hoạt động điện thoại thơng minh để hệ thống hoạt động khơng có mạng Internet Trang 76 TÀI LIỆU THAM KHẢO [1] Bill Sanders, Smashing HTML5, Smashing Magazine 2011, 356tr [2] Brian P.Hogan, HTML5 and CSS3, The Pragmatic Bookshelf 2010, 400tr [3] Alex MacCaw, Javascript Web Applications, O’Reilly 2011, 258tr [4] John Resig, Leanring jQuery, Packt 2011, 387tr [5] Cloves Carneiro Jr., Rida Al Barazi, Beginning Rails 3, Appress Exprert 2010, 375tr [6] Michael Hartl, Ruby on Rails Tutorial, Addsion – Wesley Professional 2011, 548tr [7] Gabriel Svennerberg, Beginning Google Maps API 3, Appress Expert 2010, 400tr [8] Trang web: https://developers.google.com/maps/documentation/javascript/ [9] Trang web: https://developers.google.com/maps/documentation/javascript/places [10] Trang web: http://geocodezip.com Sinh viên thực hiện: Nguyễn Lê Xuân Vinh – Lớp: 08CNTT1 Trang 77 ... trợ người dùng lập chia sẻ lộ trình du lịch Được đồng ý giảng viên hướng dẫn, chọn đề tài ? ?Xây dựng mạng xã hội chia sẻ lộ trình du lịch HelloWorld tảng điện thoại thơng minh iPhone? ?? cho luận văn... cũ gần Trang 13 Xây dựng mạng xã hội hỗ trợ người dùng lập chia sẻ lộ trình du lịch Hình 3:Các mạng xã hội địa điểm Ý tưởng mạng xã hội dựa địa điểm manh nha điện thoại thông minh với hệ thống... gì? Đó chinh hình thành mạng xã hội giúp du khách lập lộ trình du lịch chia sẻ với bạn bè Mạng xã hội lộ trình du lịch chinh cơng cụ du lịch Việt Nam, nơi quảng bá du lịch Việt Nam tốt III Các