Today's Hardware Friday project is one from someone I've been wanting to highlight for a while, and finally, the time is just right.
Laurent Ellerbach has been building some pretty cool .Net Micro Framework projects for a while now. Here's just a few;
- Lighting my Lego city using .NET Microframework
- Using XMLHttpRequest to pilot a Lego train dynamically in HTML 5
- Some hard to pilot a Sprinkler with .NET Microframework
- A low cost humidity sensor for my sprinkler system
- A soil low cost humidity sensor (moisture) and .NET Micro Framework (NETMF)
But I will start with the modification of my Web Server to support CSS file. I did couple of demonstration of my development and each time I show the interface people were telling to me I need to work with a designer. And that’s what I finally did I worked with Michel Rousseau who is designer at Microsoft in the French team. And I gave him a challenge: “Design this simple web page without changing the code too much and keep it less than couple of K without any image”. Michel is used to design Windows 8 and Windows Phone apps but not very very simple page like the one I had.
And he has done an excellent job! Here is the view before and after:
Now I had to implement this in my code. As the brief was to have minimal effect on the code, I was expecting to implement this quickly. Reality was a bit different. It took me a bit more time than expected for the following reasons:
- I had to implement in my basic web server a function to be able to download a file (the CSS one)
- To read and download a file from an SD, you have to do it by chunk as the buffer size is limited (in the case of my Netduino 1024 bit)
- Modify the main code to care about downloaded file and also add the lines of code to support CSS
- But the main issue was that I’ve discovered that to be able to have a CSS file, you need to have the specific type “text/css”. This is to avoid cross domain fishing and other hacking
So let see how to implement this step by step. So let start with the reading part of the file and how to send it. As explained in the last point, a CSS file has to have the correct mime type in the header. In fact, Internet Explorer and most of the other browsers such as Chrome and Firefox does not need the mime type to determine what kind of fire you are downloading. They do it with the mime type and/or with the extension. Most of the time, it’s just with the extension and reading the header of the file. But for security reason, it’s better if you have to determine correctly the type matching with the extension and the header of the file. And for CSS, it is forced like this to reinforce the security in Internet Explorer 8, 9 and 10.
So as I had to implement this feature for CSS, I made a simple function to support some types I’ll use in other creation:
Want to just jump to the source?
So as I got lots of asks to get the code of my Web Server, I’ve decided to create a Codeplex project. You’ll find the source here: https://netmfwebserver.codeplex.com/
It does include the following features:
- Start, stop, Pause the Web Server
- Creation of a Web Server on any port
- Fully functional multithread Web Server supporting GET only
- Downloading any file present on a SD (or any other physical storage)
- A full function to get all the parameters of a URL
Now your next .Net Micro Framework and be an web providing for the Internet of Things...