a. Đối với cá nhân:
− Tìm hiểu nâng cao về thiết kế Web
− Tìm hiểu thêm các phần nâng cao về mạng truyền thông công nghiệp áp dụng vào thực tế.
b. Đối với đề tài:
− Sẽ áp dụng thêm hệ thống camera để theo dõi tình trạng của trang trại, sử dụng camera chống trộm để đảm bảo an toàn cho trang trại.
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 83
TÀI LIỆU THAM KHẢO
[1] C. T. C. P. G. P. M. B. KIM, "Web server (máy chủ web) là gì?," [Online]. Available:
https://www.bkns.vn/web-server-la-gi.html.
[2] V. IDC, "Cách thức hoạt động và lưu ý khi sử dụng Web server," 01 09 2020. [Online]. Available: https://viettelidc.com.vn/tin-tuc/web-server-la-gi-cach-thuc-hoat-dong-va- luu-y-khi-su-dung-web-server. [Accessed 10 05 2022].
[3] T. T. A. T. J. S. COMPANY, "NHẬN THIẾT KẾ HỆ THỐNG ĐIỀU KHIỂN, GIÁM SÁT WEB SERVER," [Online]. Available: https://tudongtinthanh.com/thiet-ke-he- thong-dieu-khien-giam-sat-web-server/.
[4] SIEMENS-VIETNAM, "Giới thiệu PLC S7-1200," 20 3 2019. [Online]. Available:
http://siemens-vietnam.vn/gioi-thieu-plc-s7-1200/.
[5] F.-E. ATUMATION, "Truyền thông giữa 2 PLC SIEMENS," 19 02 2019. [Online]. Available: https://fulle.com.vn/truyen-thong-giua-2-plc-siemens.html.
[6] qthang.net, "Web Server với PLC S7-1200 Siemen – [HTML, CSS, Javascript]," [Online]. Available: https://qthang.net/web-server-voi-plc-s7-1200-siemen-html-css- javascript.
[7] C. h. H. Đ. T. V. ROBOT, "Cảm Biến Độ Ẩm Đất Đầu Dò Chống Ăn Mòn," [Online]. Available: https://hshop.vn/products/cam-bien-do-am-dat-dau-do-chong-an-mon#. [8] Nghialagi.ORG, "Switch là gì? Những ý nghĩa của Switch," [Online]. Available:
https://nghialagi.org/switch-la-gi/.
[9] V. FITA,"Tổng hợp các thẻ HTML","[Online]. Available: https://timoday.edu.vn/tong- hop-cac-the-trong-html/.
[10] Sách Simatic Siemens S7-1200; tác giá: Châu Chí Đức; link sách: http://www.mediafire.com/file/kab21qoetbe4b1u/s7_1200_easy_book.pdf/file
[11] Bài giảng Mạng truyền thông công nghiệp và SCADA; tác giả: Đỗ Văn Cần; link sách:https://tailieu.vn/doc/bai-giang-mang-truyen-thong-cong-nghiep-va-scada-do-
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 84
PHỤ LỤC Thiết kế chương trình điều khiển
− Thiết lập địa chỉ truyền và nhận dữ liệu:
+ Địa chỉ truyền Master
• Data nhận Master:
• Data truyền Master:
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 86
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 89 + Địa chỉ nhận Slave:
• Data nhận Slave:
• Data truyền Slave:
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 92 ❖ Chương trình con:
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 95 • Chếđộ tựđộng:
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 98 • Scale cảm biến:
+ Cảm biến nhiệt độ:
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 99 • Trạng thái hoạt động của các thiết bị khối ngõ ra:
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 101 • Xuất đầu ra:
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 104
Thiết kế chương trình giám sát và điều khiển qua Web Server:
<!DOCTYPE html> <html>
<head>
<title>Trang trại iot</title> <meta charset="utf-8">
<link rel="stylesheet" href="./assect/style.css">
<script src="./javascript/jquery-2.0.2.min.js"></script> </head>
<body>
<div id="dangnhap-vao">
<div class="login js-vao"> <div class="login-container"> <header class="login-header">
<div class="login-close js-btnclose">
<img class="close" src="https://bit.ly/3NCFz8F"></img> </div>
<img src="https://bit.ly/3sQDBtl" alt="Admin"> </header>
<div class="login-body">
<label for="user" class="login-lable">
Tên đăng nhập
</label>
<input id="user" type="text" class="login-username" required placeholder="Enter username">
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 105 Mật khẩu
</label>
<input id="pass" type="password" class="login-password" required placeholder="Your password">
<input type="submit" id="dangnhap" class="js-btnlogin" value="Login"> </div>
<div class="footer">
<a href="#">Quên mật khẩu?</a> </div>
</div> </div> </div>
<!-- Begin: header -->
<div id="header">
<h1 class="heading">Mô hình trang trại giám sát và điều khiển tự động qua web server</h1>
</div>
<!-- End: header -->
<!-- Begin: Slider bar-->
<div id="slider">
<button class="text-font" id="btnlogout" onclick="logout()">Đăng xuất</button> <button class="text-font js-btnscreena" id="btn-nta">Nông trại A</button>
<button class="text-font js-btnscreenb" id="btn-ntb">Nông trại B</button> <button class="text-font js-btnscreenc" id="btn-ntc">Nông trại C</button> <button class="text-font js-btnscreend" id="btn-ntd">Nông trại D</button> </div>
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 106 <!-- Begin: Display body -->
<div id="display-body"> <div class="nongtrai-a js-nta">
<img src="./img/nong-trai-a.png" alt="Nông trại a"> <div class="item-user">
<!-- Quạt -->
<div class="quat same">
<img id="simuquat" class="same1" src="./img/A1.png" style="filter: hue- rotate(230deg); " alt="quạt">
<div class="co-dinh-all"> <div class="co-dinh">
<button id="btn-quat-on" class="button">Bật</button> </div>
<button id="btn-quat-off" class="button">Tắt</button> </div>
</div>
<!-- Bơm -->
<div class="bom same">
<img id="simubom" class="same1" src="./img/A8.png" style="filter: hue- rotate(230deg); " alt="bơm">
<div class="co-dinh-all"> <div class="co-dinh">
<button id="btn-bom-on" class="button">Bật</button> </div>
<button id="btn-bom-off" class="button">Tắt</button> </div>
</div>
<!-- Độngcơ kéo đóng -->
<div class="keodong same">
<img id="simukeodong" class="same1" src="./img/A13.png" style="filter: hue- rotate(230deg); " alt="Kéo đóng">
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 107
<div class="co-dinh-all"> <div class="co-dinh">
<button id="btn-keodong-on" class="button">Bật</button> </div>
<button id="btn-keodong-off" class="button">Tắt</button> </div>
</div>
<!-- Độngcơ kéo mở -->
<div class="keomo same">
<img id="simukeomo" class="same1" src="./img/A13.png" style="filter: hue- rotate(230deg); " alt="kéo mở">
<div class="co-dinh-all"> <div class="co-dinh">
<button id="btn-keomo-on" class="button">Bật</button> </div>
<button id="btn-keomo-off" class="button">Tắt</button> </div>
</div>
<!-- Đèn sưởi -->
<div class="densuoi same">
<img id="simudensuoi" class="same1" src="./img/A6.png" style="filter: hue- rotate(230deg); " alt="đènsưởi">
<div class="co-dinh-all"> <div class="co-dinh">
<button id="btn-densuoi-on" class="button">Bật</button> </div>
<button id="btn-densuoi-off" class="button">Tắt</button> </div>
</div>
<!-- Đèn sân vườn -->
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 108
<img id="simudensanvuon" class="same1" src="./img/A6.png" style="filter: hue- rotate(230deg); " alt="đèn sân vườn">
<div class="co-dinh-all"> <div class="co-dinh">
<button id="btn-densanvuon-on" class="button">Bật</button> </div>
<button id="btn-densanvuon-off" class="button">Tắt</button> </div>
</div> </div>
<div class="data-list"> <div class="data-output"> <p id="thoi-gian"></p> <p id="thoi-tiet"></p>
<label id="nhiet-do">0.0</label> <label id="do-am">0.0</label> </div>
<div class="data-trang-thai"> <p id="trang-thai"></p> <p id="chia-nua">|</p> <div class="mode">
<input type="checkbox" name="" id="auto-manu"> <p id="auto">Manual</p>
<p id="ngan-cach">/</p> <p id="manual">Auto</p> </div>
</div>
<div class="data-input"> <div>
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 109
<input type="number" name="nhiệtngưỡng cao" id="nhiet-cao" class="nhap-data1 same2">
<input type="number" name="nhiệtngưỡngthấp" id="nhiet-thap" class="nhap-data2 same2">
<input type="number" name="độ ẩmngưỡng cao" id="do-am-cao" class="nhap-data3 same2">
<input type="number" name="độ ẩmngưỡngthấp" id="do-am-thap" class="nhap- data4 same2">
<button id="set-data">Cài đặt</button> </div>
</div> </div>
<div class="bar">
<p class="name_tt">NÔNG <br> TRẠI A</p>
<button id="dungkhancap">DỪNG KHẨN CẤP</button> </div>
</div>
<div class="nongtrai-b js-ntb">
<img src="https://bit.ly/3wM0Fuk" alt="Nông trại b">
<div class="bar">
<p class="name_tt"> NÔNG <br> TRẠI B</p> </div>
</div>
<div class="nongtrai-c js-ntc">
<img src="https://bit.ly/3LP4XGO" alt="Nông trại c"> <div class="bar">
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 110
</div> </div>
<div class="nongtrai-d js-ntd">
<img src="https://bit.ly/3NERvqx" alt="Nông trại d"> <div class="bar">
<p class="name_tt">NÔNG <br> TRẠI D</p> </div>
</div> </div>
<!-- End: Display body -->
<script src="./javascript/java-code.js"></script> </body>
<script type="text/javascript">
vartuxa; vartaicho; varstatusdungkhancap; varbomloi; varkeomoloi; varkeodongloi; varbomrun; varkeomorun; varkeodongrun; vardenvuonrun; vardenvuonloi; vardensuoirun; vardensuoiloi; varquatrun; varquatloi; varstatusbangtay;
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 111 varstatustudong; varcbmua; varcbanhsang; // vardem_quat = 1; vardem_bom = 1; vardem_keomo = 1; vardem_keo_dong = 1; vardem_den_suoi = 1; vardem_den_vuon = 1; // varbom_dem_lag = 0; varquat_dem_lag = 0; varkeomo_dem_lag = 0; varkeodong_dem_lag = 0; vardenvuon_dem_lag = 0; vardensuoi_dem_lag = 0; vardenvuon_lag1 = 0; vardensuoi_lag1 = 0;
$(document).ready(function() {
$.ajaxSetup({
cache:false
});
setInterval(function() {
$.getJSON("io.html", function(result) {
tuxa = result["tuxa"];
taicho = result["taicho"];
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 112
bomloi = result["bomloi"];
keomoloi = result["keomoloi"];
keodongloi = result["keodongloi"];
bomrun = result["bomrun"];
keomorun = result["keomorun"];
keodongrun = result["keodongrun"];
denvuonloi = result["denvuonloi"];
denvuonrun = result["denvuonrun"];
densuoirun = result["densuoirun"];
densuoiloi = result["densuoiloi"];
quatrun = result["quatrun"];
quatloi = result["quatloi"];
statusbangtay = result["statusbangtay"];
statustudong = result["statustudong"];
cbmua = result["cbmua"];
cbanhsang = result["cbanhsang"];
// Kiểm tra hiểnthịtrạng thái hoạtđộng if (tuxa == 1 && taicho == 0) {
$('#trang-thai').text("Từ xa");
} else if (tuxa == 0 && taicho == 1) {
$('#trang-thai').text("Tại chỗ"); } else {
$('#trang-thai').text("No Status"); }
// Xét ngày hay đêm,mưa rào hay khô ráo if (cbmua == 1) {
$('#thoi-tiet').text("Mưa rào"); } else {
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 113 }
if (cbanhsang == 1) {
$('#thoi-gian').text("Ban đêm"); } else {
$('#thoi-gian').text("Ban ngày"); }
// Bơm quay
if (bomrun == 1 && bomloi == 0 && bom_dem_lag == 0) {
varID_bom = setInterval(changebom, 200);
bom_dem_lag++;
functionchangebom() {
varimgs = ["./img/A8.png", "./img/A9.png", "./img/A10.png", "./img/A11.png"];
document.getElementById('simubom').src = imgs[dem_bom];
dem_bom++; if (dem_bom >= 4) { dem_bom = 0; } if (bomrun == 0 || bomloi == 1) { bom_dem_lag = 0; dem_bom = 0;
document.getElementById('simubom').setAttribute('style', "filter: hue-
rotate(230deg)");
clearInterval(ID_bom); }
}
} else if (bomloi == 1 && bom_dem_lag == 0) {
document.getElementById('simubom').setAttribute('style', "filter: hue-rotate(0deg)");
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 114
bom_dem_lag++;
functionchangebom1() {
varimgs = ["./img/A8.png", "./img/bom.png"];
document.getElementById('simubom').src = imgs[dem_bom];
dem_bom++; if (dem_bom >= 2) { dem_bom = 0; } if (bomloi == 0) { bom_dem_lag = 0; dem_bom = 0;
document.getElementById('simubom').setAttribute('style', "filter: hue-
rotate(230deg)"); clearInterval(ID_bom1); } } } // Quạt quay
if (quatrun == 1 && quatloi == 0 && quat_dem_lag == 0) {
varID_quat = setInterval(changequat, 200);
quat_dem_lag++;
functionchangequat() {
varimgs = ["./img/A1.png", "./img/A2.png", "./img/A3.png", "./img/A4.png"];
document.getElementById('simuquat').src = imgs[dem_quat];
dem_quat++;
if (dem_quat >= 4) {
dem_quat = 0;
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 115 if (quatrun == 0 || quatloi == 1) {
quat_dem_lag = 0;
dem_quat = 0;
document.getElementById('simuquat').setAttribute('style', "filter: hue-
rotate(230deg)");
clearInterval(ID_quat); }
}
} else if (quatloi == 1 && quat_dem_lag == 0) {
document.getElementById('simuquat').setAttribute('style', "filter: hue-rotate(0deg)");
varID_quat1 = setInterval(changequat1, 500);
quat_dem_lag++;
functionchangequat1() {
varimgs = ["./img/A1.png", "./img/quat.png"];
document.getElementById('simuquat').src = imgs[dem_quat];
dem_quat++; if (dem_quat >= 2) { dem_quat = 0; } if (quatloi == 0) { dem_quat = 0; quat_dem_lag = 0;
document.getElementById('simuquat').setAttribute('style', "filter: hue-
rotate(230deg)");
clearInterval(ID_quat1); }
}
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 116 // Kéo mở quay
if (keomorun == 1 && keomoloi == 0 && keomo_dem_lag == 0) {
varID_keomo = setInterval(changekeomo, 200);
keomo_dem_lag++;
functionchangekeomo() {
varimgs = ["./img/A13.png", "./img/A14.png"];
document.getElementById('simukeomo').src = imgs[dem_keomo];
dem_keomo++; if (dem_keomo >= 2) { dem_keomo = 0; } if (keomorun == 0 || keomoloi == 1) { dem_keomo = 0; keomo_dem_lag = 0;
document.getElementById('simukeomo').setAttribute('style', "filter: hue-
rotate(230deg)");
clearInterval(ID_keomo); }
}
} else if (keomoloi == 1 && keomo_dem_lag == 0) {
document.getElementById('simukeomo').setAttribute('style', "filter: hue-
rotate(0deg)");
varID_keomo1 = setInterval(changekeomo1, 500);
keomo_dem_lag++;
functionchangekeomo1() {
varimgs = ["./img/A13.png", "./img/banhquay.png"];
document.getElementById('simukeomo').src = imgs[dem_keomo];
dem_keomo++;
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 117 dem_keomo = 0; } if (keomoloi == 0) { dem_keomo = 0; keomo_dem_lag = 0;
document.getElementById('simukeomo').setAttribute('style', "filter: hue-
rotate(230deg)"); clearInterval(ID_keomo1); } } } // Kéo đóng quay
if (keodongrun == 1 && keodongloi == 0 && keodong_dem_lag == 0) {
varID_keodong = setInterval(changekeomo, 200);
keodong_dem_lag++;
functionchangekeomo() {
varimgs = ["./img/A14.png", "./img/A13.png"];
document.getElementById('simukeodong').src = imgs[dem_keo_dong];
dem_keo_dong++; if (dem_keo_dong >= 2) { dem_keo_dong = 0; } if (keodongrun == 0 || keodongloi == 1) { dem_keo_dong = 0; keodong_dem_lag = 0;
document.getElementById('simukeodong').setAttribute('style', "filter: hue-
rotate(230deg)");
clearInterval(ID_keodong); }
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 118 }
} else if (keodongloi == 1 && keodong_dem_lag == 0) {
document.getElementById('simukeodong').setAttribute('style', "filter: hue-
rotate(0deg)");
varID_keodong1 = setInterval(changekeomo, 500);
keodong_dem_lag++;
functionchangekeomo() {
varimgs = ["./img/A14.png", "./img/banhquay.png"];
document.getElementById('simukeodong').src = imgs[dem_keo_dong];
dem_keo_dong++; if (dem_keo_dong >= 2) { dem_keo_dong = 0; } if (keodongloi == 0) { dem_keo_dong = 0; keodong_dem_lag = 0;
document.getElementById('simukeodong').setAttribute('style', "filter: hue-
rotate(230deg)"); clearInterval(ID_keodong1); } } } // Đèn sân vườn
if (denvuonrun == 1 && denvuonloi == 0 && denvuon_dem_lag == 0) {
varID_denvuon = setTimeout(changedenvuon, 100);
denvuon_dem_lag++;
functionchangedenvuon() {
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 119
dem_den_vuon++;
document.getElementById('simudensanvuon').src = imgs[dem_den_vuon];
document.getElementById('simudensanvuon').setAttribute('style', "filter: hue-
rotate(0deg)"); }
} else if (denvuonrun == 0 && denvuonloi == 0) {
denvuon_dem_lag = 0;
dem_den_vuon = 0;
document.getElementById('simudensanvuon').setAttribute('style', "filter: hue-
rotate(230deg)");
varimgs = ["./img/A6.png", "./img/A7.png"];
document.getElementById('simudensanvuon').src = imgs[dem_den_vuon];
clearTimeout(ID_denvuon);
} else if (denvuonloi == 1 && denvuon_lag1 == 0 || denvuonrun == 1 && denvuonloi == 1 && denvuon_lag1 == 0) {
clearTimeout(ID_denvuon);
document.getElementById('simudensanvuon').setAttribute('style', "filter: hue-
rotate(0deg)");
varID_denvuon1 = setInterval(changedenvuon1, 500);
denvuon_lag1++;
functionchangedenvuon1() {
varimgs = ["./img/A6.png", "./img/den.png"];
document.getElementById('simudensanvuon').src = imgs[dem_den_vuon];
dem_den_vuon++; if (dem_den_vuon >= 2) { dem_den_vuon = 0; } if (denvuonloi == 0) { denvuon_lag1 = 0; denvuon_dem_lag = 0;
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 120
dem_den_vuon = 0;
document.getElementById('simudensanvuon').setAttribute('style', "filter: hue-
rotate(230deg)"); clearInterval(ID_denvuon1); } } } // Đèn sưởi
if (densuoirun == 1 && densuoiloi == 0 && densuoi_dem_lag == 0) {
varID_densuoi = setTimeout(changekeomo, 100);
densuoi_dem_lag++;
functionchangekeomo() {
varimgs = ["./img/A6.png", "./img/A7.png"];
dem_den_suoi++;
document.getElementById('simudensuoi').src = imgs[dem_den_suoi];
document.getElementById('simudensuoi').setAttribute('style', "filter: hue-
rotate(0deg)"); }
} else if (densuoirun == 0 && densuoiloi == 0) {
densuoi_dem_lag = 0;
dem_den_suoi = 0;
document.getElementById('simudensuoi').setAttribute('style', "filter: hue-
rotate(230deg)");
varimgs = ["./img/A6.png", "./img/A7.png"];
document.getElementById('simudensuoi').src = imgs[dem_den_suoi];
clearTimeout(ID_densuoi);
} else if (densuoiloi == 1 && densuoi_lag1 == 0 || densuoirun == 1 && densuoiloi ==
1 && densuoi_lag1 == 0) {
clearTimeout(ID_densuoi);
document.getElementById('simudensuoi').setAttribute('style', "filter: hue-
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 121
varID_densuoi1 = setInterval(changedensuoi1, 500);
densuoi_lag1++;
functionchangedensuoi1() {
varimgs = ["./img/A6.png", "./img/den.png"];
document.getElementById('simudensuoi').src = imgs[dem_den_suoi];
dem_den_suoi++; if (dem_den_suoi >= 2) { dem_den_suoi = 0; } if (densuoiloi == 0) { densuoi_lag1 = 0; densuoi_dem_lag = 0; dem_den_suoi = 0;
document.getElementById('simudensuoi').setAttribute('style', "filter: hue-
rotate(230deg)"); clearInterval(ID_densuoi1); } } } // lấy data từ plc
$('#nhiet-do').text(result["nhietdo"] + " Độ C");
$('#do-am').text(result["doam"] + " %");
});
}, 1000); // SetInterval (Cứ sau 1000 ms thì sẽ reload 1 lần) });
//////////////////////////////////////////////////////////////////////
Nhóm 45 GVHD: Th.S Nguyễn Tấn Hòa Trang 122 // Lắng nghe sựkiện click từ id btn-den và thựchiện câu lệnh.
// Dừngkhẩncấp
$("#dungkhancap").click(function() { if (statusdungkhancap == 1) {
ulr = 'io.html';
name = '"DATA_TRUYEN_MASTER".DUNG_KHAN_CAP';
sdata = escape(name) + '=' + 0;
$.post(ulr, sdata, function(result2) {});
} else {
ulr = 'io.html';