Control RS485 Relays from a web browser
Control RS485 Relays from a web browser
This project pulls together a number of different projects on this site to enable control of relays from a web browser via a raspberry pi and RS485 network.
For this project you will need the following
1. A Raspberry pi with Raspbian installed
2. An Isolated RS485/422 adapter
3. A number of RS485 relay boards in this project I use 2
The Hardware
Connect the Isolated RS485 adapter up to the raspberry pi and follow the instructions on that page to enable the onboard uart now connect the RS485 slaves to the isolated RS485 board via two wires and terminate the network at the furthest node.
The Software
Next we need to download and install Webiopi instructions can be found here
As the first step we need to change is the config file located at /etc/webiopi/config
sudo nano /etc/webiopi/config
Firstly we need to configure the serial port to 19.2 KBaud by changing it to this line
[DEVICES]
serial0 = Serial device:ttyAMA0 baudrate:19200
Copy and paste the file below into an editor and save it as Index.html and put this at the root location for webiopi. Or configure the line in the config file to point to the location.
Now reboot your raspberry pi for the changes to take effect and start webiopi by the command:
$ sudo /etc/init.d/webiopi start
Now open a browser and go to http://localhost:8000/ on the raspberry pi you should be asked for a username and password these are
username: webiopi
password: raspberry
You should see a web page like this
that enables you to control the relays.
To log in on another browser on your
network at http://raspberrypi:8000/
Replace raspberrypi with your IP address
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content = "height = device-height, width = 420, user-scalable = no" />
<title>RS485 Relay Control</title>
<script type="text/javascript" src="/webiopi.js"></script>
<script type="text/javascript">
webiopi().ready(function() {
$("#R1ON").mousedown(function(event){
webiopi().Serial("serial0").write("$24ON1");
return false;
});
$("#R1OFF").mousedown(function(event){
webiopi().Serial("serial0").write("$24OF1");
return false;
});
$("#R2ON").mousedown(function(event){
webiopi().Serial("serial0").write("$16ON1");
return false;
});
$("#R2OFF").mousedown(function(event){
webiopi().Serial("serial0").write("$16OF1");
return false;
});
$("#inputText").keyup(function(event){
if(event.keyCode == 13){
sendData();
}
});
$.get("/devices/*", function(data) {
var devices = $("#devices");
var added = false;
for (i in data) {
if (data[i].type=="Serial") {
added = true;
devices.append($("<option>" + data[i].name + "</option>"))
}
}
if (added) {
readData();
}
});
});
function readData() {
webiopi().Serial($("#devices").val()).read(function(data) {
if (data.length > 0) {
var d = $("#output").text() + data;
$("#output").text(d);
}
});
setTimeout(readData, 500);
}
function sendData() {
var data = $("#inputText").val();
webiopi().Serial($("#devices").val()).write(data);
$("#inputText").val("");
}
function deviceChanged() {
$("#output").text("");
}
</script>
<style type="text/css">
#inputText {
width: 550px;
}
</style>
</head>
<body>
<h1>RS485 control</h1>
<p>
</p>
</p>
</p>
<p>
<span> Relay 1</span> <input id="R1ON" bgcolor ="red" type="button" value="ON"/><input id="R1OFF" type="button" value="OFF"/>
</p>
<p>
<span> Relay 2</span> <input id="R2ON" type="button" value="ON"/><input id="R2OFF" type="button" value="OFF"/>
</p>
</body>
</html>
Control relays via the web via a raspberry pi and Webiopi