1. Trang chủ
  2. » Giáo Dục - Đào Tạo

BÁO CÁO BÀI TẬP LỚN MÔN HỌC MẠNG CẢM BIẾN ĐỀ TÀI Nghiên cứu và xây dựng demo giao diện IoT (dashboard) đơn giản cho theo dõi ánh sáng

55 5 0

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Tiêu đề Nghiên cứu và xây dựng demo giao diện IoT (dashboard) đơn giản cho theo dõi ánh sáng
Tác giả Nguyễn Văn Hùng, Dương Quang Huy, Mai Văn Huy, Mai Việt Hưng
Người hướng dẫn Trần Thị Thanh Thủy
Trường học Học viện Công nghệ Bưu chính Viễn thông
Chuyên ngành Mạng cảm biến
Thể loại báo cáo bài tập lớn
Định dạng
Số trang 55
Dung lượng 2,15 MB

Nội dung

Mạng cảm biến không chỉ có ứng dụng rộng rãi trong các lĩnh vực như theo dõimôi trường, y tế, và công nghiệp, mà còn là một phần quan trọng của Internet of ThingsIoT.. Các thiết bị IoT c

Trang 1

HỌC VIỆN CÔNG NGHỆ BƯU CHÍNH VIỄN THÔNG

KHOA KỸ THUẬT ĐIỆN TỬ I

BÁO CÁO BÀI TẬP LỚN MÔN HỌC MẠNG CẢM BIẾN

ĐỀ TÀI : Nghiên cứu và xây dựng demo giao diện IoT (dashboard)

đơn giản cho theo dõi ánh sáng.

Dương Quang Huy - B20DCDT084 Mai Văn Huy - B20DCDT085 Mai Việt Hưng - B20DCDT095

Trang 2

LỜI MỞ ĐẦU

Mạng cảm biến đang trở thành một phần quan trọng trong hệ thống thông tin hiệnđại, cho phép thu thập dữ liệu từ môi trường xung quanh và chuyển chúng về một trung tâmđiều khiển Mạng cảm biến không chỉ có ứng dụng rộng rãi trong các lĩnh vực như theo dõimôi trường, y tế, và công nghiệp, mà còn là một phần quan trọng của Internet of Things(IoT) Trong báo cáo này, chúng em sẽ trình bày về mạng cảm biến, cung cấp một cái nhìntổng quan về cách nó hoạt động, ứng dụng phổ biến, và thách thức liên quan

Mục tiêu của báo cáo này là giúp bạn hiểu rõ hơn về mạng cảm biến, cách chúng cóthể làm cho cuộc sống của chúng ta tiện lợi hơn và tạo ra những cơ hội mới trong việc thuthập và phân tích dữ liệu Chúng em sẽ đi sâu vào các khái niệm cơ bản và kỹ thuật liênquan đến mạng cảm biến, cung cấp ví dụ cụ thể về ứng dụng thực tế, và thảo luận về nhữngthách thức mà người ta đang phải đối mặt khi triển khai và quản lý mạng cảm biến

Trang 3

MỤC LỤC

LỜI MỞ ĐẦU 2

MỤC LỤC 3

DANH SÁCH ẢNH VÀ BẢNG BIỂU 7

CHƯƠNG 1: TỔNG QUAN VỀ IOT, MẠNG CẢM BIẾN VÀ WEBSITE.8 1 Giới thiệu chung về IOT 8

1.1 Khái niệm về IOT 8

1.2 Cấu trúc của một hệ thống IoT 8

2 Giới thiệu chung về mạng cảm biến 9

2.1 Khái niệm về mạng cảm biến 9

2.2 Vai trò của mạng cảm biến 10

2.3 Cấu trúc của mạng cảm biến không dây 11

2.4 Đặc điểm của mạng cảm biến không dây 13

2.5 Ứng dụng mạng cảm biến trong quân sự 13

2.6 Ứng dụng trong môi trường và ngành nông nghiệp 14

3 Giới thiệu chung về website và giao diện website 14

3.1 Khái niệm giao diện website 14

3.2 Các thành phần cấu thành của một giao diện web 15

3.3 Giới thiệu chung về Website 15

3.4 Các thành phần của một website 15

4 Ngôn ngữ lập trình PHP , Javascrip 17

4.1 Tổng quan về ngôn ngữ PHP 17

4.2 Ứng dụng của PHP: 17

4.3 Ưu nhược điểm của PHP 18

4.4 Tổng quan về ngôn ngữ lập trình Javascrip 19

Trang 4

4.5 Công dụng của javascrip 19

4.6 Ưu nhược điểm của Javascrip 19

CHƯƠNG 2: CƠ SỞ LÝ THUYẾT GIAO DIỆN 21

1 Giới thiệu chung về ESP32 21

1.1 Tổng quan về ESP32 21

1.2 Cấu hình ESP32 22

1.3 Sơ đồ chân ESP32 23

2 Giới thiệu Relay 1 kênh 5V 24

2.1 Thông số kỹ thuật 24

3 Giới thiệu cảm biến ánh sáng 25

3.1 Khái niệm 25

3.2 Nguyên lí hoạt động 25

3.3 Ứng dụng cảm biến ánh sáng trong đời sống 26

3.4 Cảm biến ánh sáng BH1750 26

3.5 Cấu hình chân BH1750 26

3.6 Tính năng của BH1750 27

3.7 Ứng dụng BH1750 27

4 Giao thức http,html, CSS 28

4.1 Giới thiệu HTTP 28

4.2 Khía cạnh của HTTP: 28

4.2.1 HTTP đơn giản: 28

4.2.2 HTTP có thể mở rộng: 28

4.2.3 HTTP là stateless nhưng không sessionless: 28

4.3 Giới thiệu HTML 29

4.4 Giới thiệu CSS 29

Trang 5

5 Tìm hiểu chung về Xampp 30

5.1 Tổng quan Xampp 30

6 Tìm hiểu chung về MQTT 30

6.1 Tổng quan về MQTT 30

6.2 Ưu điểm đáng chú ý của MQTT: 31

7 Cơ sở dữ liệu My SQL 32

7.1 Giới thiệu MySQL 32

7.2 Cơ chế hoạt động của MySQL 32

7.3 Lý do sử dụng MySQL: 32

CHƯƠNG 3: XÂY DỰNG MỘT GIAO DIỆN IOT(DASHBOARD) ĐƠN GIẢN THEO DÕI ÁNH SÁNG 33

1 Xây dựng phần cứng 33

1.1 Các linh kiện cần dùng 33

1.2 Sơ đồ mạch 33

1.2.1 Sơ đồ mạch 33

1.2.2 Cách cắm dây 33

2 Xây dựng phần mềm 34

2.1 Luồng đi của project 34

2.1.1 Thiết kế giao diện theo cấu trúc 34

2.1.2 Giải thích hướng đi 34

2.2 Code và chức năng từng phần 35

2.2.1 Code ESP32 để nhận dữ liệu từ cảm biến và gửi dữ liệu đó lên Server qua thư viện WIFI 35

2.2.2 Quản lý package(thư viện) sử dụng trong project 40

2.2.3 Khởi tạo cơ sở dữ liệu bằng file database.sql 40

2.2.4 Kết nối MQTT Broker và xử lí gói sin Subcribe 41

Trang 6

2.2.5 Tạo HTTP sever để giao tiếp với website 44

2.2.6 Tạo giao diện cho project 45

3 Kết quả hiện thị 54

4 Kết luận chương 54

TÀI LIỆU THAM KHẢO 56

Trang 7

DANH SÁCH ẢNH VÀ BẢNG BIỂU

Hình 1 Mô hình mạng cảm biến 11

Hình 2: Cấu trúc cơ bản của mạng cảm biến không dây 13

Hình 3: Các thành phần của nút cảm biến 14

Hình 4: Ứng dụng mạng cảm biến trong quân sự 15

Hình 5: Ứng dụng mạng cảm biến trong nông nghiệp 16

Hình 6: Module ESP32 23

Hình 7:Sơ đồ khối cấu trúc ESP32 24

Hình 8: : Sơ đồ chân ESP32 devkit 25

Hình 9: Hình modun Relay 5V 1 kênh 26

Bảng 1:Thông số kĩ thuật của Module Relay 26

Hình 10: Một số cảm biến ánh sáng 27

Hình 11: Các chân của cảm biến ánh sáng BH1750 28

Bảng 2:Sơ đồ chân cảm biến BH1750 28

Hình 12: Cơ chế hoạt động của MySQL 34

Hình 13: Hình ảnh mô phỏng 35

Hình 14: Hình ảnh luồng đi của project 36

Hình 17: Hình ảnh hiện giá trí cường độ sáng, công tăc bật tắt bóng đèn 56 Hình 16: Hình ảnh giao diện quản lí cường độ sáng 56

Trang 8

CHƯƠNG 1: TỔNG QUAN VỀ IOT, MẠNG CẢM BIẾN VÀ

WEBSITE Giới thiệu chung về IOT

Khái niệm về IOT

IoT (Internet of Things) nghĩa là Internet vạn vật Là mạng kết nối các đồ vật và thiết

bị thông qua cảm biến, phần mềm và các công nghệ khác, cho phép các đồ vật và thiết bịthu thập và trao đổi dữ liệu với nhau

Internet vạn vật lan tỏa lợi ích của mạng internet tới mọi đồ vật được kết nối, chứkhông chỉ dừng lại ở phạm vi một chiếc máy tính Khi một đồ vật được kết nối với internet,

nó sẽ trở nên thông minh hơn nhờ khả năng gửi hoặc nhận thông tin và tự động hoạt độngdựa trên các thông tin đó

Các thiết bị IoT có thể là đồ vật được gắn thêm cảm biến để thu thập dữ liệu về môitrường xung quanh (giống như các giác quan), các máy tính/bộ điều khiển tiếp nhận dữ liệu

và ra lệnh cho các thiết bị khác, hoặc cũng có thể là các đồ vật được tích hợp cả hai tínhnăng trên

Tiềm năng ứng dụng của internet vạn vật (IoT) trải rộng trên mọi lĩnh vực

Tuy nhiên, mọi hệ thống IoT hoàn chỉnh đều có đủ 4 bước: thu thập dữ liệu, chia sẻ

dữ liệu, xử lý dữ liệu và đưa ra quyết định

Cấu trúc của một hệ thống IoT

Với một hệ thống IoT chúng sẽ bao gồm 4 thành phần chính đó là thiết bị (Things),trạm kết nối (Gateways), hạ tầng mạng (Network and Cloud) và bộ phân tích và xử lý dữliệu (Services-creation and Solution Layers)

Các cảm biến sẽ có nhiệm vụ cảm nhận các tín hiệu từ môi trường như nhiệt độ, ápsuất, ánh sáng,… và chuyển chúng thành các dạng dữ liệu trong môi trường Internet Sau đócác tín hiệu sẽ được xử lý và đưa ra các thay đổi theo ý của người tiêu dùng Hiện naychúng thường được ứng dụng thông qua các ứng dụng trên điện thoại hay trên máy tính,…

Trang 9

Giới thiệu chung về mạng cảm biến

Khái niệm về mạng cảm biến

Mạng cảm biến (Sensor Network) là một hệ thống mạng kết nối các nút cảm biến vớinhau bằng kết nối sóng vô tuyến Mạng cảm biến (WSN) là một phần quan trọng trong sựphát triển của công nghệ thông tin và viễn thông Các nút cảm biến là các thiết bị nhỏ gọn,

có khả năng thu thập dữ liệu về môi trường xung quanh Dữ liệu này sau đó được truyền lêntrạm gốc để xử lý và phân tích

Mạng cảm biến không dây (Wireless Sensor Networks – WSNs) là một mạng tập hợpcác thiết bị giao tiếp thông tin thu thập được từ hiện trường được giám sát thông qua cácliên kết không dây, sóng vô tuyến.WSN bao gồm các trạm gốc và các nút Các nút thường làcác cảm biến không dây (wireless sensors), có thiết kế nhỏ gọn, được phân bố với số lượng lớn trên phạm vị rộng Các nút này được sử dụng để theo dõi cácđiều kiện vật lý hoặc môi trường như nhiệt độ, âm thanh, rung động, áp suất, chuyển độnghoặc các chất ô nhiễm và hợp tác truyền dữ liệu của chúng qua mạng tới trạm thu phát(Sink) hoặc trạm gốc nơi dữ liệu có thể được quan sát và phân tích

Một Sink hoặc trạm gốc hoạt động giống như một giao diện giữa người dùng vàmạng Có thể lấy thông tin cần thiết từ mạng bằng cách đưa vào các truy vấn và thu thập kếtquả từ Sink

Hình 1 Mô hình mạng cảm biến

Trang 10

Các nút cảm biến có thể giao tiếp với nhau bằng tín hiệu vô tuyến Một nút cảm biếnđược tạo thành từ bốn thành phần cơ bản gồm: bộ phận cảm biến, bộ xử lý, bộ thu phát vôtuyến và nguồn cấp Tuỳ theo ứng dụng cụ thể, nút cảm biến còn có thể có các thành phần

bổ sung như hệ thống định vị GPS, bộ phát điện và thiết bị di động

Các đơn vị cảm biến thường bao gồm hai đơn vị con: cảm biến và bộ chuyển đổitương tự sang kỹ thuật số (ADC) Các tín hiệu tương tự do cảm biến tạo ra được ADCchuyển đổi thành tín hiệu kỹ thuật số, sau đó được đưa vào bộ xử lý Đơn vị xử lý thườngđược liên kết với một đơn vị lưu trữ nhỏ và nó có thể quản lý các thủ tục làm cho nút cảmbiến cộng tác với các nút khác để thực hiện các nhiệm vụ cảm biến được giao

Bộ thu phát kết nối nút với mạng Một trong những thành phần quan trọng nhấtcủa nút cảm biến là khối nguồn Các đơn vị năng lượng điện có thể được hỗ trợ bởi một đơn

vị thu gom năng lượng như pin mặt trời Các đơn vị con khác của nút phụ thuộc vào ứngdụng

Vai trò của mạng cảm biến

Mạng cảm biến (WSN) là một hệ thống mạng kết nối các nút cảm biến với nhau bằngkết nối sóng vô tuyến Các nút cảm biến là các thiết bị nhỏ gọn, có khả năng thu thập dữ liệu

về môi trường xung quanh Dữ liệu này sau đó được truyền lên trạm gốc để xử lý và phântích

Mạng cảm biến đóng vai trò quan trọng trong nhiều lĩnh vực khác nhau Cụ thể,mạng cảm biến có thể được sử dụng để:

 Thu thập dữ liệu: Mạng cảm biến có thể được sử dụng để thu thập dữ liệu vềmôi trường xung quanh, chẳng hạn như nhiệt độ, độ ẩm, ô nhiễm không khí,v.v Dữ liệu này có thể được sử dụng để giám sát môi trường, phát hiện cácmối nguy hiểm tiềm ẩn và đưa ra các quyết định quan trọng

 Kiểm soát hệ thống: Mạng cảm biến có thể được sử dụng để kiểm soát các hệthống, chẳng hạn như hệ thống chiếu sáng, hệ thống sưởi ấm và làm mát, v.v.Điều này có thể giúp tiết kiệm năng lượng và cải thiện hiệu quả hoạt động

 Cung cấp thông tin và dịch vụ: Mạng cảm biến có thể được sử dụng để cungcấp thông tin và dịch vụ cho người dùng, chẳng hạn như thông tin về thời tiết,thông tin về giao thông, v.v Điều này có thể giúp cải thiện chất lượng cuộcsống của người dùng

Trang 11

WSN là một công nghệ mới nổi với nhiều tiềm năng ứng dụng Với sự phát triển củacông nghệ, WSN sẽ trở thành một công nghệ quan trọng trong tương lai.

Với những xu hướng phát triển này, WSN sẽ trở thành một công nghệ quan trọngtrong nhiều lĩnh vực khác nhau, góp phần cải thiện chất lượng cuộc sống của con người

Cấu trúc của mạng cảm biến không dây

Một mạng cảm biến không dây bao gồm số lượng lớn các nút được triển khai dầy đặcbên trong hoặc ở rất gần đối tượng cần thăm dò, thu thập thông tin dữ liệu Vị trí các cảmbiến không cần định trước vì vậy nó cho phép triển khai ngẫu nhiên trong các vùng khôngthể tiếp cận hoặc các khu vực nguy hiểm Khả năng tự tổ chức mạng và cộng tác làm việccủa các cảm biến không dây là những đặc trưng rất cơ bản của mạng này Với số lượng lớncác cảm biến không dây được triển khai gần nhau thì truyền thông đa liên kết được lựa chọn

để công suất tiêu thụ là nhỏ nhất (so với truyền thông đơn liên kết) và mang lại hiệu quảtruyền tín hiệu tốt hơn so với truyền khoảng cách xa

Các nút cảm biến được triển khai trong một trường cảm biến (sensor field) Mỗi nútcảm biến được phát tán trong mạng có khả năng thu thập thông số liệu, định tuyến số liệu về

bộ thu nhận (Sink) để chuyển tới người dùng (User) và định tuyến các bản tin mang theoyêu cầu từ nút Sink đến các nút cảm biến Số liệu được định tuyến về phía bộ thu nhận(Sink) theo cấu trúc đa liên kết không có cơ sở hạ tầng nền tảng (Multihop InfrastructurelessArchitecture), tức là không có các trạm thu phát gốc hay các trung tâm điều khiển Bộ thunhận có thể liên lạc trực tiếp với trạm điều hành (Task Manager Node) của người dùng hoặcgián tiếp thông qua Internet hay vệ tinh (Satellite)

Hình 2: Cấu trúc cơ bản của mạng cảm biến không dây

Trang 12

Mỗi nút cảm biến bao gồm bốn thành phần cơ bản là: bộ cảm biến, bộ xử lý, bộ thuphát không dây và nguồn điện Tuỳ theo ứng dụng cụ thể, nút cảm biến còn có thể có cácthành phần bổ sung như hệ thống tìm vị trí, bộ sinh năng lượng và thiết bị di động Cácthành phần trong một nút cảm biến được thể hiện trên hình 2 Bộ cảm biến thường gồm haiđơn vị thành phần là đầu đo cảm biến (Sensor) và bộ chuyển đổi tương tự/số (ADC) Các tínhiệu tương tự được thu nhận từ đầu đo, sau đó được chuyển sang tín hiệu số bằng bộ chuyểnđổi ADC, rồi mới được đưa tới bộ xử lý Bộ xử lý, thường kết hợp với một bộ nhớ nhỏ,phân tích thông tin cảm biến và quản lý các thủ tục cộng tác với các nút khác để phối hợpthực hiện nhiệm vụ Bộ thu phát đảm bảo thông tin giữa nút cảm biến và mạng bằng kết nốikhông dây, có thể là vô tuyến, hồng ngoại hoặc bằng tín hiệu quang Một thành phần quantrọng của nút cảm biến là bộ nguồn Bộ nguồn, có thể là pin hoặc ắcquy, cung cấp nănglượng cho nút cảm biến và không thay thế được nên nguồn năng lượng của nút thường làgiới hạn Bộ nguồn có thể được hỗ trợ bởi các thiết bị sinh điện, ví dụ như các tấm pin mặttrời nhỏ

Hầu hết các công nghệ định tuyến trong mạng cảm biến và các nhiệm vụ cảm biếnyêu cầu phải có sự nhận biết về vị trí với độ chính xác cao Do đó, các nút cảm biến thườngphải có hệ thống tìm vị trí Các thiết bị di động đôi khi cũng cần thiết để di chuyển các nútcảm biến theo yêu cầu để đảm bảo các nhiệm vụ được phân công

Đặc điểm của mạng cảm biến không dây

 Kích thước vật lý nhỏ gọn Kích thước và công suất tiêu thụ luôn chi phối khảnăng xử lý, lưu trữ và tương tác của các thiết bị cơ sở

 Hoạt động đồng thời với độ tập trung cao

Hình 3: Các thành phần của nút cảm biến

Trang 13

 Khả năng liên kết vật lý và phân cấp điều khiển hạn chế

 Tính đa dạng trong thiết kế và sử dụng

 Hoạt động tin cậy Kiến trúc và giao thức của mạng cảm biến không dây

Ứng dụng mạng cảm biến trong quân sự

Một số ứng dụng của mạng cảm biến không dây là: kiểm tra lực lượng, trang bị, đạndược, giám sát chiến trường, trinh sát vùng và lực lượng địch, tìm mục tiêu, đánh giá thiệthại trận đánh, trinh sát và phát hiện các vũ khí hóa học – sinh học – hạt nhân

Hình 4: Ứng dụng mạng cảm biến trong quân sự

Trang 14

Ứng dụng trong môi trường và ngành nông nghiệp

Mạng cảm biến không dây được dùng nhiều trong các trang trại chăn nuôi và trồngtrọt như sau:

 Theo dõi sự di chuyển của các loài chim, loài thú nhỏ, côn trùng

 Kiểm tra các điều kiện môi trường ảnh hưởng tới mùa màng và vật nuôi

 Tình trạng nước tưới cho cây trồng, tính toán trong nông nghiệp, phát hiện racác hóa học, sinh học,…

 Kiểm tra môi trường không khí, đất trồng, biển, rừng,…

 Phát hiện cháy rừng, nghiên cứu khí tượng và địa lý, phát hiện lũ lụt, vẽ bản

đồ sinh học phức tạp của môi trường và nghiên cứu ô nhiễm môi trường

 Người chăn nuôi lợn hoặc gà có các đàn trong các chuồng nuôi mát, thoángkhí Mạng cảm biến không dây có thể được sử dụng cho việc giám sát nhiệt

độ khắp chuồng nuôi, đảm bảo an toàn cho đàn

Giới thiệu chung về website và giao diện website

Khái niệm giao diện website

Giao diện web viết đầy đủ là giao diện website Giao diện có nghĩa phổ thông là hìnhthức bên ngoài, là sự trình bầy, còn trong WordPress nó được gọi là Theme Khi bạn nhìnthấy một ngồi nhà, hình thức trang trí phối cảnh bên ngoài của nó, được hiểu đó là giao diện

Hình 5: Ứng dụng mạng cảm biến trong nông nghiệp

Trang 15

của nó Vậy khi bạn nhìn thấy một trang web, sự sắp xếp các vị trí, màu sắc, bố cục và hìnhảnh ban đâu của nó được gọi là giao diện của nó

Các thành phần cấu thành của một giao diện web

Có những yếu tố sau cần được liệt kê cho một giao diện, đó là Hình ảnh, màu sắc, kỹxảo và bố cục nội dung Trong đó, hình ảnh là một kênh truyền tải đầu tiên dễ cảm nhậnnhất và đập vào mắt người xem đầu tiên, màu sắc là tông màu xuyên suốt của website, từtrang chủ đến các trang con tạo ra độ chuyên nghiệp, kỹ xảo có thể là quăng quật, trượt….tạo ra điểm nhấn cho thông điệp bạn muốn truyền tải, và cấu trúc bố cục nội dung, tạo ra sự

dễ dàng cho người đọc khi truy xuất vào nội dung của website

Giới thiệu chung về Website

Website chính là một tập hợp các trang web (web pages) bao gồm văn bản, hình ảnh,video, flash, v.v… thường chỉ nằm trong một tên miền (domain name) hoặc tên miền phụ(subdomain) trên World Wide Web của Internet

Website được lưu trữ (web hosting) trên máy chủ web (web server) có thể truy cậpthông qua Internet

Một website là tập tin HTML hoặc XHTML có thể truy nhập dùng giao thức HTTPhoặc HTTPS Website có thể được xây dựng từ các tệp tin HTML (website tĩnh) hoặc vậnhành bằng các CMS chạy trên máy chủ (website động) Website có thể được xây dựng bằngnhiều ngôn ngữ lập trình khác nhau (PHP,.NET, Java, Ruby on Rails,…)

Là phần tiêu đề trong mỗi website, cũng là phần quan trọng nhất và được gắn

cố định trong mỗi trang web

Trong header sẽ chứa các thông tin như Logo, câu Slogan, Home link, giỏhàng, ô tìm kiếm hay các thông tin liên quan đến doanh nghiệp

 Thanh điều hướng-Navigation

Trang 16

Những nội dung mà website cung cấp đều được hiển thị đầy đủ ở thanh điềuhướng này, nhờ đó mà người truy cập dễ dàng tìm thấy những gì họ cần Hiện nay, để tiết kiệm không gian hiển thị, đồng thời mang lại sự tiện lợi chongười dùng khi truy cập vào website trên các thiết bị di động, các nội dungtrong thanh Navigation sẽ được hiển thị dưới dạng biểu tượng 3 đường xếpchồng lên nhau Khi muốn nó hiển thị, bạn chỉ cần chạm nhẹ vào là nó sẽ hiện

ra

Đối với các trang web có nhiều nội dung hơn, người ta sẽ thiết kế một thanhMenu đổ xuống ở dạng ẩn Khi muốn kích hoạt chúng, bạn chỉ cần di chuyểnchuột xung quanh một liên kết bất kỳ trong điều hướng chính là nó sẽ xuấthiện những liên kết theo dạng sơ đồ, phân chia thành từng phần chính phụ

Phần này thường được thiết kế với màu sắc bắt mắt, tạo được sự thu hút mạnh

mẽ cho người truy cập, bởi đây sẽ là nội dung tiếp cận trực tiếp với ngườidùng

Nội dung trong slider có thể là các thông tin khuyến mãi hấp dẫn, video quảngcáo sản phẩm - dịch vụ đang được doanh nghiệp cung cấp

 Content area

Những thông tin khi được hiển thị trong mục này, cần phải được trình bày mộtcách bắt mắt, ngắn gọn và súc tích, để chúng có thể chạm đến insight của từng

Trang 17

khách hàng khi truy cập Nếu website của bạn thực hiện tốt ở phần này, chắcchắn sẽ ngày càng thu hút được nhiều lượt truy cập chất lượng và có đượcnhững khách hàng trung thành cho trang web.

Ngôn ngữ PHP thường được dùng trong việc xây dựng và phát triển website bởi nó

có thể kết nối dễ dàng với các website khác có sử dụng HTML.PHP cũng là ngôn ngữ lậptrình có mã nguồn mở, tương thích với nhiều nền tảng khác nhau như MacOS, Linux,Windows,… PHP được nhiều người dùng đánh giá là dễ đọc nên đa số các lập trình viên sẽlựa chọn học PHP trước khi bắt đầu vào nghề

Ứng dụng của PHP:

 Thiết lập chương trình cho hệ thống máy chủ: Đây là một ứng dụng chủ yếunhất của PHP Các PHP Developer sẽ phải thực hiện các thao tác như phântích ngôn ngữ lập trình PHP, xây dựng máy chủ web và trình duyệt web

 Tạo các dòng tập lệnh: Các lập trình viên sẽ tạo ra một dòng tập lệnh để vậnhành chương trình PHP mà không cần đến máy chủ Kiểu lập trình này được

sử dụng trên các hệ điều hành phổ biến như Linux hay Windows

 Xây dựng các ứng dụng làm việc: Bạn có thể ứng dụng những điểm mạnh vốn

có của PHP để xây dựng ứng dụng phần mềm Các lập trình viên thường dùngPHP – GTK làm nền tảng xây dựng phần mềm vì đây là nhánh mở rộng của

Trang 18

ngôn ngữ lập trình này và không có sẵn trong các bản phân phối chính thứchiện nay

 Hỗ trợ cho mọi loại cơ sở dữ liệu khác nhau: Khi một website có hỗ trợ cơ sở

dữ liệu tốt sẽ giúp ích cho việc vận hành, sao lưu và đặc biệt là backup dữ liệu

đề phòng trường hợp xảy ra an ninh mạng

Ưu nhược điểm của PHP

 Ưu điểm:

o Mã nguồn mở và miễn phí: PHP sử dụng miễn phí nên giúp tiết kiệmđáng kể ngân sách dự án Việc cài đặt và sử dụng ngôn ngữ này cũngrất dễ dàng, bạn chỉ cần học chăm chỉ trong 3 – 6 tháng là đã có thể sửdụng thuần thục

o Tính linh hoạt: PHP là một ngôn ngữ đa nền tảng, có thể hoạt động trênbất kỳ hệ điều hành nào (Windows, Linux, macOS,…) Hơn nữa, PHPcòn có thể kết hợp với nhiều ngôn ngữ lập trình khác để xây dựng cáctính năng công nghệ một cách hiệu quả nhất

o Hệ thống thư viện phong phú, tính cộng đồng cao: Do sự phổ biến củangôn ngữ PHP nên việc tìm các thư viện code hay hàm liên quan đếnPHP sẽ cực kỳ đơn giản Chưa kể, bạn sẽ nhận được sự trợ giúp từ cácdiễn đàn, đội nhóm chuyên sâu của PHP giúp việc học tập hay làm việctrở nên dễ dàng

o Cơ sở dữ liệu đa dạng: PHP cho phép kết nối với hầu hết các cơ sở dữliệu khác như mySQL, SQLite, PostgreSQL, MS-SQL,…

 Nhược điểm:

o Bản chất của PHP có mã nguồn mở nên các lỗ hổng của mã nguồn sẽ bịcông khai ngay sau khi chúng được tìm thấy Và các lỗ hổng này có thể

bị khai thác cho các mục đích xấu trước khi chúng ta kịp sửa chữa

o Chỉ hoạt động được trên website và giao diện không được gọn gàngđẹp mắt Độ bảo mật và hiệu suất chưa tốt

Trang 19

Tổng quan về ngôn ngữ lập trình Javascrip

Javascript chính là một ngôn ngữ lập trình web rất phổ biến ngày nay Javascriptđược tích hợp đồng thời nhúng vào HTML để hỗ trợ cho website trở nên sống động hơn.Chúng cũng đóng vai trò tương tự như một phần của website, cho phép Client-side Script từngười dùng tương tự máy chủ (Nodejs) để tạo ra những website động

Công dụng của javascrip

 Thay đổi nội dung HTML: Một trong số nhiều phương thức HTML JavaScriptchính là getElementById () Chúng được sử dụng để tìm một phần tử của HTML với id =”demo" và dùng để thay đổi nội dung của phần từ (Internal HTML) sang thành “Hello JavaScript”

 Thay đổi giá trị thuộc tính HTML: Tổng quan về javascript còn có thể sử dụng

để thay đổi các giá trị của thuộc tính Ví dụ: thay đổi thuộc tính src (source) của tag<img>

 Thay đổi kiểu HTML: Đây chính là một hoạt động biến thể của việc thay đổi thuộc tính của HTML ở trên Ví dụ:

document.getElementById(‘demo’).style.fontSize = ’35px;

 Ẩn các phần tử HTML: Một hoạt động tiếp theo là Javascript có thể ẩn được các phần tử HTML Chúng có thể được thực hiện thông qua hoạt động thay đổi kiểu hiển thị các phần tử HTML

 Hiển thị các phần tử HTML: Một điểm đặc biệt là JavaScript có thể hiển thị được các yếu tố HTML ẩn Đồng thời, cũng có thể thực hiện được thông qua cách thay đổi kiểu hiển thị phần tử

Ưu nhược điểm của Javascrip

Trang 20

o JS có thể hoạt động ở trên nhiều nền tảng và các trình duyệt web khácnhau

o Được các chuyên gia đánh giá là một loại ngôn ngữ lập trình nhẹ vànhanh hơn nhiều so với các ngôn ngữ lập trình khác

o JS còn có thể được gắn trên một số các element hoặc những events củacác trang web

o Những website có sử dụng JS thì chúng sẽ giúp cho trang web đó có sựtương tác cũng như tăng thêm nhiều trải nghiệm mới cho người dùng

o Người dùng cũng có thể tận dụng JS với mục đích là để kiểm tra nhữnginput thay vì cách kiểm tra thủ công thông qua hoạt động truy xuấtdatabase

o Giao diện của ứng dụng phong phú với nhiều thành phần như Drag andDrop, Slider để cung cấp đến cho người dùng một Rich Interface (giaodiện giàu tính năng)

o Giúp thao tác với người dùng phía Client và tách biệt giữa các Clientvới nhau

 Nhược điểm:

o JS Code Snippet khá lớn

o JS dễ bị các hacker và scammer khai thác hơn

o JS cũng không có khả năng đa luồng hoặc đa dạng xử lý

o Có thể được dùng để thực thi những mã độc ở trên máy tính của người

Trang 21

CHƯƠNG 2: CƠ SỞ LÝ THUYẾT GIAO DIỆN Giới thiệu chung về ESP32

Tổng quan về ESP32

ESP32 là một series các vi điều khiển trên một vi mạch giá rẻ, năng lượng thấp cótích hợp WiFi và dual-mode Bluetooth (tạm dịch: Bluetooth chế độ kép) Dòng ESP32 sửdụng bộ vi xử lý Tensilica Xtensa LX6 có hai biến thể lõi kép và lõi đơn, và bao gồm cáccông tắc antenna tích hợp, RF balun, bộ khuếch đại công suất, bộ khuếch đại thu nhiễu thấp,

bộ lọc và module quản lý năng lượng

Hình 6: Module ESP32

Trang 22

 Nó cũng có một mô-đun tăng tốc phần cứng mật mã cho các thuật toán mật

mã khác nhau như RSA, AES

Hình 7:Sơ đồ khối cấu trúc ESP32

Trang 23

Sơ đồ chân ESP32

Chip ESP32 bao gồm 48 chân với nhiều chức năng khác nhau Không phải tất cả cácchân đều lộ ra trrên các module ESP32 và một số chân không thể được sử dụng

Mặc dù bạn có thể định nghĩa các thuộc tính chân trên phần mềm, nhưng có các chânđược gán theo mặc định như trong hình sau (đây là ví dụ cho module ESP32 DEVKIT V1DOIT có 36 chân vị trí chân có thể thay đổi tùy thuộc vào nhà sản xuất)

Chip ESP32 bao gồm 48 chân với nhiều chức năng khác nhau Không phải tất cả cácchân đều lộ ra trrên các module ESP32 và một số chân không thể được sử dụng

Mặc dù bạn có thể định nghĩa các thuộc tính chân trên phần mềm, nhưng có các chânđược gán theo mặc định như trong hình sau (đây là ví dụ cho module ESP32 DEVKIT V1DOIT có 36 chân vị trí chân có thể thay đổi tùy thuộc vào nhà sản xuất)

Hình 8: : Sơ đồ chân ESP32 devkit

Trang 24

Giới thiệu Relay 1 kênh 5V

 Module sử dụng Relay tốt, đảm bảo hoạt động ổn định, lâu dài

 Trên module có opto để cách ly dòng ngược về, hiệu suất ổn định

Điện áp tải tối đa AC 250V-10A / DC 30V-10AĐiện áp điều khiển 5 VDC

Dòng kích Relay 5mATrạng thái kích Mức thấp (0V)Đường kính Lỗ ốc 3.1 mm

Kích thước 50 * 26 * 18.5 mm

 Có thể set các mức cao thấp bằng cách thiết lập jumper trên module

 Có Led báo nguồn màu xanh, Led báo trạng thái Relay màu đỏ

 Kết nối module với mạch điều khiển đơn giản

Thông số kỹ thuật

Bảng 1:Thông số kĩ thuật của Module Relay Hình 9: Hình modun Relay 5V 1 kênh

Trang 25

Giới thiệu cảm biến ánh sáng

Khái niệm

Cảm biến ánh sáng là thiết bị quang điện chuyển đổi ánh sáng (bao gồm cả ánh sángnhìn thấy và ánh sáng dạng tia hồng ngoại) thành tín hiệu điện Nó là một dạng thiết bị cảmbiến thông minh có thể nhận biết được các biến đổi của môi trường thông qua mắt cảm biến

Từ đó, nó sẽ điều chỉnh ánh sáng cho phù hợp

Nguyên lí hoạt động

Cảm biến ánh sáng hoạt động dựa trên nguyên lý của hiệu ứng quang điện Hiệu ứngquang điện là hiện tượng một số chất đặc biệt sau khi hấp thụ ánh sáng sẽ chuyển đổi nănglượng ánh sáng thành năng lượng điện

Hiệu ứng quang điện gồm có:

- Hiệu ứng quang điện trong: Hiện tượng quang điện trong thường diễn ra vớichất bán dẫn Khi chiếu ánh sáng vào vật liệu, năng lượng này sẽ làm thay đổiđiện trở suất bên trong vật liệu gây ra suất điện động làm thay đổi tính chấtđiện của vật liệu

Hình 10: Một số cảm biến ánh sáng

Trang 26

- Hiệu ứng quang điện ngoài: Khi bề mặt của vật liệu được chiếu bởi ánh sáng,các điện tử sẽ hấp thụ năng lượng để tạo ra điện Khi các điện tử từ bên trongvật liệu bật ra ngoài bề mặt của vật liệu sẽ tạo ra hiệu ứng quang điện ngoài.

Ứng dụng cảm biến ánh sáng trong đời sống

- Cảm biến ánh sáng mang đến rất nhiều lợi ích và được ứng dụng phổbiến trong nhiều lĩnh vực, cụ thể như:

- Ứng dụng trong các thiết bị đèn chiếu sáng Cảm biến tự động điềuchỉnh ánh sáng màn hình của điện thoại thông minh và máy tính bảng

- Cảm biến ánh sáng sử dụng trong ô tô để hỗ trợ tầm nhìn cho người lái

xe Khi trời quá tối, hệ thống đèn ô tô sẽ tự động bật nhờ vào cảm biếnphát hiện ánh sáng

- Ứng dụng trong bảo mật cho quá trình vận chuyển hàng hóa, các cảmbiến có thể phát hiện các thùng hàng bị hở hoặc thất lạc

Cảm biến ánh sáng BH1750

Hình 11: Các chân của cảm biến ánh sáng BH1750

BH1750 là cảm biến ánh sáng digital sử dụng phổ biến ở điện thoại di động để điềuchỉnh độ sáng màn hình dựa trên ánh sáng môi trường Cảm biến đo chính xác đến đơn vịLUX của ánh sáng lên đến 65535lx

Cấu hình chân BH1750

Bảng 2:Sơ đồ chân cảm biến BH1750

Trang 27

3 SCL Chân xung clock cấp xung

nhịp cho giao thức i2c

thức I2C

Chân địa chỉ chọn địa chỉthiết bị giao tiếp khi cónhiều hơn hai module kếtnối

Tính năng của BH1750

- Chân địa chỉ chọn địa chỉ Nguồn cung cấp: 2.4V-3.6V (thường là 3.0V)

- Tiêu thụ dòng điện thấp: 0,12mA

- Khoảng giá trị đo: 1-65535lx

- Giao thức giao tiếp dữ liệu: I2C bus

- Thay đổi độ sáng tự động trên điện thoại di động / LCD

- Điều khiển bật / tắt đèn pha ô tô theo điều kiện ánh sáng xung quanh

- Được sử dụng làm cảm biến ánh sáng xung quanh để kiểm soát độ sángcủa màn hình hiển thị

Giao thức http,html, CSS

Giới thiệu HTTP

HTTP là từ viết tắt của Hyper Text Transfer Protocol nghĩa là Giao thức Truyền tảiSiêu Văn Bản được sử dụng trong www HTTP là 1 giao thức cho phép tìm nạp tài nguyên,chẳng hạn như HTML doc

Ngày đăng: 29/03/2024, 14:56

TÀI LIỆU CÙNG NGƯỜI DÙNG

TÀI LIỆU LIÊN QUAN

w