Tải bản đầy đủ (.pdf) (43 trang)

Đồ án 5 xây dựng website xem phim

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (1.67 MB, 43 trang )

<span class="text_page_counter">Trang 1</span><div class="page_container" data-page="1">

BỘ GIÁO DỤC VÀ ĐÀO TẠO

TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT HƯNG YÊN

</div><span class="text_page_counter">Trang 2</span><div class="page_container" data-page="2">

NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN

</div><span class="text_page_counter">Trang 3</span><div class="page_container" data-page="3">

1.1. Giới thiệu đề tài... 6

Mô tả hệ thống hiện tại...6

1.3.2. Phân tích thiết kế bài tốn...12

Chương 2. Phân tích và thiết kế hệ thống...14

Phân tích các chức năng...14

Phân tích yêu cầu...14

Xác định các tác nhân...14

2.2.1 Biểu đồ usecase tổng quát...20

1.1. 2.2.2 Biểu đồ use-case tìm kiếm...21

1.2. 2.2.3.Biểu đồ use-case đăng nhập...21

1.3. 2.2.4.Biểu đồ use-case quản lý phim...22

1.4. 2.2.5.Biểu đồ use-case quản lý thành viên...23

2.3. Biểu đồ lớp...23

2.3.1. Xác định các lớp...24

2.4. Biều đồ tuần tự...25

2.4.9. Biểu đồ tuần tự cho chức năng “Thêm User”...27

2.4.10. Biểu đồ tuần tự cho chức năng “Sửa User”...28

2.4.11. Biểu đồ tuần tự cho chức năng “Xóa User”...28

Chương 3. Thiết kế cơ sở dữ liệu cho hệ thống...28 3

</div><span class="text_page_counter">Trang 4</span><div class="page_container" data-page="4">

3.1. Các bảng dữ liệu...28

3.2. Biểu đồ cơ sở dữ liệu...32

Chương 4: Giao diện Website...36

4.1. Giao điện Trang chủ...36

4.2. Giao diện trang Chi tiết Phim...37

4.3. Giao điện trang Đăng Nhập Người Dùng...40

4.4. Giao diện trang Admin...40

PHẦN 3: Kết Luận...43

1. Kết quả đạt được...43

</div><span class="text_page_counter">Trang 5</span><div class="page_container" data-page="5">

DANH MỤC CÁC KÝ TỰ, CÁC TỪ VIẾT TẮT

5

</div><span class="text_page_counter">Trang 6</span><div class="page_container" data-page="6">

PHẦN 1: NỘI DUNG

Chương 1: Tổng quan 1.1. Giới thiệu đề tài

<small>Hiện nay, nước ta đang trong q trình cơng nghiệp hóa hiện đại hóa, cuộcsống con người ngày càng nâng cao.Chính vì vậy, nhu cầu về giải trí cũng ngàycàng cao với đại bộ phận người dân. Với sự phát triển của Internet, những Websitexem phim ra đời nhằm đáp ứng nhu cầu ngày càng lớn về giải trí.</small>

<small>NhâAn th Āy nhu cầu xem phim online ngày càng phổ biến, em xây dựng websitexem phim online để thỏa mãn nhu cầu xem phim, giải trí sau nhưng giờ làm việc mệtmỏi.</small>

<small>Mô tả hệ thống hiện tại</small>

<small>Hoạt động website xem phim OneMovies có thể mơ tả như sau:</small>

<small>● Trên giao diện trang chủ, phim được chia theo một số loại để người dùng dễdàng chọn lựa theo các tiêu chí như phim mới cập nhật, phim nổi bật và phimnhiều lượt xem</small>

<small>● Người dùng có thể tìm kiếm trực tiếp bộ phim mong muốn ngay tại trang chủthông qua ô Search ở phía trên của Website.</small>

<small>● Bộ phim bao gồm những thông tin: Tên phim, tác giả, năm sản xu Āt, ngàyphát hành, điểm IMDb(I</small>MDb chính viết tắt của cụm từ Internet Movielà Database (Cơ ở dữ liệu điện ảnh trên Internet), đây được xem thư viện điệnlà ảnh, nơi cung cấp những thông tin về bộ phim, diễn viên, đạo diễn và những chủ đề điện ảnh, truyền hình và video game. IMDb nổi bật hơn cả nơi để phêlà bình, xếp hạng phim.<small>).</small>

<small>● Khi khách hàng chọn một bộ phim trong website sẽ được chuyển hướng vàoview xem phim có các thơng tin như trình chiếu phim, nội dung, lượt xem vàcác tính năng mở rộng khi người dùng đăng nhập.(Trong trạng thái đã đăngnhập)</small>

<small>● Khi khách hàng chọn một bộ phim trong website sẽ được chuyển hướng vàoview xem phim có các thơng tin như trình chiếu phim, nội dung, lượt xem ( Khikhông trong trạng thái đăng nhập).</small>

</div><span class="text_page_counter">Trang 7</span><div class="page_container" data-page="7">

<small>● Người dùng có thể bình luận qua Facebook tools để comment trực tiếp trênWebsite hoặc tương tác với Fanpage thông qua Live Chat của Facebook đểngười quản trị nhanh chóng tiếp nhận được thơng tin của người dùng.</small>

<small>1.1.2 Tổng quan về hệ thống mới </small>

<small>Giao diện website thiết kế hợp lý, dễ nhìn và thân thiện với người dùng.Có các tính năng mở rộng cho người dùng sử dụng một các dễ dàngTrang quản trị có những chức năng: quản lí phim, quản lí thành viên,…1.1.3. Các mục tiêu chính của hệ thống</small>

<small>Yêu cầu về mặt giao diện:</small>

<small>-Giao diện trang web thân thiện, dễ sử dụng, phân chia trên các thể loạikhác nhau</small>

<small>-Hiển thị định dạng cho các Browser phổ biến hiện nay như FireFox,Chrome, Brave…</small>

<small>-Tông màu chính trên Website là màu trắng mang lại trải nghệm tốt chongười dùng, dễ dàng tuỳ biến được màu nền, màu chữ của Website.-Thay đổi phim, banner,thể loại,.. một cách dễ dàng với tư cách của một</small>

<small>quản trị viên Web.</small>

<small>-Giao diện có tuỳ biến cho các nên tảng như Window, IOS, AndroidYêu cầu về mặt chức năng:</small>

<small>+ Quản lí phim : Chức năng thêm, sửa, xố các thơng tin của bộ phim. + Quản lý thể loại: Chức năng thêm, sửa, xố các thơng tin thể loại của bộ phim. + Chức năng tìm kiếm phim.</small>

<small>-Chức năng tìm kiếm người dùng thơng qua ơ Search ở phía trên cùng của</small>

</div><span class="text_page_counter">Trang 8</span><div class="page_container" data-page="8">

- Hiển thị danh sách tất cả các bộ phim được thêm và phân trang để dễ quản lý.

- Người quản trị có thể tắt bật trạng thái hiển thị của bộ phim một dễ dàng thơng qua nút “Kích hoạt” ở ngồi danh sách.

- Người quản trị có thể khố tạm thời tài khoản của người dùng một dễ dàng thơng qua nút “Kích hoạt” ở ngoài danh sách.

- Hiển thị danh sách tất cả các thể loại và phân trang để dễ quản lý. - Người quản trị có thể tắt bật trạng thái hiển thị của thể loại một dễ

dàng thông qua nút “Kích hoạt” ở ngồi danh sách.

</div><span class="text_page_counter">Trang 9</span><div class="page_container" data-page="9">

- Cập nhật thông tin của thể loại thông qua Partial View và Ajax, dễ

- Người quản trị có thể tắt bật trạng thái hiển thị của quảng cáo một dễ dàng thơng qua nút “Kích hoạt” ở ngồi danh sách.

- Hiển thị danh sách tất cả các Slide và phân trang để dễ quản lý. - Người quản trị có thể tắt bật trạng thái hiển thị của Slide một dễ

dàng thơng qua nút “Kích hoạt” ở ngồi danh sách.

- Hiển thị danh sách tất cả liên hệ và phân trang để dễ quản lý. - Người quản trị có thể tắt bật trạng thái hiển thị của liên hệ một dễ

dàng thơng qua nút “Kích hoạt” ở ngồi danh sách.

Xóa

- Quản trị viên xóa liên hệ ngay trên danh sách phim.

9

</div><span class="text_page_counter">Trang 10</span><div class="page_container" data-page="10">

- Hiển thị danh sách tất cả các quốc gia và phân trang để dễ quản lý. - Người quản trị có thể tắt bật trạng thái hiển thị của quốc gia một dễ

dàng thơng qua nút “Kích hoạt” ở ngồi danh sách.

- Hiển thị danh sách tất cả các tin tức và phân trang để dễ quản lý. - Người quản trị có thể tắt bật trạng thái hiển thị của tin tức một dễ

dàng thơng qua nút “Kích hoạt” ở ngồi danh sách.

Hệ thống Website Xem Phim Online OneMovies

1. Phải xác định rõ dữ liệu đầu vào, đầu ra, và quy trình xử lý. 2. Với mỗi yêu cầu phức tạp, quy trình xử lý cần được minh hoạ bằng

lưu đồ giải thuật.

</div><span class="text_page_counter">Trang 11</span><div class="page_container" data-page="11">

3. Hệ thống phải được lập trình trên nền tảng Visual Studio và SQL server.

4. Ngơn ngữ lập trình C#, ASP.NET MVC 5 1.2.1. Danh sách các yêu cầu trên trang hiển thị

1. Đăng ký

Cho phép người dùng đăng ký tài khoản mới để trở thành thành viên. Thông tin đăng ký bao gồm: Họ và Tên, UserName, PassWord, Địa Chỉ, Số điện thoại, Email(Email là bắt buộc nhập)

Người dùng sẽ phải xác nhận mã captcha khi đăng kí để tránh spammer hay Ddos Website.

Khi người dùng nhập đầy đủ thông tin hợp lệ, nhập chính xác mã captcha và ấn đăng ký. Hệ thống sẽ trả ra những thông báo cho người dùng như : Tên người dùng đã tồn tại, mật khẩu phải 6 ký tự trở lên, Email đã được sử dụng, mã captcha khơng chính xác,.. u cầu người dùng nhập lại thông tin.

Hiển thị menu đa cấp ngay phần đầu của Website bao gồm: Trang chủ, Tin Tức , Thể loại, Quốc Gia, Liên Hệ , Giới Thiệu.

4. Bố cục Trang chủ

Phim được chia theo từng tiêu chí như : phim mới: Dựa theo ngày được thêm.

phim nổi bật: ( Được xếp theo điểm Rate IMDb, giảm dần và theo ngày được thêm.

phim phổ biến: Được xếp theo lượt xem, giảm dần và theo ngày thêm.

5. Chức năng tìm kiếm phim

Người dùng có thể tìm kiếm các bộ phim bằng tên bộ phim, thể loại phim

11

</div><span class="text_page_counter">Trang 12</span><div class="page_container" data-page="12">

Kết quả tìm kiếm sẽ được hiển thị sang trang tìm kiếm cho người dùng dễ thao tác. Trả ra một thơng báo khi khơng tìm thấy phim của người dùng.

1.3. Phương pháp nghiên cứ và hướng giải quyết vấn đề 1.3.1. Công nghệ sử dụng

1.3.1.1. Ngơn ngữ lập trình

Có rất nhiều cơng nghệ có thể được sử dụng để xây dựng hệ thống phần mềm.Trong khóa luận này để cài đặt chương trình chúng em đã sử dụng ngơn ngữ lập trình C# và mơ hình MVC.

Cơng nghệ sử dụng

SQL Server 2012 là một hệ thống quản trị cơ sở dữ liệu quan hệ (Relational Database Management System (RDBMS) ) sử dụng Transact-SQL để trao đổi dữ liệu giữa Client computer và SQL Server computer. Một RDBMS bao gồm databases, database engine và các ứng dụng dùng để quản lý dữ liệu và các bộ phận khác nhau trong RDBMS

.

1.3.2. Phân tích thiết kế bài tốn

Có nhiều cách để giải quyết vấn đề.Nhưng ở đây, chúng em chọn phân tích-thiết kế hệ thống bằng ngôn ngữ UML – Unified Modeling Language để giải quyết vấn đề đặt ra. Gồm các bước sau:

Mơ hình hóa nghiệp vụ:

Dựa trên q trình khảo sát thực trạng, chúng em sử dụng công cụ Visual Paradigm thiết kế UML để mơ hình hóa chức năng.

Phân tích:

Phân tích để đưa ra những mơ hình tổng qt quan sát trạng thái tĩnh của các chức năng, quy trình của mỗi chức năng và các Actor (tác nhân).

Thiết kế:

</div><span class="text_page_counter">Trang 13</span><div class="page_container" data-page="13">

Từ kết quả ở mức phân tích, triển khai thiết kế để đạt được các kết quả sau: Thiết kế cơ sở dữ liệu: SQL SERVER

Thiết kế ứng dụng: Sử dụng ngôn ngữ C# , Mô hình MVC và HTML – CSS để thiết kế giao diện và thực hiện chức năng.

Cài đặt

Thực hiện cài đặt các kết quả đã thiết kế trên Visual Studio.NET 2017 và hệ quản trị cơ sở dữ liệu SQL server 2012.

Thử nghiệm

Chạy chương trình nhiều lần trên hệ điều hành Windows 10 Pro. Test lỗi và hoàn thiện các chức năng của hệ thống.

13

</div><span class="text_page_counter">Trang 14</span><div class="page_container" data-page="14">

Chương 2. Phân tích và thiết kế hệ thống

Phân tích các chức năng Phân tích yêu cầu

Xác định các tác nhân

Qua khảo sát hiện trạng thực tế, kết hợp với việc tham khảo tài liệu và phân tích ý kiến của người dùng, hệ thống có các tác nhân sau:

BẢNG 1: Xác định tác nhân

Những người thuộc nhóm quyền này có quyền truy xuất những chức năng của hệ thống có nhiệm vụ bảo trì hệ thống: đăng nhập đổi mật khẩu; thay đổi thông tin cá nhân, quản lý nhóm người dùng; quản lý người dùng, sao, lưu phục hồi dữ liệu; quản lý phim, bài viết đánh giá về chi tiết phim, liên kết nguồn phim; quản lý quảng cáo; thống kê truy cập , thống kê lượt xem phim trong tháng.Họ có thể phân quyền

viên, quảng cáo, liên hệ, …

</div><span class="text_page_counter">Trang 15</span><div class="page_container" data-page="15">

6 Người dùng Xem trailer, phim.

Người dùng Phản hồi, báo cáo ( only login)

<small> BẢNG 2:Xác định các ca sử dụng (Usecase)</small>

2.1.1.3. Tổng quan về UML

UML (Unified Model Language) là một ngôn ngữ dùng cho phân tích thiết kế hướng đối tượng (OOAD – Object Oriented Analys and Design) UML được duy trì và phát triển bởi OMG (Object Management Group),

do Jacobson, Booch, Rumbaugh sáng lập. Ngồi ra cịn có hàng trăm các tập đồn lớn khác bảo trợ phát triển.

Các biểu đồ UML cho ta cái nhìn rõ hơn về hệ thống (cái nhìn tĩnh và động)

Hiện nay UML được sử dụng rất phổ biến trong các dự án phần mềm. UML thể hiện phương pháp phân tích hướng đối tượng nên khơng lệ

thuộc ngơn ngữ lập trình.

Có rất nhiều cơng cụ phần mềm hỗ trợ phân tích thiết kế dùng UML. Nhiều cơng cụ có thể sinh ra mã từ UML và ngược lại.

UML khơng phải là ngơn ngữ lập trình. UML là một ngơn ngữ dùng để: - Trực quan hóa (Visualizing):

+ Dùng tập các ký hiệu đồ họa phong phú để biểu diễn hệ thống đang được nghiên cứu.

+ Hệ thống ký hiệu đều có ngữ nghĩa chặt chẽ, có thể hiểu bởi nhiều

</div><span class="text_page_counter">Trang 16</span><div class="page_container" data-page="16">

+ UML giúp xây dựng các mơ hình chính xác, đầy đủ và khơng nhập nhằng.

+ Tất cả các công đoạn từ phân tích, thiết kế cho đến triển khai đều có các biểu đồ UML biểu diễn.

+ Use case (dùng cho phân tích); Class, Sequence, Activity... (cho thiết kế); Component, Deployment (cho triển khai).

- Xây dựng (Constructing):

+ Các mơ hình của UML có thể kết nối với nhiều ngơn ngữ lập trình. Tức là có thể ánh xạ các mơ hình UML về một ngơn ngữ lập trình như C+ +, Java...

+ Việc chuyển các mơ hình trong UML thành Code trong ngơn ngữ lập trình Forward engineering

+ Việc chuyển ngược trở lại code trong một ngơn ngữ lập trình thành UML Reverse Engineering.

+ Cần công cụ để chuyển đổi “xuôi” & “ngược” - Viết tài liệu (Documenting):

+ Giúp xây dựng tài liệu đặc tả - requirements + Tài liệu kiến trúc (architecture)

+ Tài liệu thiết kế + Source code

+ Tài liệu để kiểm thử - Test + Tài liệu mẫu - Prototype

+ Tài liệu triển khai – Deployment ... Một số biểu đồ UML cơ bản

Biểu đồ Ca sử dụng Use Case Diagram

- Use case (Use Case Diagram) cung cấp một bức tranh toàn cảnh về những gì đang xảy ra trong hệ thống hiện tại hoặc những gì sẽ xảy ra trong hệ thống mới.

</div><span class="text_page_counter">Trang 17</span><div class="page_container" data-page="17">

- Use case mô tả một chuỗi các hành động mà hệ thống sẽ thực hiện để đạt được kết quả có ý nghĩa đối với một tác nhân.

- Các use case được tạo ra ở giai đoạn đầu của một dự án. Các use case cũng có thể được dung ở giai đoạn sau của qui trình phát triển dự án, ví dụ để đặc tả các tình huống kiểm tra. Use case đưa ra cơ sở để xác định giao tiếp người-máy đối với hệ thống. Để người dùng cuối có thể hiểu được và có thể giao tiếp với hệ thống ở mức tổng thể.

- Actor là người hoặc hệ thống tương tác với các use case. Thường actor là người dùng hệ thống. Trong biểu đồ use case, mỗi actor được vẽ bằng một biểu tượng hình người với tên vai trò (role name) đặt bên dưới.

- Khi actor là người thì tên actor là tên vai trị mà actor đảm nhiệm chứ không phải là tên công việc.

Biểu đồ lớp Class Diagram

- Biểu đồ lớp (Class Diagram) cho ta một khung nhìn tĩnh của các lớp trong mơ hình hoặc một phần của mơ hình. Nó chỉ cho ta thấy các thuộc tính và các thao tác của lớp, cũng như các loại quan hệ giữa các lớp.

- Có rất nhiều kiểu lớp dùng trong biểu đồ lớp, ở đây chúng ta chỉ xét đến và sử dụng 3 loại lớp chính là : lớp biên (phần giao diện), lớp điều khiển và lớp cơ sở dữ liệu:

+ Lớp biên: là lớp thể hiện phần giao diện mà người dùng trực tiếp tương tác với hệ thống qua những giao diện của lớp này.

+ Lớp thực thể (lớp cơ sở dữ liệu): là lớp biểu diễn cho những thực thể có mối quan hệ với nhau và liên quan đến hệ thống.

+ Lớp điều khiển: là lớp trung gian giữa lớp biên và lớp thực thể. Lớp này đóng vai trò lấy và xử lý dữ liệu để hiện thị ra lớp biên. Biểu đồ tuần tựSequence Diagram

Biểu đồ tuần tự (Sequence Diagram) mô tả sự tương tác của các đối tượng theo trình tự về thời gian.Có sự liên kết chặt chẽ với biểu đồ lớp và mô tả thứ tự

17

</div><span class="text_page_counter">Trang 18</span><div class="page_container" data-page="18">

của tương tác bằng cách đánh số thứ tự các thông điệp. Mỗi biểu đồ tuần tự mơ tả một tình huống xử lý.

2.1.1.4 Các ký hiệu:

Biểu diễn các Actor (tác nhân) biểu diễn người hay hệ thống khác tương tác với hệ thống hiện tại.

Biểu diễn các Use Case (tình huống sử dụng) biểu diễn chuỗi hành động mà hệ thống thực hiện.

Biểu diễn mối quan hệ giữa Actor (người dùng) và UseCase (chức năng của hệ thống)

Quan hệ <<Include>> thể hiện Use Case này chứa Use Case khác.

Use case A được gọi là Include B nếu trong xử lý của A có gọi đến B ít nhất 1 lần.

Quan hệ <<Extend>> thể hiện User Case này mở rộng Use Case khác.

Use case B được gọi là Exntend A nếu use case B được gọi bởi A nếu thỏa mãn điều kiện nào đó.

</div><span class="text_page_counter">Trang 19</span><div class="page_container" data-page="19">

Quan hệ tổng quát hóa (thừa kế): Use case A được gọi là Generalization Use Case B nếu Use Case B là một trường hợp riêng của Use vi (Behavior) của đối tượng.

Quan hệ Generalization: Thể hiện rằng một lớp A kế thừa từ một lớp B (Hay Class A là trường hợp riêng của Class B; Class B là tổng quát của Class A). Gọi là quan hệLà một Is a ( )

Quan hệ Composition:

Thể hiện rằng một lớp A bao hàm lớp B. Nhưng lớp B không thể tồn tại độc lập (tức khơng thuộc lớp nào). Tức là, nếu có B thì phải suy ra được A. Biểu đồ tuần tự:

- Mô tả sự tương tác của các đối tượng theo trình tự về thời gian.

- Có sự liên kết chặt chẽ với biểu đồ lớp.

19

</div><span class="text_page_counter">Trang 20</span><div class="page_container" data-page="20">

- Mỗi biểu đồ tuần tự mơ tả một tình huống xử lý nhất định.

Biểu diễn mô tả các ký hiệu <small>USECASE</small>

2.2.1 Biểu đồ usecase tổng quát

Biểu đồ use-case tổng quát 1.1. 2.2.2 Biểu đồ use-case tìm kiếm

</div><span class="text_page_counter">Trang 21</span><div class="page_container" data-page="21">

Biểu đồ use-case tìm kiếm

Mơ tả:

Khi người dùng muốn sử dụng chức năng tìm kiếm thì phải nhập thơng tin cần tìm kiếm vào ơ tìm kiếm, hệ thống sẽ kiểm tra thơng tin mà người dùng nhập vào.Nếu thông tin khách hàng nhập vào tồn tại thì hệ thống sẽ hiển thị ra kết quả cịn nếu khơng tồn tại thị hệ thống sẽ không hiển thị ra kết quả và trả ra một thơng báo “Khơng tìm thấy bộ phim với từ khoá…”

1.2. 2.2.3.Biểu đồ use-case đăng nhập

Biểu đồ use-case đăng nhập

Mô tả:

Khi người quản trị truy cập vào trang quản trị thì phải nhập tài khoản và mật khẩu để có thể tiếp tục truy cập. Nếu admin nhập đúng tài khoản thì hệ thống sẽ trả ra thơng báo đăng nhập thành cơng.

Người dùng đăng nhập phải nhập chính xác những thơng tin đăng nhập. Nếu khơng chính xác, hệ thống sẽ thông báo lỗi cho người dùng và yêu cầu nhập lại thông tin.

21

</div>

×