Đang tải... (xem toàn văn)
Hướng dẫn kết điều khiển động cơ bằng web server cho PLC S71200. Ngày nay, với sự phát triển không ngừng của khoa học kỹ thuật, việc ứng dụng các linh kiện bán dẫn đã phần nào giảm bớt được giá thành sản phẩm bằng các linh kiện rời. Ứng dụng môn kỹ thuật điện – điện tử vào thiết kế các bộ phận thiết thực hằng ngày giúp chúng ta hiểu được môn học này làm gì và được ứng dụng vào đâu. Việc sử dụng trang web để điều khiển và vận hành động cơ trong các nhà máy sẽ tạo nhiều thuận lợi trong việc quản lý và kiểm soát nhanh chóng.
TRƯỜNG ĐẠI HỌC SPKT VĨNH LONG KHOA ĐIỆN - ĐIỆN TỬ - // - ĐỒ ÁN CHUYÊN NGÀNH ĐIỀU KHIỂN ĐỘNG CƠ S7-1200 BẰNG WEB SERVER Chuyên ngành: Điện – Điện tử SVTH: NGUYỄN LÊ BÌNH MSSV: 18003015 SVTH: NGUYỄN HỮU HIẾU MSSV: 18003045 Lớp: ĐH CNKT ĐĐT 2018 Khóa: 2018 – 2022 GVHD: Phạm Thị Kim Thuê Vĩnh Long,Ngày Tháng Năm 2021 TRƯỜNG ĐẠI HỌC SPKT VĨNH LONG KHOA ĐIỆN – ĐIỆN TỬ PHIẾU GIAO ĐỒ ÁN KT Đ-ĐT Tên đồ án: LẬP TRÌNH ĐIỀU KHIỂN GIÁM SÁT THIẾT BỊ QUA WEBSERVER Nhiệm vụ (nêu nội dung liệu ban đầu): Nghiên cứu cấu hình web server S7-1200 Phần mềm lập trình Web Visual Studio Thiết kế giao diện Web, điều khiển bit, byte, word Thuyết minh báo cáo Phương pháp đánh giá: Báo cáo trước hội đồng Chấm thuyết minh Ngày giao đồ án: ngày 19 tháng năm 2021 Ngày hoàn thành đồ án: ngày 25 tháng năm 2021 Số lượng sinh viên thực đồ án: (không sinh viên) Họ tên sinh viên: Nguyễn Hữu Hiếu Nguyễn Lê Bình Trưởng khoa/Bộ môn (Ký ghi rõ họ tên) MSSV 18003045 MSSV 18003015 TP VL, ngày tháng năm 2021 Giảng viên hướng dẫn (Ký ghi rõ họ tên) Phạm Thị Kim Thuê NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN - Ý thức thực hiện: - Nội dung thực hiện: - Hình thức trình bày: - Tổng hợp kết quả: Tổ chức báo cáo trước hội đồng Tổ chức chấm thuyết minh Mục Lục Bảng1.1 Các số cổng gán cho giao thức ứng dụng chạy TLS/SSL Bảng 1.2 Các thành phần thông tin trạng thái Session SSL Bảng 1.3 Các thành phần thơng tin trạng thái nối kết SSL Hình 2.1 Thiết lập web sever Hình 2.2 Trình duyệt web PLC Hình 2.3 Trang trạng thái biến cho phép bạn xem sửa đổi thẻ PLC Hình 2.4 Hiển thị web máy tính bảng Hình 2.5 Nạp web cho PLC Hình 2.6 Các hàm”Tạo Khối” Hình 2.7 Tệp html Hình 2.8 Các tệp đóng gói vào mảng Hình 2.9 Các khối tệp Hình 2.10 Gọi hàm WWW Hình 2.11 Chèn hàm WWW Hình 2.12 Xử lý truy xuất Hình 2.13 Vào trang liên kết với PLC Hình 2.14 Liên kết trang Hình 2.15 Định dạng URL Hình 2.16 Sửa tệp tạo khối liệu Hình 2.17 Watch and force tables Hình 2.18 Sửa đổi "index.htm" Hình 2.19 Cập nhật web Hình 2.20 Reset trang web Hình 2.21 Tải JQuery chép vào "UserFiles" Hình 2.22 Tạo biến Hình 2.23 sửa đổi index.htm Hình 2.24 Đăng nhập vào PLC Hình 2.25 Truy cập trực tuyến với PLC Hình 2.26 Sửa đổi index.htm Hình 2.26 Giá trị HTML gán cho thẻ chuỗi Hình 2.27 Xử lý bit Hình 3.1 Tính nhắc mã Intellisense Visual Studio Code Hình 3.2 Thanh Sidebar Hình 3.3 Thanh Search Hình 3.4 Thanh GIT Hình 3.5 Chức debugger Hình 3.6 Thanh trạng thái Hình 3.7 Khung nhập lệnh Hình 3.8 Intellisense Hình 3.9 Code Snippet Hình 3.10 Peek Definition Hình 3.11 Quản lý code Git Hình 3.12 Debug Hình 4.1 Giao diện web Hình 4.3 Cài đặt web sever Hình 4.4 Tạo tài khoản quản lý trình duyệt Hình 4.5 Chỉ đường dẫn vào file chứa web LỜI CẢM ƠN Để hoàn thành đồ án em xin gửi lời cảm ơn chân thành đến Ban Giám Hiệu trường Đại Học Sư Phạm Kỹ Thuật Vĩnh Long tạo điều kiện sở vật chất với hệ thống thư viện đại, đa dạng loại sách, tài liệu thuận lợi cho việc tìm kiếm, nghiên cứu thơng tin Cảm ơn q Thầy Cơ tận tình giảng dạy cung cấp cho em nhiều kiến thức quý báo suốt trình học tập trường từ tạo điều kiện thuận lợi cho em trình thực đồ án Xin cảm ơn giảng viên môn – Cô Phạm Thị Kim Thuê giúp đỡ hướng dẫn em tận tình thời gian em thực đồ án này, tạo cho em tiền đề, kiến thức để tiếp cận vấn đề, phân tích giải vấn đề Nhờ mà em làm báo cáo tốt Do kiến thức thân hạn chế, bước đầu làm quen với việc nghiên cứu, nên có nhiều cố gắng khơng tránh thiếu sót Vì vậy, em mong nhận ý kiến đóng góp quý báo thầy để báo cáo hồn thiện tốt Em xin chân thành cảm ơn! LỜI NÓI ĐẦU Ngày nay, với phát triển không ngừng khoa học kỹ thuật, việc ứng dụng linh kiện bán dẫn phần giảm bớt giá thành sản phẩm linh kiện rời Ứng dụng môn kỹ thuật điện – điện tử vào thiết kế phận thiết thực ngày giúp hiểu mơn học làm ứng dụng vào đâu Việc sử dụng trang web để điều khiển vận hành động nhà máy tạo nhiều thuận lợi việc quản lý kiểm soát nhanh chóng Hiểu lợi ích đó, chúng em chủ động nghiên cứu đề tài để trao dồi theo kiến thức trước trường Trong đề tài cịn nhiều thiếu sót mong góp ý q thầy bạn để hồn thiện CHƯƠNG 1: TỔNG QUANG VỀ WEB SEVER 1.1 Giới thiệu web sever 1.1.1 Khái niệm - Web Application ứng dụng, thường bao gồm tập hợp cript cư trú web sever tương tác với database hay nguồn nội dung động khác (dynamic content) Ứng dụng nhanh chóng sử dụng rộng rãi cho phép nhà cung cấp dịch vụ khách hang sử dụng chia sẻ nội dung theo cách độc lập thông qua sở hạ tầng internet Một vài ví dụ web application như: công cụ search, webmail, shopping cart portal system 1.1.1.1 Cấu trúc - Về bản, ứng dụng web bao gồm vài thành phần, thành phần web server, nội dung ứng dụng web server, nơi tiêu biểu nơi lưu trữ liệu cuối cho dao diện truy cập ứng dụng Đây mục tiêu ứng dụng - Cấu trúc ứng dụng web tạo thành phần sau: + Web server + Nội dung ứng dụng (Application content) + Lưu trữ liệu (Datastore) 1.1.1.2 Hoạt động ứng dụng web - Hình bên mơ mơ hình web ba tầng Tầng thơng thường trình duyệt web giao diện người dùng Tầng thứ hai công nghệ kỹ thuật tạo nội dung động java servlets (JPS) hay Active Server Pages (ASP) Còn tầng thứ ba sở liệu chứa nội dung liệu người dùng (Username, Password, mã số bảo mật xã hội, Chi tiết thẻ tính dụng) - Quá trình hoạt động bắt đầu với yêu cầu tạo từ người dùng trình duyệt gửi qua Internet tới trình chủ Web ứng dụng (Web application Server) Web ứng dụng truy cập máy chủ chứa sở liệu để thực nhiệm vụ yêu cầu: cập nhật, truy vấn thông tin nằm sở liệu Sau ứng dụng Web gửi thơng tin lại cho người dùng qua trình duyệt 1.1.1.3 Kết nối với sở liệu Một ứng dụng phải viết ngôn ngữ chủ hổ trợ hệ thống đặc biệt Mỗi DBMS (Database Managerment System) có cách sở hữu ứng dụng cho phép sử dụng Ưu điểm SQL làm dễ dàng nhà phát triển để chuẩn hóa liệu định nghĩa liệu thao tác hầu hết nhà quản trị sở liệu chọn SQL ngôn ngữ truy vấn họ Tuy nhiên, ứng dụng phân chia sở liệu đạt ưu điểm mơ hình lập trình Client-Server Giao diện ứng dụng với sở liệu phương pháp kết nối sỏ liệu APIs cung cấp với ngơn ngữ lập trình sử dụng để phát triển ứng dụng Những kết nối sở liệu APIs lưu trữ thơng tin kết nối sở liệu ủy nhiệm thư, chúng có khả để gởi câu truy vấn SQL đến sở liệu, nhận kết từ câu truy vấn trả chúng lại cho ứng dụng Có cách phổ biến giao diện ứng dụng web với sở liệu sau cùng: - Native database APIs - ODBC - JDBC 1.1.2 Các vấn đề liên quan đến ứng dụng web Các ứng dụng Web phát triển từ nhiều nguồn khác nhau, nên lỗ hổng, lỗi bảo mật đa dạng Tuy vậy, ứng dụng Web chủ yếu phát triển từ nguồn sau đây: - Sử dụng ứng dụng Web từ mã nguồn mở (thường gọi open source không theo dõi cập nhật vá lỗi bảo mật) - Ứng dụng web phát triển từ người lập trình, mà họ không quan tâm nhiều thiếu kinh nghiệm việc bảo mật cho ứng dụng Họ khơng có đội ngũ chuyên kiểm tra lỗi bảo mật nên trang web thường có nhiều lỗ hổng - Phát triển ứng dụng Web từ ứng dụng mở khác người phát triển thường không kiểm tra lỗi bảo mật ứng dụng cũ trước phát triển tiếp, nên tồn lỗi bảo mật Ngày phát triển bùng nổ Internet, nên ứng dụng web sử dụng rộng rãi nhiều lĩnh vực báo điện tử, trang giao dịch trực tuyến, trang quảng cáo điện tử, web thơng tin doanh nghiệp hay phủ Chính phát triển rộng rãi nên ứng dụng web ln bị người ta tìm cách khai thác lỗ hổng với mục đích khác 1.2 Tổng quang web sever 1.2.1 Định nghĩa Web Server Web Server máy chủ có dung lượng lớn, tốc độ cao, dùng để lưu trữ thông tin ngân hàng liệu, chứa website thiết kế với thông tin liên quan khác (các mã Script, chương trình, file Multimedia) Web Server có khả gửi đến máy khách trang Web thông qua môi trường Internet (hoặc Intranet) qua giao thức HTTP, giao thức thiết kế để gửi file đến trình duyệt Web (Web Browser), giao thức khác Tất Web Server có địa IP (IP Address) có Domain Name Giả sử người sử dụng đánh vào Address trình duyệt máy dịng http://www.abc.com sau gõ phím Enter, người sử dụng gửi yêu cầu đến Server có Domain Name www.abc.com Server tìm trang Web có tên index.htm gửi đến trình duyệt người sử dụng Bất kỳ máy tính trở thành Web Server việc cài đặt lên chương trình phần mềm Server Software sau kết nối vào Internet Khi máy tính kết nối đến Web Server gửi đến yêu cầu truy cập thông tin từ trang Web đó, Web Server Software nhận yêu cầu gửi lại thông tin mà người sử dụng mong muốn Web Server Software ứng dụng phần mềm Web Server Software cài đặt, chạy máy tính dùng làm Web Server, nhờ có chương trình mà người sử dụng truy cập đến thông tin trang Web từ máy tính khác mạng (Internet, Intranet) Web Server Software cịn tích hợp với CSDL (Database), hay điều khiển việc kết nối vào CSDL để truy cập kết xuất thơng tin từ CSDL lên trang Web truyền tải chúng đến người dùng Tất Web Server hiểu chạy file *.htm *.html, nhiên Web Server lại phục vụ số kiểu file chuyên biệt chẳng hạn IIS Microsoft dành cho *.asp, *.aspx ; Apache dành cho *.php ; Sun Java System Web Server dành cho *.jsp Phần lớn Web server sử dụng cổng 80, thay đổi để Webserver cài đặt cổng không tiêu chuẩn muốn "dấu" Web server Web server đa host máy tính việc ánh xạ server cho cổng khác 1.2.2 Nguyên lý hoạt động Web Server Khi ta gõ địa trang web “http://www.abc.com/” vào trình duyệt web nhấn Enter, trang web hiển thị hình Theo mơ hình trên, trình duyệt web thực kết nối tới máy chủ web, yêu cầu trang web nhận lại Sau đây, thứ tự bước xảy đến đằng sau hình bạn: Trình duyệt web tách địa website làm phần: Phần giao thức: (“http”) Máy chủ tên miền: (www.abc.com) Tên tệp: (“index.htm”) Trình duyệt liên hệ với máy chủ tên miền để chuyển đổi tên miền "www.abc.com" địa IP (Internet Protcol) Sau đó, trình duyệt gửi tiếp kết nối tới máy chủ có địa IP tương ứng qua cổng 80 Dựa giao thức HTTP, trình duyệt gửi yêu cầu GET đến máy chủ, yêu cầu tệp "http://www.abc.com/index.htm" (cookies gửi kèm theo từ trình duyệt web đến máy chủ) Tiếp đến, máy chủ gửi đoạn text dạng HTML đến trình duyệt web máy gởi yêu cầu (cookies gửi kèm theo từ máy chủ tới trình duyệt web, cookies ghi đầu trang trang web) Trình duyệt web đọc thẻ HTML, định dạng trang web kết xuất hình 1.2.3 Web Client - WebClient Là giao diện phía người dùng đầu cuối (Client), dùng để tạo giao diện tương tác người dùng ứng dụng Web (User Interface) - Các cơng nghệ/ ngơn ngữ lập trình hỗ trợ cho WebClient +Công nghệ: PhotoShop, Flash, Silver Light (Microsoft)v v… +Ngôn ngữ: html, css, javascript v.v… Để đọc trang Web ứng dụng Web máy người dùng phải cài trình duyệt (Browser), ví dụ: FireFox, IE, Chrome, Coccoc (VN) v.v… 1.3 Các giao thức sử dụng web sever 1.3.1 Giao thức HTTP HTTP chữ viết tắt từ HyperText Transfer Protocol (giao thức truyền tải siêu văn bản) Nó giao thức mà World Wide Web sử dụng HTTP xác định cách thơng điệp (các file văn bản, hình ảnh đồ hoạ, âm thanh, video, file multimedia khác) định dạng truyền tải sao, hành động mà Web server (máy chủ Web) trình duyệt Web (browser) phải làm để đáp ứng lệnh đa dạng Chẳng hạn, bạn gõ địa Web URL vào trình 10 50 - Hiện tại, Visual Studio Code hỗ trợ debug file JavaScript TypeScript Trước debug, ta phải cấu hình cách click vào biểu tượng bánh để tạo file “launch Json” Lúc này, Visual Studio Code khung nhập lệnh để hỏi ta muốn debug mơi trường Ta có nhiều lựa chọn, đơn giản dùng Node.js Cũng file cấu hình khác Visual Studio Code, file theo định dạng JSON Debug chia làm chế độ: Launch Attach Launch nghĩa ta chạy debugger trực tiếp file, Attach nghĩa ta gắn debugger vào tiến trình khác chạy, cụ thể Node.js Ta thay đổi chế độ danh sách kế bên nút Start Cũng file cấu hình, tơi thay đổi đường dẫn đến file cần debug thuộc tính program Cấu hình xong, ta bắt đầu debug - Để debug, ta vào file cần kiểm tra click vào đầu dòng để đặt breakpoint Một chấm đỏ xuất đánh dấu chỗ dừng code chạy tới Tiếp theo, ta chọn chế độ Launch nhấn nút Start Debugger chạy code dừng breakpoint Các thông tin khung bên trái cập nhật Phía trên, ta thấy nút Hình 3.12 Debug điều khiển: Continue, Step Over, Step Into, Step Out, Restart, Stop Tôi nghĩ bạn biết chức nút nên tơi khơng phải nói nhiều chúng Như đề cập phần giới thiệu biểu tượng sidebar, bạn nên tìm hiểu thêm debug chưa rành 3.2.13 Chạy task tự động - Trong quy trình viết code JavaScript đại, ta khơng cịn phải thực thao tác thủ cơng nhàm chán Visual Studio Code hỗ trợ tận tính tự động hóa này, cho phép chạy task thông qua task runner tiếng Gulp, Grunt Nếu viết code TypeScript ECMAScript 6, ta transpile sang JavaScript tự động phím tắt save 3.2.14 Chuẩn bị - Các task runner phổ biến chạy môi trường Node.js Do đó, bạn phải cài Node.js nodejs.org máy chưa có Sau đó, ta tạo file “package Json” để lưu cấu hình cho dự án Ta tạo file cách thủ công, nhiên, cách nhanh để npm tạo giúp Ta vào cửa sổ dịng lệnh, sau di chuyển vào thư mục dự án Tiếp theo, ta gõ lệnh npm init Lúc này, npm hỏi ta vài câu hỏi thông tin dự án Bạn bỏ qua câu hỏi khơng muốn trả lời phím Enter Sau hồn tất, file “package Json” tạo thư mục dự án 51 3.2.15 Cấu hình task - Để sử dụng task, ta cần có file cấu hình “tasks Json" Để tạo file Visual Studio Code, ta mở khung nhập lệnh (Ctrl + Shift + P), gõ từ khóa task Một danh sách lệnh có liên quan đến task Ở đây, ta chọn mục Configure Task Runner Visual Studio Code tạo thư mục “ vscode” chứa “tasks Json” Bên file ghi hướng dẫn cấu hình task runner thơng dụng Muốn sử dụng task runner ta bỏ ghi phần Để cho đỡ rối, tơi xóa tồn nội dung file gõ lại tay thơng số cấu hình 3.2.16 Biên dịch ECMAScript tự động với Babel - Trước tiên, ta phải cài Babel cho dự án npm Ta chạy hai dòng lệnh sau: - Tiếp theo, ta mở file tasks.json nhập vào thông tin sau: - Thuộc tính command đường dẫn để chạy lệnh Vì ta cài Babel npm, nên nằm thư mục node_modules Ngoài ra, ${workspaceRoot} biến chứa đường dẫn đến thư mục dự án Tại thuộc tính taskName, ta đặt tên cho task tùy ý Đặc biệt, ta phải chuyển suppressTaskName sang true để Visual Studio Code không tự ý chèn tên task vào dịng lệnh Thuộc tính isBuildCommand để thông báo task dùng để build Khi cần chạy task này, ta nhấn tổ hợp phím Ctrl + Shift + B để tiến hành biên dịch ECMAScript Cuối cùng, thuộc tính args chứa thơng số cho dịng lệnh Tơi thích code chức thơng số Ngồi ra, bạn tham khảo thêm thơng số khác trang documentation Babel 52 - Để chạy thử task, ta viết vài dòng ECMAScript vào file thư mục js Sau đó, ta nhấn Ctrl + Shift + B để chạy task Cửa sổ Output thông báo biên dịch thành công Lúc này, thư mục dự án xuất thư mục tên out bên chứa file JavaScript chuyển từ ECMAScript - Nếu bạn viết ECMAScript 6, dùng tạm đoạn code sau để thử nghiệm: - Tuy nhiên, lần thay đổi code ta phải bấm Ctrl + Shift + B để chạy task bất tiện Do vậy, ta chạy task chế độ watch, có thay đổi xảy file, tự động biên dịch Để làm việc này, ta thêm đoạn code cấu hình sau vào mảng tasks file tasks.json - Để chạy task này, ta dùng Ctrl + Shift + B, khơng phải build command (isBuildCommand false) Do đó, ta phải mở khung nhập lệnh Ctrl + P, sau gõ task gõ khoảng trắng Danh sách task có file tasks.json Ta chọn babel-watch nhấn Enter - Lúc này, trạng thái, ta thấy biểu tượng xoay Biểu tượng cho biết có task chạy Bây giờ, ta thay đổi code file thư mục js, sau nhấn Ctrl + S để save Ngay lập tức, Visual Studio Code cho biên dịch file Để tắt task chạy, ta mở khung nhập lệnh, gõ Terminate Running Task, sau nhấn Enter 53 54 3.2.17 Biên dịch TypeScript tự động - Để biên dịch TypeScript, trước tiên ta phải cài đặt package TypeScript npm: - Tiếp theo, ta mở tasks.json lên thêm vào nội dung sau: - Ở thuộc tính args, dùng thông số -p để định thư mục dự án (dấu chấm nghĩa thư mục tại) Tiếp theo, ta tạo thêm file tên tsconfig.jsonnằm thư mục dự án để cấu hình trình biên dịch TypeScript File có nội dung sau: - Bây giờ, ta chạy task Ctrl + Shift + B Visual Studio Code biên dịch tất file ts thư mục dự án tạo file js tương ứng Vì ta bật thuộc tính sourceMap sang true nên trình biên dịch TypeScript tạo file source map tương ứng Các file dùng để debug TypeScript trình bày phần Debug 55 Chương 4: Thiết kế Giao diện Lập trình S7-1200 4.1 Thiết kế giao diện 4.1.1 Sơ lược Để viết giao diện cho Web Sever, sử dụng phần mềm Visual Studio Code Với phần mềm ta dễ dàng thiết kế giao diện theo ý muốn Ngoài ra, thực lệnh gửi nhận bit để điều khiển PLC điều khiển động cơ, thu thập liệu từ PLC gửi liệu xuống PLC thể trang web Về đề tài, chúng em thiết kế trang web để điều khiển động với nút khởi động, nút dừng đèn báo 4.1.2 Lập trình Visual Studio Code B1: Chúng ta cần tạo New Folder để gom chúng file web: - dieukhien.html(file để viết chương trình) - dulieu.html(liên kết với ngõ PLC) - guidulieu.html(dùng để gửi bit điều khiển vào ngõ vào PLC) B2: Chương trình chính: - Chúng ta cần khai báo cho chương trình tạo tệp style.css(dung để định dạng trang web Điều khiển động Web Sever // Muốn đèn sáng phải nhúng //Khai bao bien toan cuc var Start; var Stop; var Motor; - Sau khai báo xong bắt đầu với phần giao diện web 56 ĐIỀU KHIỂN ĐỘNG CƠ BẰNG S7-1200 Web Sever Đèn Bá o Start Stop - Giao diện đưa vào web Hình 4.1 Giao diện web 57 - Sau có phần điều khiển ta bắt đầu với lệnh điều khiển bit PLC Có nhiều phương thức để lập trình Javascript, Json…Và phần lập trình viết JSON: function loadXML(){ if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveX0bject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = function () { if (xmlhttp.readyState==4 && xmlhttp.status==200) { var arr = xmlhttp.responseText.toString().match(/[^\r\n]+/g); Start = parseFloat(arr[0]); Stop = parseFloat(arr[1]); Motor = parseFloat(arr[2]); //Gọi hàm kiểm tra đèn sáng Lamp1(); } } xmlhttp.open("GET","dulieu.html",true); xmlhttp.send(); setTimeout('loadXML()',2000); } //======================= // nut nhan var bitStart = "0"; var bitStop = "0"; // //Bat dau phan Stop function guiStart(){ var xmlhttp; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveX0bject("Microsoft.XMLHTTP"); } xmlhttp.open("POST","guidulieu.html",true); xmlhttp.send("\"Start\"="+ bitStart); 58 } //Nha chuot trai Reset toan bo bien Start, Stop function mouseDown_Start() { bitStart = "1"; guiStart(); } function mouseUp_Start() { bitStart = "0"; guiStart(); } //Bat dau phan Stop function guiStop(){ var xmlhttp; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveX0bject("Microsoft.XMLHTTP"); } xmlhttp.open("POST","guidulieu.html",true); xmlhttp.send("\"Stop\"="+bitStop); } function mouseDown_Stop() { bitStop = "1"; guiStop(); } function mouseUp_Stop() { bitStop = "0"; guiStop(); } //Ket thuc phan gui Stop // -// Den bao // -function Lamp1() { if (Motor == "1") { lamp_color = "#ff5147"; } else { lamp_color = "#007eff"; } document.getElementById('cir_start').style.fill = lamp_color; } 59 B3: Chúng ta cần tạo hai file dulieu.html guidulieu.html để giao tiếp với PLC: :="Start": :="Stop": :="Motor": B4: Tạo file style.css để định dạng cho web //Định dạng cho chương trình #main{ border: 3px solid rgba(2, 1, 5, 0.452); margin-left: 350px; margin-right: 350px; margin-top: 50px; background-image: url('hinhnen.jpg'); } //Định dạng cho tiêu đề hình cho web #titel{ width: 500px; position: relative; left: 95px; top: 10px; font-size: 35fx; color: whitesmoke; text-align: center; } //Định dạng cho nút Start #Btn_Start { background-color: tomato; border-radius: 100%; border: 2px solid black; color: black; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 4px 2px; cursor: pointer; stroke: black; stroke-width: 15px; position: relative; left: 115px; top:-100px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; 60 -o-border-radius: 100%; } //Định dạng cho nút Stop #Btn_Stop { background-color: yellow; border-radius: 100%; border: 2px solid black; color: black; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 4px 2px; cursor: pointer; stroke: black; stroke-width: 15px; position: relative; left: 5px; top: -20px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; } 4.2 Lập trình PLC Lập trình điều khiển động gọi khối WWW để liên kết với web Hình 4.2 Lập trình điều khiển động B2: Truy cập vào properties→web sever 61 Hình 4.3 Cài đặt web sever + Tạo tài khoản phần quyền theo yêu cầu Hình 4.4 Tạo tài khoản quản lý trình duyệt + Chỉ đường dẫn vào thư mục web→Generate blocks, sau nhấn OK Hình 4.5 Chỉ đường dẫn vào file chứa web Sau thực xong ta làm theo hướng dẫn Chương 62 Kết Luận Với cơng nghiệp hóa đại hóa điều khiển thiết bị động tạo nhiều thuận lợi cho việc quản lý quy trình nhà máy, xí nghiệp Vì thế, cần trao dồi thêm kiến thức phần mềm lập trình phương pháp điều khiển để tạo thuận lợi cho việc tìm kiếm việc làm sau trường Phương pháp điều khiển động web sever giúp tiết kiệm nguồn nhân lực, dễ kiểm soát hoạt động máy móc 63 Tài liệu tham khảo https://www.dmcinfo.com/latest-thinking/blog/id/8567/siemens-s7-1200-web- server- tutorial from-getting-started-to-html5-user-defined-pages https://www.w3schools.com/ 64 ... Hình 2. 22 Tạo biến Hình 2. 23 sửa đổi index.htm Hình 2. 24 Đăng nhập vào PLC Hình 2. 25 Truy cập trực tuyến với PLC Hình 2. 26 Sửa đổi index.htm Hình 2. 26 Giá trị HTML gán cho thẻ chuỗi Hình 2. 27 Xử... Phương pháp đánh giá: Báo cáo trước hội đồng Chấm thuyết minh Ngày giao đồ án: ngày 19 tháng năm 20 21 Ngày hoàn thành đồ án: ngày 25 tháng năm 20 21 Số lượng sinh viên thực đồ án: (không sinh... trang Hình 2. 15 Định dạng URL Hình 2. 16 Sửa tệp tạo khối liệu Hình 2. 17 Watch and force tables Hình 2. 18 Sửa đổi "index.htm" Hình 2. 19 Cập nhật web Hình 2. 20 Reset trang web Hình 2. 21 Tải JQuery
