Vi điều khiển PIC18F67J60 được tích hợp sẵn module điều khiển Ethernet. Đây là một giải pháp kết nối hoàn chỉnh, bao gồm cả module Media Access Control (MAC) và Physical Layer transceiver (PHY). Module Ethernet đáp ứng tất cả các chuẩn IEEE 802.3 cho kết nối 10-BaseT cáp đôi xoắn. Có 2 LED output để báo liên kết và trạng thái hoạt động của mạng.
Hình 8: Sơ đồ khối module Ethernet. Module Ethernet gồm 5 khối chức năng chính:
- Khối truyền nhận PHY sẽ mã hóa và giải mã dữ liệu gửi hoặc nhận ở đầu RJ45. - Khối MAC phù hợp với chuẩn IEEE 802.3 cung cấp MIIP (Media Independent Interface Management) để điều khiển PHY.
- Một bộ đệm RAM 8Kbyte để lưu trữ các gói tin truyền nhận.
- Một khối phân xử để điều khiển sự truy cập vào bộ đệm RAM khi được DMA, khối truyền nhận yêu cầu.
- Thanh ghi giao tiếp có chức năng thông dịch những dòng lệnh và tín hiệu trạng thái nội giữa module Ethernet và các thanh ghi đặc biệt của vi điều khiển SFRS.
3.2. Cảm biến nhiệt độ LM35
IC đo nhiệt độ là một mạch tích hợp nhận tín hiệu nhiệt độ chuyển thành tín hiệu điện dưới dạng dòng điện hay điện áp. Dựa vào đặc tính rất nhạy của các bán dẫn với nhiệt độ, tạo ra điện áp hoặc dòng điện tỷ lệ thuận với nhiệt độ tuyệt đối. Đo tín hiệu điện ta biết được giá trị của nhiệt độ cần đo. Sự tác động của nhiệt độ tạo ra điện tích tự do và các lỗ trống trong chất bán dẫn. Bằng sự phá vỡ các phân tử, bứt các electron
thành dạng tự do di chuyển qua vùng cấu trúc mạng tinh thể tạo sự xuất hiện các lỗ trống. Làm cho tỷ lệ điện tử tự do và lỗ trống tăng lên theo quy luật hàm mũ với nhiệt độ.
Các đặc trưng của LM35:
- Ngõ ra là điện áp. - Độ nhạy 10mv/10C
- Sai số cực đại 1,50C khi nhiệt độ lớn hơn 1000C. - Phạm vi sử dụng :00 C=>1000 C
- Cứ10mV tương ứng với 1°C, ở 00C điện áp ra là 0V, tương ứng với giá trị ADC là 0. Với Vref=2.5V, giá trị của ADC từ 0 đến 1023, lấy tròn 1000 mức. Mỗi giá trị ADC ứng với 2.5V/1000= 2.5 mV. Vậy 1 giá trị A/D ứng với 0.25 0C. Muốn tăng độ phân giải A/D ta giảm Vref.
Hình 9: LM35 DZ
3.3. Mạch nguyên lý
3.3.1. Khối mạch nguồn
- Mạch nguồn sử dụng IC ổn áp 7805 để tạo điện áp 5V để nuôi các khối sử dụng điện áp 5V và đưa tới đầu vào của IC ổn áp LM117. Tại đầu ra của LM117 là điện áp 3.3V dùng để cấp nguồn cho vi điều khiển và các khối khác trong mạch sử dụng điện áp 3.3V.
- Tại đầu vào của IC 7805, dòng điện DC được cho qua một diode D3 trước khi tới đầu vào của 7805 để bảo đảm cho dòng điện qua 7805 theo 1 chiều cố định. Các tụ C15, C17, C13, C16, C19, C18 có tác dụng lọc nhiễu.
3.3.2. Khối mạch RJ45
Hình 11: Khối mạch RJ45.
- Trong mạch này, sử dụng đầu cắm giao tiếp RJ45 là HR911105A của HANRUN. HR911105A được tích hợp sẵn biến áp và có 2 led để thông báo trạng thái kết nối của mạch.
Hình 12: Sơ đồ khối của HR911105A.
3.3.3. Khối mạch LCD
Hình 13: Khối mạch LCD.
- Khối mạch LCD sử dụng LCD 16x2 để hiển thị địa chỉ IP hiện tại của mạch và để hiện thị các kí tự được truyền xuống từ web giao diện.
3.3.4. Khối mạch vi điều khiển PIC18F67J60
Hình 14: Jack kết nối với mạch vi điều khiển, mạch dao động ngoài, chân VDDCORE/VCAP.
- Chân VDDCORE/VCAP của vi điều khiển được nối với tụ phân cực C14 xuống đất.
- Bộ dao động ngoài sử dụng thạch anh 25MHz.
- Các tụ C2, C3, C4, C5, C6, C7, C9 có tác dụng lọc nhiễu.
3.4 Mạch in
Hình 16: Bảng mạch chính.
3.5 Mạch thực tế
Hình 18: Bản mạch chính
Hình 19: Vi điều khiển PIC 18F67J60
CHƯƠNG 4. TRÌNH BIÊN DỊCH MPLAB C18 VÀ WEB SERVER
4.1. MPLAB C18
4.1.1. Giới thiệu
MPLAB C18 là một trình biên dịch C theo chuẩn ANSI dùng cho dòng PIC18 của Microchip.
Trình biên dịch MPLAB C18 và các công cụ đi kèm như linker hoặc trình biên dịch hợp ngữ được gọi từ dòng lệnh điều khiển để tạo ra 1 file .HEX để nạp vào vi điều khiển PIC18XXXX. MPLAB C18 và các công cụ đi kèm cũng có thể được gọi bên trong MPLAB IDE.
Trình biên dịch MPLAB C18 làm cho sự phát triển của các ứng dụng hệ thống nhúng dễ dàng hơn vì nó sử dụng ngôn ngữ C chuẩn.
4.1.2. Các đặc trưng của trình dịch MPLAB C18:
- Tương thích với chuẩn ANSI-89.
- Tích hợp MPLAB IDE để có thể dễ dàng quản lý project .
- Tương thích với các module đối tượng được tạo bởi trình biên dịch hợp ngữ MPASM, cho phép kết hợp việc lập trình C và lập trình hợp ngữ trong cùng một project.
- Đọc/ ghi vào bộ nhớ ngoài.
- Có các thư viện mở rộng hỗ trợ cho PMW, SPI, I2C, UART, USART và thư viện toán học.
4.1.3. Quá trình tạo ra file .HEX
Quá trình tạo ra file .HEX của project để nạp vào vi điều khiển PIC18XXXX. Đầu tiên, MPLAB C18 sẽ biên dịch file2.c và file3.c để tạo ra các object file file2.o và file3.o. MPASM biên dịch file1.asm thành object file file1.o. Sau đó, file object file4.o kết hợp với file3.o để tạo thành 1 thư viện gọi là lib1.lib. Cuối cùng, các file object còn lại liên kết cùng với file lib1.lib bởi trình liên kết MPLINK. MPLINK cũng có một linker script ở đầu vào là file script.lkr. MPLINK liên kết tất cả các file này để tạo ra các file đầu ra: output.cof, output.map, và output.hex.
Hình 21: Quá trình tạo file .HEX
4.2. Web động
Web động hay DHTML ( Dynamic HTML) có thể được định nghĩa như là một phần mềm được sử dụng cho việc mô tả sự kết hợp giữa ngôn ngữ đánh dấu siêu văn bản HTML, các stylesheet và ngôn ngữ script làm cho tài liệu trở nên sinh động.
DHTML cho phép người lập trình dễ dàng thêm các hiệu ứng cho các trang web. Ví dụ như làm động các hình ảnh và text trên trang web.
Cấu trúc của một DHTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>DHTML example</title> <script type="text/javascript"> function init() { myObj = document.getElementById("navigation"); // .... more code } window.onload=init; </script> </head> <body> <div id="navigation"></div> <pre>
Often the code is stored in an external file; this is done by linking the file that contains the JavaScript.
This is helpful when several pages use the same script: </pre>
<script type="text/javascript" src="myjavascript.js"></script> </body>
</html>
4.3. CSS
CSS là chữ viết tắt của cụm từ tiếng Anh “Cascading Style Sheet”, là kiểu thiết kế sử dụng nhiều lớp định dạng chồng lên nhau. CSS được tổ chức World Wide Web (W3C) giới thiệu vào năm 1996. Cách đơn giản nhất để hiểu CSS là coi nó như một
phần mở rộng của HTML để giúp đơn giản hóa và cải tiến việc thiết kế cho các trang web.
Một tiện ích của CSS là định nghĩa các Style (kiểu dáng, định dạng, v.v..) một lần và các trình duyệt có thể áp dụng các Style này nhiều lần trong một văn bản.
4.3.1. Ưu điểm của CSS
CSS có thể tách riêng phần định dạng ra khỏi nội dung một trang web, do đó nó sẽ rất thuận tiện khi thay đổi giao diện của một trang web.
CSS là một sợi chỉ xuyên suốt trong quá trình thiết kế một website bởi vì nó cho phép nhà thiết kế kiểm soát toàn bộ giao diện, kiểu cách và sự sắp đặt của nhiều trang hay nhiều đối tượng trong một lần định nghĩa. Để thay đổi tổng thể hay nhiều đối tượng có cùng style, chỉ cần thay đổi style đó và lập tức tất cả các thành phần áp dụng Style đó sẽ thay đổi theo. Nó giúp tiết kiệm công sức rất nhiều.
Do định nghĩa các style có thể được tách riêng ra khỏi nội dung của trang web, chúng được các trình duyệt tải một lần và sử dụng cho nhiều lần, do đó nó giúp các trang web nhẹ hơn và chạy nhanh hơn.
4.3.2. Các đặc tính cơ bản của CSS
CSS quy định cách hiển thị của các thẻ HTML bằng cách quy định các thuộc tính của các thẻ đó (font chữ, màu sắc). Để cho thuận tiện có thể đặt toàn bộ các thuộc tính của thẻ vào trong một file riêng có phần mở rộng là “.css”, thường người ta hay đặt tên nó là stylesheet.css.
CSS phá vỡ giới hạn trong thiết kế Web, bởi chỉ cần một file CSS có thể cho phép quản lí định dạng và layout trên nhiều trang khác nhau. Các nhà phát triển Web có thể định nghĩa sẵn thuộc tính của một số thẻ HTML nào đó và sau đó nó có thể dùng lại trên nhiều trang khác.
Có thể khai báo CSS bằng nhiều cách khác nhau. Có thể đặt đoạn CSS phía trong thẻ <Head>…</Head>, hoặc ghi nó ra một file riêng với phần mở rộng “.css”, ngoài ra bạn còn có thể đặt chúng trong từng thẻ HTML riêng biệt.
4.3.2.1. Cú pháp cơ bản của CSS:
css_selector_1 {
thuộc_tính_1: giá_trị_của_thuộc_tính_1; thuộc_tính_2: giá_trị_của_thuộc_tính_2; ...
thuộc_tính_n: giá_trị_của_thuộc_tính_n; } css_selector_2 { thuộc_tính_1: giá_trị_của_thuộc_tính_1; thuộc_tính_2: giá_trị_của_thuộc_tính_2; ... thuộc_tính_n: giá_trị_của_thuộc_tính_n; } ... css_selector_n { thuộc_tính_1: giá_trị_của_thuộc_tính_1; thuộc_tính_2: giá_trị_của_thuộc_tính_2; ... thuộc_tính_n: giá_trị_của_thuộc_tính_n; } 4.3.2.2. Ví dụ minh họa về mã CSS: body { background: #ffffff;
/* trang Web sẽ có nền màu trắng */
font-family: Verdana; /* font chữ mặc định là Verdana */ color: #ff0000; /* màu chữ mặc định là màu đỏ */ } 4.3.2.3. Thứ tự xếp lớp:
Tùy vào từng cách đặt khác nhau mà mức độ ưu tiên cho các style cũng khác nhau. Mức độ ưu tiên này tuân theo thứ tự sau:
- Style nội tuyến – Style đặt trong từng thẻ HTML riêng biệt.
- Stylet bên trong – Style đặt bên trong cặp thẻ <Head> … </Head>. - Style bên ngoài – Style đặt trong các file riêng có đuôi “.css”. - Style theo mặc định của trình duyệt.
4.3.3. CSS có tính kế thừa và tính kết hợp
4.3.3.1. Tính kế thừa:
Giả sử rằng ở đầu file styleshet.css khai báo cho Body có các thuộc tính sau: Body{
Font:Arial, Verdana; Background:#FF6600; }
Nhưng trong trường hợp muốn khai báo cho các đối tượng nhỏ hơn nằm trong đó như Sidebar: #sidebar{ With:300px; Padding:10px; Font:Tahoma,Verdana; }
Sau đoạn khai báo này thì Sidebar sẽ có thuộc tính: #sidebar{
background:#FF6600; with:300px;
padding: 10px;
font: Tohoma, Verdana; }
Như vậy, Sidebar đã kế thừa thuộc tính background của Body, và trong đó thuộc tính font là Tahoma đã đè lên thuộc tính font Arial ở lần khai báo trước.
4.3.3.2. Tính kết hợp:
Có thể định nghĩa nhiều CSS cùng một thuộc tính thay vì phải định nghĩa riêng lẻ từng cái một.
Ví dụ:
h1, h2,h3,h4{
Font-family: Tahoma,arial; Color:#D4D4D4;
}
Thay cho việc định nghĩa riêng biệt cho từng cái: h1{ Font-family: Tahoma,arial; Color: #D4D4D4; } h2{ Font-family: Tahoma,arial; Color:#D4D4D4; } ……… h4{ Font-family: Tahoma,arial; Color:#D4D4D4; } 4.4. Kỹ thuật AJAX
AJAX, viết tắt từ Asynchronous JavaScript and XML (JavaScript và XML không đồng bộ), là bộ công cụ cho phép tăng tốc độ ứng dụng web bằng cách cắt nhỏ dữ liệu và chỉ hiển thị những gì cần thiết, thay vì tải đi tải lại toàn bộ trang web. AJAX không phải một công nghệ đơn lẻ mà là sự kết hợp một nhóm công nghệ với nhau. Trong đó, HTML và CSS đóng vai hiển thị dữ liệu, mô hình DOM trình bày thông tin động, đối tượng XMLHttpRequest trao đổi dữ liệu không đồng bộ với máy chủ web, còn XML là định dạng chủ yếu cho dữ liệu truyền.
Những hoạt động của người sử dụng trên trang web sẽ tạo ra một yêu cầu HTTP tới server. Máy chủ thực hiện một số khâu xử lý như lấy lại dữ liệu, tính toán, kiểm tra
sự hợp lệ của thông tin, sửa đổi bộ nhớ, sau đó gửi lại một trang HTML hoàn chỉnh tới máy khách. Tuy nhiên, phương pháp này khá bất tiện và mất thời gian. Để khắc phục hạn chế trên, các chuyên gia phát triển giới thiệu hình thức trung gian - cơ chế xử lý AJAX - giữa máy khách và máy chủ. Điều này giống như việc tăng thêm một lớp giữa cho ứng dụng để giảm quá trình "đi lại" của thông tin và giảm thời gian phản ứng. Thay vì tải lại (refresh) toàn bộ một trang, nó chỉ nạp những thông tin được thay đổi, còn giữ nguyên các phần khác. Vì thế, khi duyệt một trang hỗ trợ AJAX, người sử dụng không bao giờ nhìn thấy một cửa sổ trắng (blank) và biểu tượng đồng hồ cát - dấu hiệu cho thấy máy chủ đang thực hiện nhiệm vụ. Ví dụ, trong một website ảnh, với ứng dụng truyền thống, toàn bộ trang chứa các ảnh sẽ phải mở lại từ đầu nếu có một thay đổi nào đó trên trang. Còn khi áp dụng AJAX, DHTML chỉ thay thế đoạn tiêu đề và phần vừa chỉnh sửa, do vậy tạo nên các giao dịch trơn tru, nhanh chóng.
Hình 22: Tương tác đồng bộ trong ứng dụng web truyền thống (trên) và dị bộ trong ứng dụng AJAX.
4.4.1. Ưu điểm
- Trong nhiều trường hợp, các trang web chứa rất nhiều nội dung thông thường trong trang. Nếu sử dụng các phương pháp truyền thống, những nội dụng đó sẽ phải nạp lại toàn bộ với từng yêu cầu. Tuy nhiên, nếu sử dụng Ajax, một ứng dụng web có thể chỉ yêu cầu cho các nội dung cần thiết phải cập nhật, do đó giảm lượng lớn băng thông và thời gian nạp lại trang.
- Việc dùng các yêu cầu không đồng bộ (asynchronous request) cho phép giao diện người dùng của ứng dụng hiển thị trên trình duyệt giúp người dùng trải nghiệm sự tương tác cao, với nhiều phần riêng lẻ.
- Việc sử dụng Ajax có thể làm giảm các kết nối đến server, do các script và các style sheet chỉ phải yêu cầu một lần.
4.4.2. Nhược điểm
- Các trang web được tạo động không được ghi vào bộ lưu lịch sử lướt web của trình duyệt, do đó nút "back" (quay lui) của trình duyệt sẽ mất tác dụng quay lại trang thái trước đó của trang sử dụng Ajax, thay vào đó sẽ quay lại trang web trước đó mà người dùng ghé thăm.
- Bất kỳ người dùng nào có trình duyệt không hỗ trợ Ajax hay JavaScript, hoặc đơn giản là đã bị vô hiệu hóa JavaScript, sẽ đương nhiên không thể sử dụng Ajax.
- Việc thiếu các chuẩn cơ bản của Ajax đồng nghĩa với việc không có nhiều sự chọn lựa thực tiễn tốt nhất để kiểm tra các ứng dụng Ajax. Các công cụ kiểm thử cho Ajax thường không hiểu các mô hình sự kiện, mô hình dữ liệu và giao thức của Ajax.
CHƯƠNG 5. TCP/IP STACK
5.1. Cấu trúc của TCP/IP Stack
TCP/IP Stack là ứng dụng của Microchip để tạo một Webserver nhúng, hoặc các giao thức giao tiếp Enthernet hiện hành. Bao gồm các giao thức truyền dữ liệu TCP, UDP. Và hỗ trợ các module khác như: IP, ICMP, DHCP, ARP và DNS.
TCP/IP cũng có các Module sử dụng cho lớp ứng dụng như: HTTP cho Web, SMTP cho gửi và nhận Email, SNMP cho giao thức trạng thái và điều khiển. Telnet cho điều khiển từ xa, TFTP.
Hình 23: Cấu trúc của Stack.
Ngoài những module chính giống như cấu trúc TCP/IP tham khảo thì Microchip đưa thêm vào Stack 2 module mới đó là StackTask và ARPTask. StackTask quản lý sự vận hành và tất cả các module của Stack. Trong khi đó, ARPTask quản lý các dịch vụ của lớp ARP ( Address Resolution Protocol).
5.2. Hoạt động của TCP/IP Stack
TCP/IP Stack hoạt động gần giống cấu trúc của hệ điều hành thời gian thực, tức là các nhiệm vụ sẽ được chia thành các tác vụ ( ở đây là TCP, UDP, Ping,…). Tất cả hoạt động của TCP/IP sẽ được một đồng hồ chung quản lí theo Time Split. Tức là có một Timer hệ thống (Timer1), cứ 1 khoảng thời gian ngắn sẽ ngắt (gọi là 1 TICK), khi