HTML và Webserver S7 1200 Diễn Đàn PLC Việt Nam – chauvinhloigmail com CHÂU VĨNH LỢI 1 Lời mở đầu Lời mở đầu Ngày nay, khoa học công nghệ đang phát triển với tốc độ rất nhanh Các sản phẩm công nghệ d.
Lời mở đầu Lời mở đầu Ngày nay, khoa học công nghệ phát triển với tốc độ nhanh Các sản phẩm cơng nghệ phải bắt kịp xu thời đại đáp ứng u cầu người sử dụng Chính nhà sản xuất luôn cập nhật không ngừng đổi để tạo sản phẩm có tính ứng dụng cao Siemens nhà sản xuất đầu việc tạo sản phẩm ứng dụng công nghệ đại Dễ thấy sản phẩm gần Siemens lĩnh vực tự động hóa cơng nghiệp tích hợp khả truyền thơng mạng mạnh mẽ mà S7-1200 dịng sản phẩm tiêu biểu Một tính đáng ý dịng S7-1200 Webserver Thực tính khơng phải lạ việc tích hợp cổng truyền thông PROFINET mức giá hấp dẫn làm cho S7-1200 trở nên phổ biến tính Webserver khai thác mạnh mẽ Với tính Webserver, bạn điều khiển giám sát hệ thống thiết bị di động có hỗ trợ kết nối mạng Điều cho phép bạn truy cập vào hệ thống lúc nơi Webserver S7-1200 bao gồm thành phần HTML AWP Ngồi cịn có thành phần bổ trợ khác CSS hay Javascript Tài liệu tập trung vào việc hướng dẫn bạn cách tạo trang web ngôn ngữ HTML tích hợp AWP để tạo thành Webserver hồn chỉnh Để hiểu rõ tài liệu này, yêu cầu bạn phải có: • • • Kiến thức máy tính Kiến thức PLC S7-1200 cách sử dụng phần mềm TIA Portal PLC S7-1200 (vì chưa thể mơ dịng PLC này, download kiểm tra trực tiếp) Tài liệu biên soạn nhằm mục đích giúp bạn rút ngắn thời gian tự nghiên cứu Tác giả có sử dụng số tài liệu tham khảo sau: • • Hướng dẫn thiết kế Web – Aweb.vn S7-1200 System Manual - Siemens Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI HTML Webserver S7-1200 Khái niệm HTML AWP HTML gì? HTML (Hyper Text Makeup Language) ngơn ngữ lập trình web đơn giản, tạo thành từ thẻ nội dung dạng text Mỗi thẻ bao quanh đối tượng định thuộc tính liên quan đến đối tượng Do đơn giản này, ta dùng chương trình soạn thảo văn để tạo file html (như Word, Notepad,…) File HTML gọi “trang web” Trong tài liệu này, tác giả sử dụng phần mềm Notepad++ để viết code web Notepad++ công cụ hữu ích cho lập trình viên, hỗ trợ nhiều loại ngơn ngữ lập trình khác có HTML Notepad++ phân chia bố cục rõ ràng cho thành phần code giúp người lập trình quản lí tốt chương trình viết Bạn download Notepad++ theo địa chỉ: http://notepad-plus-plus.org/ AWP AWP (Automation Web Programming) ngơn ngữ web Siemens phát triển cho dịng PLC tích hợp tính Webserver AWP thực chất dòng ghi trang HTML PLC biên dịch hiểu Từ truy cập liệu PLC thơng qua AWP Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI Thiết kế trang web đơn giản HTML Căn Thiết kế trang web đơn giản Cấu trúc trang HTML HTML Structrue Tiêu đề trang Web Đề mụcnội dung thứ nhất
nội dung thứ hai
… Giải thích: Một cặp thẻ HTML bao gồm Nội dung Trong ví dụ ta thấy có cặp thẻ sau: … dùng để định nghĩa trang HTML; … dùng để định nghĩa phần tiêu đề cho trang HTML; … dùng để định nghĩa phần thân trang HTML; … dùng để xác định tiêu đề trang web; thẻ đặc biệt dùng để định nghĩa thuộc tính trang web loại mã sử dụng, thời gian refresh…; … dùng để xác định nội dung bên đề mục;…
dùng để xác định đoạn văn chứa nội dung web; thẻ dùng để xuống dòng (brake); … thẻ dùng để in đậm nội dung bên trong; Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI HTML Webserver S7-1200 … thẻ dùng để in nghiên nội dung bên trong; … thẻ dùng để gạch chân nội dung bên trong; Bài tập nhỏ Hãy soạn trang HTML đơn giản sau: CODE Thiết kế Webserver S7-1200 Diễn đàn PLC Việt NamDiễn đàn PLC Việt Nam diễn đàn tự động hóa tiếng có uy tín nước ta Với đội ngũ hỗ trợ nhiệt tình, dày dạn kinh nghiệm kiến thức chun mơn vững chắc, diễn đàn PLC Việt Nam trở thành nơi giao lưu học hỏi hiệu cho anh em ngành kĩ thuật nói chung tự động hóa nói riêng.
Nội dung diễn đàn đa dạng phong phú với nhiều mảng kiến thức khác từ phần mềm, thiết bị đến dự án thực tế hay chí tâm tình, trăn trở băn khoăn nghề.
Các hoạt động thực tếHằng năm diễn đàn thường tổ chức buổi hội thảo chuyên đề để chia sẻ kinh nghiệm thực tế giới thiệu công nghệ Thường xuyên mở khóa đào tạo giúp người tiếp cận với cơng nghệ tự động hóa cách nhanh nhất.
Ngoài ra, diễn đàn thường tổ chức buổi họp mặt offline để thành viên có dịp giao lưu chia kinh nghiệm ngành Từ thành lập đến nay, diễn đàn trở thành cầu nối vững chắc, liên kết phận kĩ sư, kĩ thuật viên, sinh viên người làm kĩ thuật nói chung tạo nên khối vững chắc, kĩ thuật lớn mạnh nước nhà.
Với phương châm chia sẻ học hỏi, diễn đàn PLC Việt Nam hi vọng đóng góp nhiều vào công nghiệp đất nước, đưa kĩ thuật nước ta tiến lên ngang với nước khu vực giới.
Chung tay xây dựng cộng đồng tự động hóa PLC Việt Nam Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI Thiết kế trang web đơn giản Hướng dẫn thực hiện: • Mở chương trình Notepad++, chuyển sang ngơn ngữ lập trình HTML mã UTF-8 hình dưới: • Gõ lại đoạn code vào Notepad++ Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI HTML Webserver S7-1200 • Save lại mở trình duyệt ta kết sau: Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI Định dạng trang HTML Định dạng trang HTML Như biết cách tạo trang HTML, phần tác giả hướng dẫn cách định dạng cho thành phần HTML Tạo danh sách Danh sách thông thường Để định dạng danh sách kiểu thông thường, ta dùng cặp thẻ- …
- …
- Phần tử thứ nhất Thẻ
- … dùng để xác định nội dung phần tử danh sách
- Phần tử thứ hai …
- Phần tử thứ n
- …
- …
- Loại 1 Danh sách thường loại
- Loại 2 Danh sách thường loại …
- Loại n Danh sách thường loại n
- xác định kiểu đánh thứ tự phần tử danh sách kiểu số (1,2,3…) kiểu chữ in hoa (A,B,C…)… Thẻ
- … dùng để xác định nội dung mục lớn danh sách Thuộc tính Type thẻ
- xác định kiểu đánh thứ tự phần tử danh sách chấm trịn đậm, chấm trịn, hình vng Mỗi mục lớn gồm mục nhỏ xếp thành danh sách dạng thường CHÂU VĨNH LỢI HTML Webserver S7-1200 Định dạng văn Để định dạng văn HTML (màu sắc, font chữ, kích thước,…), ta dùng cặp thẻ … Cú pháp sau: CODE Nội dung Với “Kiểu chữ” tên Font chữ bạn chon (ví dụ “Arial”), “Màu chữ” dãy số hex gồm chữ số mô tả mức độ màu RGB (ví dụ màu trắng “FFFFFF”), “Cỡ chữ” số nguyên lớn (ví dụ “15”) Bài tập nhỏ Hãy soạn trang HTML có nội dung sau: CODE Thiết kế Webserver S7-1200 Diễn đàn PLC Việt Nam Các chuyên mục diễn đàn
- Tự động hóa ứng dụng
- Siemens Automation
- Mitsubishi Electric
- ABB Automation
- Omron Automation
- Rockwell Automation
- Schneider Electric
- IVNT Automation
- Honeywell Automation
- HMI SCADA Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI Định dạng trang HTML CODE
- Hệ thống điều khiển phân tán
- Hệ thống BMS nhà thông minh
- Hệ thống HVAC
- Động DC – Servo – Step – Drive
- …
- Học tập tự động hóa online
- Cơ – điện – điện tử - IT
- Thiết kế M&E – điện công nghiệp
- Vi điều khiển
- …
- Thư viện tài liệu
- Đối tác ngành giáo dục đào tạo
- Khóa học TĐH – Cơ điện – điện tử TP.HCM
- Khóa học TĐH – TT CĐT Hải Dương
- …
- Thông tin dự án trọng điểm
Trạng thái Bit I0.0: :=I0.0:
Dòng lệnh [] cài đặt trang web tự động refresh sau giây để cập nhật thông số Bạn thay đổi giá trị “5” số khác tùy theo yêu cầu Hãy lưu trang web lại, download kiểm tra PLC sau Ghi giá trị xuống PLC Cú pháp Để ghi giá trị xuống PLC, trước hết cần khai báo biến muốn ghi giá trị CODE Sau bạn dùng form với phương thức POST để ghi giá trị vào biến Chẳng hạn: Form text input CODE:
Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI 27 28 HTML Webserver S7-1200 Form select CODE [Tùy chọn 1] [Tùy chọn 2] Ví dụ Dùng text input CODECài đặt mức nước:
Form thực ghi giá trị vào Tag “Tank Level” Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI User Defined Webpage Dùng Select form CODE On Off Form cho phép lựa chọn giá trị On Off cho Tag “Switch”, sau chọn xong nhấn “Xác nhận” để gửi liệu PLC Bài tập nhỏ Hãy soạn trang HTML có nội dung sau: CODE S7 1200 Webserver On Off Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI 29 30 HTML Webserver S7-1200 Ở trang ta khơng cần dịng lệnh tự refresh dùng để điều khiển không giám sát Hãy lưu trang web lại, download kiểm tra PLC sau Thay giá trị số văn Trong thực tế người dùng cuối (end-user), việc giám sát hệ thống thơng qua số phiền tối Có nghĩa trang web thân thiện với người dùng Chẳng hạn bạn có giá trị biến Nhưng thay sử dụng giá trị để hiển thị, ta dùng từ gần gũi với người dùng “Bật” “Tắt”, “Chạy” “Dừng” hay “On” “Off” Ta làm điều thơng qua Javascript Tuy nhiên, S7-1200 hỗ trợ sẵn câu lệnh giúp bạn thực điều cách dễ dàng Đó Enum Cú pháp Để sử dụng Enum, trước hết bạn cần phải khai báo CODE ' Enum='' > Ví dụ CODE Khi Tag động mang giá trị 0, S7-1200 tương đương giá trị với dòng chữ “Đã dừng” Khi Tag động mang giá trị 1, S7-1200 tương đương giá trị với dòng chữ “Đang chạy” Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI User Defined Webpage Bài tập nhỏ Hãy soạn trang HTML có nội dung sau: CODE S7 1200 WebserverTrạng thái Bit Start: :=”Start”:
Hãy lưu trang web lại, download kiểm tra PLC sau Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI 31 32 HTML Webserver S7-1200 Làm việc với Webserver S7-1200 Download chương trình nạp trang web xuống PLC Mở TIA Portal kích hoạt tính Webserver hướng dẫn mục Standard Webpage Tại mục User-defined webpage, click chọn đường dẫn đến thư mục chứa file HTML mà bạn vừa tạo tập nhỏ phần Enum Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI User Defined Webpage Sau xác định file HTML mở mục Default HTML Page Click nút Generate blocks để TIA Portal tiến hành đóng gói liệu web thành Datablock Hãy ý mục Web DB number Click OK để hồn tất q trình khai báo User-defined webpage Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI 33 34 HTML Webserver S7-1200 Mở khối OB1 Tại mục Communication bên phải, click chọn mục WEB server Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI User Defined Webpage Kéo thả khối WWW vào OB1 Khai báo thông số cho khối WWW hình, ý giá trị chân CTRL_DB giá trị Web DB number Tạo tag với tên “Start” địa I0.0 TIA Portal (ở mục PLC tags) sau lưu chương trình lại Download xuống PLC Bây bạn truy cập vào Webserver PLC Truy cập User-defined webpage PLC Mở trình duyệt, nhập địa IP PLC vào địa nhấn Enter Tiếp tục truy cập vào Standard Webpage hướng dẫn phần trước Đăng nhập trang web với quyền admin Khi đăng nhập với quyền admin, bạn phép truy cập vào tất thành phần Webserver bao gồm User-defined webpage Chuyển đến trang User Pages click vào đường dẫn “Homepage of the application” Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI 35 36 HTML Webserver S7-1200 Trang web bạn tạo hiển thị trình duyệt, thay đổi trạng thái bit Start (chân I0.0) quan sát thay đổi trang web Tiếp tục kiểm tra với trang web bạn viết phần trước để nắm thao tác làm việc với User-defined webpage Lưu ý: muốn thay đổi trang Web sử dụng Project, bạn phải khai báo lại mục HTML Directory Default HTML page đồng thời xóa khối liệu web tạo trước cách click vào nút Delete blocks Sau click lại vào nút Generate blocks để tạo khối liệu thao tác bình thường ***** Chúc bạn thành công Diễn Đàn PLC Việt Nam – chauvinhloi@gmail.com CHÂU VĨNH LỢI ... S7- 1200 dịng sản phẩm tiêu biểu Một tính đáng ý dịng S7- 1200 Webserver Thực tính khơng phải lạ việc tích hợp cổng truyền thông PROFINET mức giá hấp dẫn làm cho S7- 1200 trở nên phổ biến tính Webserver. .. thành Webserver hoàn chỉnh Để hiểu rõ tài liệu này, yêu cầu bạn phải có: • • • Kiến thức máy tính Kiến thức PLC S7- 1200 cách sử dụng phần mềm TIA Portal PLC S7- 1200 (vì chưa thể mơ dịng PLC này,... CHÂU VĨNH LỢI 21 22 HTML Webserver S7- 1200 Như hoàn tất việc kích hoạt tính Webserver S7- 1200, mở trình duyệt để truy cập vào server PLC Mở trình duyệt, nhập địa IP PLC vào địa nhấn Enter Sau
