Skip to content

Instantly share code, notes, and snippets.

@hmboyd
Created December 29, 2021 05:05
Show Gist options
  • Save hmboyd/cecc7fbd9c65b55bf16ed3169b121f0f to your computer and use it in GitHub Desktop.
Save hmboyd/cecc7fbd9c65b55bf16ed3169b121f0f to your computer and use it in GitHub Desktop.
Web Page Server (Based off ELEC351 RemoteServer Library/Module) (Uni) Weather Page as Example Approved to work with stm32 (and mbed(os)) platform specifically nucleo f4(29zi). main.cpp from ELEC351 given attached in comment as example of how to run
#include "WebPageServer.hpp"
EthernetInterface net;
void Web_Page_Server_Thread_Main(){
WebPageServer WebPageServer;
WebPageServer.run();
}
// (c) Benjamin Job and some editted code from 2020 University of Plymouth and Nicholas Outram
// Version 1.0 - 8/1/2021
#pragma once
#include "mbed.h"
//#include "F429_Mega_Shell_Header.h"
//#include "Data_n_Fifo.hpp"
#include "EthernetInterface.h"
#include "TCPSocket.h"
//#include <iostream>
using namespace std;
//HTTP Definitions:
#define HTTP_STATUS_LINE "HTTP/1.0 200 OK"
#define HTTP_HEADER_FIELDS "Content-Type: text/html; charset=utf-8"
#define HTTP_MESSAGE_BODY "" \
"<html>" "\r\n" \
" <body style=\"display:flex;text-align:center\">" "\r\n" \
" <div style=\"margin:auto\">" "\r\n" \
" <header class=\"header-main\">" "\r\n" \
" <div class=\"responsive-module\">" "\r\n" \
" <div class=\"logo\">" "\r\n" \
" <a class=\"home\" href=\"/\">" "\r\n" \
" <img alt=\"University of Plymouth\" src=\"https://d39ner1f41xyl1.cloudfront.net/assets/uopqueenlogomono-156ce0828e4a0d49073bd3135ef7a3f2df130d1ac3612a29a5f0c8d5faf98557.svg\">" "\r\n" \
" </a>" "\r\n" \
" </div>" "\r\n" \
" </div>" "\r\n" \
" </header>" "\r\n" \
" <div class=\"main-content\">" "\r\n" \
" <head>" "\r\n" \
" <title> Plymouth Uni Weather Page </title>" "\r\n" \
" <meta http-equiv=\"refresh\" content=\"4\">" "\r\n" \
" </head>" "\r\n" \
" <h1> Plymouth Uni Weather Page </h1>" "\r\n" \
" <h2>Date and Time:</h1>" "\r\n" \
" <p>{{dt}}</p>" "\r\n" \
" <h2>Sensors:</h1>" "\r\n" \
" <h3>Temperature - </h2>" "\r\n" \
" <p>{{t}}</p>" "\r\n" \
" <h3>Pressure - </h2>" "\r\n" \
" <p>{{p}}</p>" "\r\n" \
" <h3>Light Level - </h2>" "\r\n" \
" <p>{{ll}}</p>" "\r\n" \
" </div>" "\r\n" \
" <footer class=\"footer-main\">" "\r\n" \
" <div class=\"responsive-module\" id=\"footer-links\">" "\r\n" \
" <section class=\"grid-container module-100-50-25\">" "\r\n" \
" <a id=\"footer-logo-link\" href=\"/\">" "\r\n" \
" <img alt=\"Connect With University of Plymouth\" src=\"https://d39ner1f41xyl1.cloudfront.net/assets/crest-small-white-2fa05a1e23d7328a84a323ccc96124a2a5fcf7da4a3e7b99c798604bd54fe6ca.png\">" "\r\n" \
" </a>" "\r\n" \
" <a id=\"footer-tef-link\" href=\"https://www.officeforstudents.org.uk/advice-and-guidance/teaching/tef-outcomes/#/provider/10007801\">" "\r\n" \
" <img alt=\"TEF Silver\" src=\"https://d39ner1f41xyl1.cloudfront.net/assets/tef-silver-100-3ea8a31e0716e3ea44b3e8e9fe082270f94050b49b2c83ea4ce6dbe004ec033a.png\">" "\r\n" \
" </a>" "\r\n" \
" <ul class=\"social-sharing colour\">" "\r\n" \
" <li><a href=\"http://www.facebook.com/plymouthuni\" class=\"facebook\"></a>Facebook</li>" "\r\n" \
" <li><a href=\"http://www.twitter.com/plymuni\" class=\"twitter\"></a>Twitter</li>" "\r\n" \
" <li><a href=\"http://www.youtube.com/user/PlymouthUniversity\" class=\"youtube\"></a>Youtube</li>" "\r\n" \
" <li><a href=\"http://www.instagram.com/plymuni\" class=\"instagram\"></a>Instagram</li>" "\r\n" \
" <li><a href=\"http://www.pinterest.com/plymuni\" class=\"pinterest\"></a>Pinterest</li>" "\r\n" \
" <li><a href=\"https://www.snapchat.com/add/plymuni\" class=\"snapchat\"></a>Snapchat</li>" "\r\n" \
" <li><a href=\"http://www.linkedin.com/edu/school?id=12719\" class=\"linkedin\"></a>Linkedin</li>" "\r\n" \
" </ul>" "\r\n" \
" </section>" "\r\n" \
" </div>" "\r\n" \
" </footer>" "\r\n" \
" </div>" "\r\n" \
" </body>" "\r\n" \
"</html>" "\r\n"
#define HTTP_TEMPLATE "" \
HTTP_STATUS_LINE "\r\n" \
HTTP_HEADER_FIELDS "\r\n" \
"\r\n" \
HTTP_MESSAGE_BODY "\r\n"
#define HTTP_TITLE ""\
"<head><title> Plymouth Uni Weather Page </title></head>" "\r\n"
#define HTTP_FORMAT_1 "" \
"<body style=\"display:flex;text-align:center\">" "\r\n" \
"<div style=\"margin:auto\">" "\r\n" \
"<header class=\"header-main\">" "\r\n" \
"<div class=\"responsive-module\">" "\r\n" \
"<div class=\"logo\">" "\r\n" \
"<a class=\"home\" href=\"/\">" "\r\n" \
"<div class=\"main-content\">" "\r\n" \
"<footer class=\"footer-main\">" "\r\n" \
"<div class=\"responsive-module\" id=\"footer-links\">" "\r\n" \
"<section class=\"grid-container module-100-50-25\">" "\r\n"
#define HTTP_BOTTOM "</html>" "\r\n"
//HTTP Definitions END
//Static IP version Definitions
#define IP "10.0.0.10"
#define NETMASK "255.0.0.0"
#define GATEWAY "192.168.1.2"
//Static IP version Definitions End
extern EthernetInterface net;
class WebPageServer {
private:
public:
void run()
{
//log_String("SERVER: HTTP server startup\n");
// Connect the ethernet interface
net.set_network(IP, NETMASK, GATEWAY); //For static IP
net.connect();
// Get the network address
SocketAddress a;
net.get_ip_address(&a);
// Show the network address
//log_String("\n---\nSERVER: IP address: %s\n---\n", a.get_ip_address() ? a.get_ip_address() : "None");
// Open a TCP socket on the network interface, and create a TCP connection on port 80
TCPSocket socket;
socket.open(&net);
socket.bind(80);
//Set socket to listening mode (up to 5 connections)
int err=socket.listen(5);
if(err==0) {
//log_String("SERVER: Listening OK...\n");
}
else {
//print_Error("SERVER: Listen error=%d\n\r",err);
socket.close();
while(1);
}
/*
float t;
float p;
float ll;
char dtbuff[25] = "dde mme dd HH:nn:ss yyyy";
char tbuff[11]="0 &deg;C";
char pbuff[9]="0 mBar";
char llbuff[6]="0%%";
*/
while (true)
{
//log_String("SERVER: Ethnet Waiting...\n");
// ACCEPT Accepting connections
TCPSocket* clt_sock=socket.accept(); //Blocking (not now)
//Unblocks with each connection
//log_String("SERVER: Ethnet Connected.\n");
//Construct web page:
/*Sensor_n_Time_Data_Class Temp_current_Class(Data_Buffer.get_Current_Data_Class());
t = Temp_current_Class.getTemp(); //Get actual temp value
p = Temp_current_Class.getPres(); //Get actual pressure value
ll = ((3.3-Temp_current_Class.getLigh())/3.3)*100; //Get actual light level value and convert to percentage
sprintf(dtbuff, "%s", Temp_current_Class.getTime().c_str()); //get time in c string
sprintf(tbuff, "%3.1f &deg;C", t); //Convert float to string with Degree Celsius unit in html entry (in HTTP definitions)
sprintf(pbuff, "%3.1f mBar", p); //Convert float to string with unit
sprintf(llbuff, "%2.1f%%", ll); //Convert float to string with percent sign on end
*/
//Construct response string (in C++)
string html = string(HTTP_TEMPLATE);
size_t index = html.find("{{dt}}"); //Find placeholder {{dt}}
if (index) {
html.replace(index, 6, dtbuff); //Replace with date and time value string
}
index = html.find("{{t}}"); //Find placeholder {{t}}
if (index) {
html.replace(index, 5, tbuff); //Replace with temp value string
}
index = html.find("{{p}}"); //Find placeholder {{p}}
if (index) {
html.replace(index, 5, pbuff); //Replace with pressure value string
}
index = html.find("{{ll}}"); //Find placeholder {{ll}}
if (index) {
html.replace(index, 6, llbuff); //Replace with light level value string
}
//cout << html << endl; //For debug purposes
//Send response string (blocking until completed)
//printf("%s STRING LENGTH is: %d\n\r", html.c_str(), strlen(html.c_str())); // the rest of this line to use Flash Silicon *see notes above line number 35" myHTTP,strlen(myHTTP));
nsapi_size_or_error_t ret = clt_sock->send(html.c_str(), strlen(html.c_str())); //myHTTP,mydatasize)the rest of this line to use Flash Silicon *see notes above line number 35" myHTTP,strlen(myHTTP));
//Echo how many bytes were sent
//log_String("SERVER: Sent %d bytes\n", ret);
//You are responsible to close this
clt_sock->close();
//log_String("SERVER: Ethnet Closed.\n");
}
}
};
void Web_Page_Server_Thread_Main();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment