SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 44
2.4.3.3. Sơ đồ dữ liệu mức dưới đỉnh
o Sơ đồ dữ liệu mức dƣới đỉnh giải thích chức năng 1 - Cung cấp thông tin
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 45 o Sơ đồ dữ liệu mức dƣới đỉnh giải thích chức năng 2 - Cung cấp địa điểm
Hình 2.7. Sơ đồ dữ liệu mức dƣới đỉnh-2
o Sơ đồ dữ liệu mức dƣới đỉnh giải thích chức năng 3 - Cung cấp tour
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 46 o Sơ đồ dữ liệu mức dƣới đỉnh giải thích chức năng 4 - Tìm kiếm
Hình 2.9. Sơ đồ dữ liệu mức dƣới đỉnh-4
o Sơ đồ dữ liệu mức dƣới đỉnh giải thích chức năng 5 - Quản lý tài khoản
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 47
Sơ đồ phân luồng dữ liệu
2.4.4.
Hình 2.11. Sơ đồ phân luồng dữ liệu
2.5. THIẾT KẾ CƠ SỞ DỮ LIỆU Xác định các thực thể
2.5.1.
2.5.1.1. tb_user
STT Tên trƣờng Kiểu dữ liệu Độ Dài Mô tả
1 id INT 11 Chỉ số của bảng tb_user và là khóa chính của bảng
2 name VARCHAR 50 Tên của ngƣời dùng 3 email TEXT Email của ngƣời dùng 4 pass TEXT Chứa mật khẩu ngƣời dùng
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 48
2.5.1.2. tb_user_tour
STT Tên trƣờng Kiểu dữ liệu Độ dài Mô tả
1 id INT 11 Chỉ số của bảng tb_user_tour và là khóa chính của bảng
2 user_id INT 11 Id của ngƣời dùng
3 tour_id INT 11 Id của tour mà ngƣời dùng lƣu
Bảng 2.2. Mô tả bảng tb_user_tour
2.5.1.3. tb_introduce
STT Tên trƣờng Kiểu dữ liệu Độ dài Mô tả
1 id INT 11 Chỉ số của bảng tb_introduce và là khóa chính của bảng
2 title TEXT Tiêu đề các danh mục của phần giới thiệu
Bảng 2.3. Mô tả bảng tb_introduce
2.5.1.4. tb_content
STT Tên trƣờng Kiểu dữ liệu Độ dài Mô tả
1 id INT 11 Chỉ số của bảng tb_content và là khóa chính của bảng
2 title TEXT Tiêu đề nội dung của phần giới thiệu
3 introduce_id INT 11 Id của bảng tb_introduce là khóa ngoại.
Bảng 2.4. Mô tả bảng tb_content
2.5.1.5. tb_detail
STT Tên trƣờng Kiểu dữ liệu Độ dài Mô tả
1 id INT 11 Chỉ số của bảng tb_detail và là khóa chính của bảng
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 49
2 title TEXT Tiêu đề bài viết
3 detail TEXT Nội dung chi tiết của bài viết
Bảng 2.5. Mô tả bảng tb_detail
2.5.1.6. tb_tour
STT Tên trƣờng Kiểu dữ liệu Độ dài Mô tả
1 id INT 11 Chỉ số của bảng tb_tour và là khóa chính của bảng
2 name TEXT Tên của tour
Bảng 2.6. Mô tả bảng tb_tour
2.5.1.7. tb_tour_detail
STT Tên trƣờng Kiểu dữ liệu Độ dài Mô tả
1 id INT 11 Chỉ số của bảng tb_tour_detail và là khóa chính của bảng
2 title TEXT Tiêu đề của bài viết 3 detail TEXT Nội dung của bài viết
Bảng 2.7. Mô tả bảng tb_tour
2.5.1.8. tb_keyword
STT Tên trƣờng Kiểu dữ liệu Độ dài Mô tả
1 id INT 11 Chỉ số của bảng tb_keyword và là khóa chính của bảng
2 title TEXT Tiêu đề chứa từ khóa cần tìm 3 discription TEXT Mô tả cho tiêu đề của bảng,
chứa từ khóa cần tìm
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 50
Sơ đồ quan hệ giữa các thực thể
2.5.2.
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 51
CHƢƠNG 3. TÌM HIỂU THUẬT TOÁN
3.1. THUẬT TOÁN DIJKSTRA TÌM ĐƢỜNG ĐI NGẮN NHẤT Khái niệm Khái niệm
3.1.1.
Thuật toán Dijkstra, mang tên của nhà khoa học máy tính ngƣời Hà Lan Edsger Dijkstra vào năm 1956 và ấn bản năm 1959, là một thuật toán giải quyết bài toán đƣờng đi ngắn nhất nguồn đơn trong một đồ thị có hƣớng không, có cạnh mang trọng số âm.
Bài toán tìm đƣờng đi ngắn nhất
3.1.2.
Thuật toán Dijkstra xác định đƣờng đi ngắn nhất giữa 2 đỉnh cho trƣớc, từ đỉnh a đến đỉnh b.
Ở mỗi đỉnh v, thuật toán Dijkstra xác định 3 thông tin: kv, dv và pv.
o kv: mang giá trị Boolean xác định trạng thái đƣợc chọn của đỉnh v. Ban đầu ta khởi tạo tất cả các đỉnh v chƣa đƣợc chọn, nghĩa là:
o kv:=false, với mọi v thuộc V.
o dv: là chiều dài đƣờng đi mà ta tìm thấy cho đến thời điểm đang xét từ a đến v.
Khởi tạo, dv = ∞, với mọi v thuộc V\{a}, da=0.
o pv là đỉnh trƣớc của đỉnh v trên đƣờng đi ngắn nhất từ a đến b.
Đƣờng đi ngắn nhất từ a đến b có dạng {a,…, pv,…, b}. Khởi tạo, pv = null, với mọi v thuộc V.
Các bƣớc của thuật toán Dijkstra
3.1.3.
Bước 1: Khởi tạo: Đặt kv := false với mọi v thuộc V; kv := vô cùng, với mọi v thuộc V\{a}, da :=0.
Bước 2: Chọn v thuộc V sao cho kv = false và kv = min{d(1)/t thuộc V, k1=false}
Bước 3: Đánh dấu đỉnh v, ku = true;
Bước 4: Nếu v=b thì kết thúc và db là độ dài đƣờng đi ngắn nhất từ a đến b. Ngƣợc lại nếu v khác b sang bƣớc 5.
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 52
Bước 5: Với mỗi đỉnh u kề với v mà ku = false, kiểm tra
o Nếu du >dv + w(v, u) thì du :=dv +(v, u)
o Ghi nhớ đỉnh v: pu :=v. Quay lại Bƣớc 2.
Sơ đồ thuật toán Dijkstra
3.1.4.
Hình 3.1. Sơ đồ thuật toán Dijkstra
3.2. THUẬT TOÁN MÃ HÓA MD5 Khái niệm
3.2.1.
MD5 (Message-Digest algorithm 5) là một hàm băm để mã hóa với giá trị băm là 128bit. Từng đƣợc xem là một chuẩn trên Internet, MD5 đã đƣợc sữ dụng rông rải trong các chƣơng trình an ninh mạng, và cũng thƣờng đƣợc dùng để kiểm tra tính nguyên vẹn của tập tin.
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 53
Sử dụng MD5 để mã hóa mật khẩu. Mục đích của việc mã hóa này là biến đổi một chuổi mật khẩu thành một đoạn mã khác, sao cho từ đoạn mã đó không thể nào lần trở lại mật khẩu. Có nghĩa là việc giải mã là không thể hoặc phải mất một khoãng thời gian vô tận.
Ứng dụng của thuật toán
3.2.2.
o MD5 đƣợc sử dụng rộng rải trong thế giới phần mềm để đảm bảo rằng tập tin tải về không bị hỏng. Ngƣời sử dụng có thể so sánh giữa thông số kiểm tra phần mềm bằng MD5 đƣợc công bố với thông số kiểm tra phần mềm tải về bằng MD5.Hệ điều hành Unix sử dụng MD5 để kiểm tra các gói mà nó phân phối, trong khi hệ điều hành Windows sử dụng phần mềm của hãng thứ ba.
o MD5 đƣợc dùng để mã hóa mật khẩu. Mục đích của việc mã hóa này là biến đổi một chuổi mật khẩu thành một đoạn mã khác, sao cho từ đoạn mã đó không thể nào lần trở lại mật khẩu. Có nghĩa là việc giải mã là không thể hoặc phải mất một khoãng thời gian vô tận (đủ để làm nản lòng các hacker).
Mô tả thuật toán
3.2.3.
MD5 biến đổi một thông điệp có chiều dài bất kì thành một khối có kích thƣớc cố định 128 bits. Thông điệp đƣa vào sẻ đƣợc cắt thành các khối 512 bits. Thông điệp đƣợc đƣa vào bộ đệm để chiều dài của nó sẻ chia hết cho 512. Bộ đệm hoạt động nhƣ sau:
o Trƣớc tiên nó sẻ ch n bit 1 vào cuối thông điệp.
o Tiếp đó là hàng loạt bit Zero cho tới khi chiều dài của nó nhỏ hơn bội số của 512 một khoảng 64 bit .
o Phần còn lại sẻ đƣợc lấp đầy bởi một số nguyên 64 bit biểu diển chiều dài ban đầu của thông điệp.
Thuật toán chính của MD5 hoạt động trên một bộ 128 bit. Chia nhỏ nó ra thành 4 từ 32 bit, kí hiệu là A,B,C và D. Các giá trị này là các hằng số cố định.
Sau đó thuật toán chính sẻ luân phiên hoạt động trên các khối 512 bit. Mỗi khối sẻ phối hợp với một bộ. Quá trình xữ lý một khối thông điệp bao gồm 4 bƣớc tƣơng tự nhau, gọi là vòng (“round”). Mỗi vòng lại gồm 16 quá trình tƣơng tự nhau dựa trên hàm một chiều F, phép cộng module và phép xoay trái…
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 54
Hình bên dƣới mô tả một quá trình trong một vòng. Có 4 hàm một chiều F có thể sử dụng. Mỗi vòng sử dụng một hàm khác nhau.
Hình 3.2. Chu trình mã hóa bằng thuật toán MD5
Hàm băm MD5 (còn đƣợc gọi là hàm tóm tắt thông điệp - message degests) sẽ trả về một chuổi số thập lục phân gồm 32 số liên tiếp.
Dƣới đây là các ví dụ mô tả các kết quả thu đƣợc sau khi băm: MD5(“matkhau”)= 9e107d9d372bb6826bd81d3542a419d6. MD5("honganh") = 1055d3e698d289f2af8663725127bd4b.
3.3. THUẬT TOÁN XỬ LÝ CHUỖI Cắt chuỗi
3.3.1.
Thuật toán cắt chuỗi xử lý tại server, server sẽ gửi yêu cầu cho client để lấy chuỗi ở đây chính là tên và mật khẩu đăng nhập của ngƣời dùng từ cookie, sau khi nhận chuỗi server sẽ xử lý cắt lấy chuỗi chứa tên ngƣời dùng sau đó trả về “name” chính ta tên ngƣời dùng để kiểm tra với cơ sở dữ liệu.
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 55
Mô tả thuật toán:
o Input: Nhận vào một chuỗi từ client.
o Output: Cắt chuỗi và trả về chuỗi cần tìm. Quá trình xử lý:
function getName(req, res) {
var name, password, namePassword, str;
if ( typeof req.cookies.auth !== "undefined") { namePassword = req.cookies.auth; str = namePassword.split("."); name = str[0]; password = str[1]; } return name; } Đọc chuỗi 3.3.2.
Thuật toán đọc chuỗi đƣợc xử lý tại client, đọc tên đăng nhập của ngƣời dùng từ cookie sau đó tiến hành kiểm tra để xác nhận là ngƣời dùng đã đăng nhập hay chƣa.
Mô tả thuật toán:
o Input: Nhận vào một chuỗi đọc từ cookie
o Output: Đọc và lấy chuỗi cần tìm.
Quá trình xử lý:
function readCookie (name) { var nameCk = name + "=",
splitCk = document.cookie.split(';'), len = splitCk.length;
for (var i=0; i < len; i++) { var c = splitCk[i];
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 56 while(c.charAt(0)=='')c = c.substring(1, c.length); if (c.indexOf(nameCk) == 0)
return c.substring(nameCk.length, c.length); }
return null; }
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 57
CHƢƠNG 4. TRIỂN KHAI VÀ ĐÁNH GIÁ KẾT QUẢ
4.1. TRIỂN KHAI XÂY DỰNG Yêu cầu hệ thống Yêu cầu hệ thống
4.1.1.
Chạy trên nền web hỗ trợ các trình duyệt của Smartphone nhƣ: chrome, safari, opera.
Các yêu cầu về cài đặt
4.1.2.
4.1.2.1. Node.js
Phiên bản cài đặt cho ứng dụng là 0.8.18.
Có thể tải trực tiếp Node.js từ trang chủ: http://nodejs.org, trƣớc hết ta phải cài đặt gói dependencies:
$ sudo apt-get install g++ curl libssl-dev apache2- utils
Sau đó thực hiện các lệnh:
$ cd <thư mục chứa node> $ ./configure
$ make
$ sudo make install
Sau khi hoàn tất quá trình cài đặt chúng ta có thể kiểm tra xem Node.js đã đƣợc cài đặt hay chƣa bằng lệnh $ node, nếu xuất hiện con trỏ chuột phía sau ký tự „>‟ thì Node.js đã đƣợc cài đặt thành công.
4.1.2.2. Module dependencies
Để chạy đƣợc server chúng ta tiến hành cài đặt các dependencies của ứng dụng đƣợc liệt kê trong file package.json
"dependencies": {
"express": "3.1.0", "jade": "*",
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 58 "crypto": "0.0.3", "async": "0.2.6", "connect": "2.7.7", "cookie": "0.1.0", }
Sử dụng NPM (Node Package Manager) chúng ta có thể dễ dàng cài đặt:
$ sudo npm install
Sau khi cài đặt thành công các dependencies ta có thể chạy server Node.js bằng lệnh sau:
$ node app
Hình 4.1. Thông báo thành công khi chạy Node.js server
4.1.2.3. Node-mysql
Tại file app.js ta khai báo cơ sở dữ liệu nhƣ sau:
var connection = mysql.createConnection({ hostname : 'localhost',
user: 'root',
password : 'honganhtran288', database: 'mydb'
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 59
Xây dựng server
4.1.3.
4.1.3.1. Tìm hiểu mô hình MVC
Mô hình MVC (Model - View - Controller) là một kiến trúc phần mềm hay mô hình thiết kế đƣợc sử dụng trong kỹ thuật phần mềm. Nó giúp cho các phát triển phần mềm tách ứng dụng của họ ra 3 thành phần khác nhau Model, View và Controller.Mỗi thành phần có một nhiệm vụ riêng biệt và độc lập với các thành phần khác.
o Model
Đây là thành phần chứa tất cả các nghiệp vụ logic, phƣơng thức xử lý, truy xuất database, đối tƣợng mô tả dữ liệu nhƣ các Class, hàm xử lý...
o View
Đảm nhận việc hiển thị thông tin, tƣơng tác với ngƣời dùng, nơi chứa tất cả các đối tƣợng GUI nhƣ textbox, images...Hiểu một cách đơn giản, nó là tập hợp các form hoặc các file HTML.
o Controller
Giữ nhiệm vụ nhận điều hƣớng các yêu cầu từ ngƣời dùng và gọi đúng những phƣơng thức xử lý chúng... Chẳng hạn thành phần này sẽ nhận request từ url và form để thao tác trực tiếp với Model.
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 60
Giải thích mô hình MVC:
Server nhận yêu cầu HTTP Request, định tuyến yêu cầu đến một Entry point.Tại Entry point, Front Controller phân tích yêu cầu và dựa vào yếu cầu đó để gọi một hành động tƣơng ứng với Controller và quá trình này đƣợc gọi là routing.Từ Controller gọi đến Model, Model sẽ lƣu data đƣợc gửi và tƣơng tác với Data Source (database hoặc API).Sau khi hoàn thành sẽ trả data đến Controller, Controller sẽ đi đến một View riêng biệt, cuối cùng trả về một HTTP Responsive cho trình duyệt.
4.1.3.2. Xây dựng server bằng module express
Để xây dựng server ta cần thực hiện những công việc nhƣ sau: Cài đặt module Express của NodeJs
Khởi tạo server nhƣ sau:
var express = require('express'); var app = express();
app.get('/index', function(req, res) { res.render(„index‟, {name:name}]); }); app.listen(3000); console.log('Listening on port 3000...'); Để chạy server ta gõ lệnh $ node server.js
Sau đó vào trình duyệt gõ http://localhost:3000.
Xây dựng các chức năng phía client
4.1.4.
4.1.4.1. Thiết kế trang chủ và menu
o Trang chủ
Trang chủ đƣợc thiết kế đơn giản và dễ sử dụng, các chức năng chính đƣợc hiển thị trực tiếp thông qua các icon, ngƣời dùng có thể dễ dàng chạm vào cái icon dể đi đến nội dung tƣơng ứng.
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 61
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 62 o Menu
Để tiết kiệm khung nhìn, menu đƣợc thiết kế theo danh sách dọc và đƣợc ẩn phía trong, chỉ cần vuốt nhẹ tay sang phải sẽ xuất hiện ra menu.
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 63
4.1.4.2. Giới thiệu
Chức năng này tập trung giới thiệu về các địa điểm tham quan, sự kiện diễn ra hằng năm, các quán ăn nhà hàng nổi tiếng, các món đặc sản, những cây cầu nổi tiếng. Với hình ảnh sinh động, sắc nét, nội dung mô tả lý thú chi tiết sẽ đem lại cho ngƣời dùng khoảng khắc trải nghiệm thú vị cùng với chiếc Smartphone trên tay.
Các danh mục trong phần giới thiệu đƣợc hiển thị theo danh sách,ở mỗi danh mục sẽ có các icon tƣợng trƣng cho danh mục đó.
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 64
Nội dung của phần giới thiệu cũng đƣợc hiển thị theo danh sách, bao gồm hình ảnh tƣợng trƣng và tên của từng địa điểm, sự kiện, cửa hàng, khách sạn,... đƣợc hiển thị nhƣ hình sau:
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 65
Thông tin chi tiết về từng địa điểm, sự kiện sẽ đƣợc hiển thị trong phần chi tiết, bố cục bao gồm: hình ảnh về địa danh, sự kiện đó, và thông tin chi tiết. Nhƣ hình sau:
SVTH: Trần Thị Hồng Ánh – Lớp 09CNTT2 66
4.1.4.3. Địa điểm
Sử dụng Google Maps để xây dựng chức năng này, mỗi ngƣời dùng sẽ đƣợc cấp một Key từ nhà phát triển Google Maps
Để sử dụng bản đồ của Google Maps ta liên kết tới đƣờng dẫn đoạn JavaScript sau:
<script(type='text/javascript',src='https://maps.googleapi
s.com/maps/api/js?key=AIzaSyC5co2U4HkUx5yP0XIBYBatLsRMdxPy
bKQ&sensor=true') />
o Key chính là khóa mà Google Maps cung cấp cho mỗi ngƣời dùng. Để tải bản đồ lên trang web ta viết hàm JavaScript sau:
var map;
function initialize() { var mapOptions = {
zoom: 8,
center: new google.maps.LatLng(-34.397, 150.644), mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById ('map-canvas'), mapOptions);
}