Tự động hóa trang chủ bằng Captive Portal: 9 bước

2024 Tác giả: John Day | [email protected]. Sửa đổi lần cuối: 2024-01-30 13:32

Ở đây, chúng tôi sẽ tạo một dự án rất thú vị về tự động hóa ngôi nhà dựa trên Captive Portal bằng cách sử dụng nodeMCU từ đầu.. Vì vậy, chúng ta hãy bắt đầu..

Bước 1: Khai báo ban đầu

Khai báo các chân IO của nodeMCU để thực hiện Action, Header Files và mã tạo máy chủ DNS..hình ảnh trong hình ảnh..

Bước 2: Mã Html cho Giao diện Người dùng I.e. Trang đăng nhập

Như trong hình, khai báo mã html trong một biến chuỗi mà chúng tôi gửi cho người dùng cuối để xác thực Mã truy cập.

* Để bắt dữ liệu do người dùng nhập vào đây, chúng tôi đang sử dụng ngăn ký tự liên kết và thẻ href

* Về cơ bản, thẻ Anchor được sử dụng để thêm một trang web khác trong trang web và thẻ href xác định đích của liên kết.

* Tuy nhiên, ở đây chúng tôi đang nhận dữ liệu do người dùng nhập trong trường Mã truy cập thông qua Anchor Pane và thẻ href…

làm thế nào, tôi sẽ đề cập đến hai phương pháp bắt đầu vào từ giao diện web đến các lập trình viên có nghĩa là kết thúc..

Bước 3: Sử dụng các phương thức WebServer.arg () và WebServer.on ()

Như, tôi đã đề cập ở bước trước, tôi sẽ cho bạn biết hai phương pháp khác nhau..

1) Bằng cách sử dụng phương thức webServer.arg ():

Ở đây, chúng tôi chỉ định thuộc tính lấy nét tự động cùng với phần tử như trong hình, những gì tự động lấy nét thực hiện là nó là một thuộc tính boolean khi nó là true có nghĩa là trình bày nó đảm bảo rằng phần tử đầu vào được tập trung khi tải trang.

và sau đó, chúng tôi gọi phương thức args () trên đối tượng máy chủ. Phương thức này sẽ trả về số lượng tham số truy vấn đã được truyền trên HTTP và áp dụng các câu lệnh điều kiện để thực hiện các hành động tương ứng.

2) Bằng cách sử dụng và thuộc tính href:

Ở đây, chúng tôi chỉ định các phần tử điều khiển của chúng tôi (như các nút) bên trong và gán một chuỗi, ký tự, liên kết mà bạn muốn xác thực bằng cách sử dụng các câu lệnh điều kiện và sau đó chúng tôi gọi webServer.on () để nhận đầu vào để xác thực.

Như hình..

Bước 4: Nếu người dùng nhập thông tin đăng nhập sai

Những gì tôi đã làm, chỉ cần thay đổi mã trang đăng nhập hiện có và thêm tiêu đề mới thông báo rằng người dùng đã nhập sai thông tin đăng nhập..

Đầu tiên xác thực thông tin đăng nhập nếu nó sai, hãy hướng người dùng đến trang đăng nhập đã chỉnh sửa mới hiển thị thông báo lỗi.

Như hình..

Bước 5: Cách thêm hình ảnh vào trang web của bạn.

Nó rất đơn giản, bởi vì ở đây chúng tôi không lưu trữ hình ảnh của chúng tôi vào một bộ nhớ vật lý để chúng tôi cung cấp một đường dẫn để tìm nạp hình ảnh mà chúng tôi thường làm trong trường hợp trang html.

vì vậy những gì chúng tôi làm chỉ đơn giản là chuyển đổi hình ảnh của chúng tôi sang base64 và dán nó vào mã trang của chúng tôi Như được hiển thị..

Bước 6: Chúng ta cần những thành phần nào.

1) - nodeMCU

2) - Arduino IDE để flash nodeMCU

3) -cây cản (F-2-F)

4) -Relay Module

5) -Một điện thoại thông minh hoặc máy tính xách tay hỗ trợ WiFi để kiểm tra

Bước 7: Kết nối.

Thêm mô-đun chuyển tiếp vào các chân IO đã khai báo trong mã.

Kết nối Relay với thiết bị điện bạn muốn điều khiển như trong hình ảnh..

Bước 8: Bây giờ hãy kiểm tra và tận hưởng.

Bước 9: Mã ở đây.

Hãy viết những bình luận có giá trị của bạn..