Day3-Flask-Lab Maual PDF

INTERNET OF THINGS – TRAINING LAB MANUAL
DAY 3
RASPBERRYPI AS A WEBSERVER
This tutorial explains how to use Flask as a web server in Raspberrypi device.
----------------------------------------------------------------------------------------------------------------------------------------
Flask Installation:
Step 1: Open TERMINAL in your Raspberrypi device
Step2: Use the following command for installation
sudo apt-get install python3-flask

EXERCISE 1:
Using flask package, Implement a basic webserver in Raspberry pi device. Display “helloworld” in the
browser when URL : 127.0.0.1:5000 is browsed in your web browser.
INPUT: URL : ‘127.0.0.1:5000’ in web browser.
OUTPUT: Web browser displaying ”helloworld”.
------------------------------------------------------------------------------------------------------------------------------------------
Step I: Create project folder for the webserver project implementation.
• Open the File Manager and create a new folder for your project.
• Open MainMenu-> Programming->Python 3 from the main menu.
• Open a new window by clicking File- > New file, and save this as app.py inside the project folder
you created.
• You'll write your application code here and when you run your code, any printed messages or
errors will be shown in the Python shell window which opened first.
Step 2: Simple Helloworld server program to be written in app.py
1. Import flask library

from flask import Flask
2. Create an instance of the Flask class

app= Flask(__name__)
3. The lines below describe the route and function to be called when route URL is accessed from
browser
@app.route('/')
def index():
return 'Hello world'
‘Helloworld’ is the string returned to browser
4. Following is the main function. ‘app.run’ is used to start the server. ‘host=0.0.0.0’ server says
the URL is accessible with in network
if __name__ == '__main__':
app.run(debug=True, host='0.0.0.0')
OUTPUT: Open browser and type loopback url 127.0.0.1:5000. You can see ‘helloworld’ webpage using
flask
----------------------------------------------------------------------------------------------------------------------------------------
EXERCISE 2:
Modify the above program to build the webserver and add a new route to it
INPUT: URL : ‘127.0.0.1:5000/food’ in web browser
OUTPUT: Web browser displaying ‘I like Yummy Cakes’
1. The lines below describe the route and function to be called when route URL is accessed from
browser. Here we use ‘food’ as a route. Add this to the EXERCISE 1 program
@app.route('/food')
def food():
return 'I like Yummy Cakes'
‘I like Yummy Cakes’ is the string returned to browser
OUTPUT: Open browser and type loopback url 127.0.0.1:5000/food. You can see ‘I like Yummy Cakes’
in webpage using flask
EXERCISE 3:
Modify the above program to build the webserver using render_html
INPUT: URL : ‘127.0.0.1:5000/’ in web browser
OUTPUT: Web browser displaying html page using ‘render_html’
1. Create a HTML file named ‘index.html’. HTML Program should be saved in templates folder
inside the project folder
2. HTML folder content
<html>
<body>
<h1>
Hello from render template!
</h1>
</body>
</html>
3. Modify the @app.route to make it return ‘index.html’
@app.route('/')
def index():
return render_template('index.html')
4. Import render_template using following modification in first line of previous program

from flask import flask, render_template
-----------------------------------------------------------------------------------------------------------------------------
EXERCISE 4:
Create a webserver program to return dummy temperature data from raspberrypi
OUTPUT: View json data in browser
1. Server side program for returning JSON Temperature data(app.py)
from flask import Flask
from flask import jsonify
app=Flask(__name__)
@app.route('/getajson')
def getajson():
data= {"temp":"25" }
return jsonify(data)
if __name__ =='__main__':
app.run(debug=True,host='0.0.0.0')
OUTPUT: View JSON data returned in your browser

EXERCISE 5:
Create a webserver program to return real temperature data from raspberrypi
OUTPUT: Click on the GET TEMP DATA to receive current temperature of temperature sensor
data on WEBPAGE
1. Connect the temperature sensor to raspberrypi as discussed in Peripheral Interfacing

Session.
2. Create index.html in the templates folder with following contents
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body class="container">
<header>
</header>
<main>
<div class="jumbotron">
<h1>Welcome to Rasperypi Temp Page</h1>
<p>Get Temperature at Lab1: Device 2</p>
</div>
<form class="form-inline" id="myform">
<button type="submit" id="submitted" class="btn btn-default">GET TEMP

DATA</button>
<br>
<br>
<div id="tempvalue">
</form>
</main>
<footer>
</footer>
</body>
<script>
$(function(){
$('#submitted').click ( function ( event ){
event.preventDefault();
$.get( '/getjsontemp', $('#myform').serialize (), function ( response ){
var data = response.temp;
alert("Temp="+data);
document.getElementById("tempvalue").innerHTML="TEMPERATURE= "+data;
});
});
});
</script>
</html>
3. Server side app.py program- [Sensor data acquisition will be discussed in Peripheral
Interfacing Session]
from flask import Flask,render_template
from flask import jsonify
import smbus
import time
import sys
app=Flask(__name__)
bus = smbus.SMBus(1)
address = 0x4b
@app.route('/')
def index():
return render_template('index.html')
@app.route('/getjsontemp')
def getjsontemp():
t= gettemp()
return jsonify({"temp":t})
def gettemp():
tempData = dataReadFun()
data = tempData[0]
data = data << 8
data = data | tempData[1]
data = data >> 3
temp = data * 0.0625
return temp
def dataReadFun():
try:
data = bus.read_i2c_block_data(address,0,2)
except IOError:
data =(0,0)
return data
if __name__=='__main__':
app.run(debug=True,host='0.0.0.0')

Day3-Flask-Lab Maual PDF

Загружено:

Сведения о документе

Оригинальное название

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Day3-Flask-Lab Maual PDF

Загружено:

Авторское право:

Доступные форматы

INTERNET OF THINGS – TRAINING LAB MANUAL

Step 1: Open TERMINAL in your Raspberrypi device

Step2: Use the following command for installation

sudo apt-get install python3-flask

INPUT: URL : ‘127.0.0.1:5000’ in web browser.

OUTPUT: Web browser displaying ”helloworld”.

Step I: Create project folder for the webserver project implementation.

Step 2: Simple Helloworld server program to be written in app.py

1. Import flask library

2. Create an instance of the Flask class

INPUT: URL : ‘127.0.0.1:5000/food’ in web browser

OUTPUT: Web browser displaying ‘I like Yummy Cakes’

Modify the above program to build the webserver using render_html

INPUT: URL : ‘127.0.0.1:5000/’ in web browser

OUTPUT: Web browser displaying html page using ‘render_html’

3. Modify the @app.route to make it return ‘index.html’

4. Import render_template using following modification in first line of previous program

Create a webserver program to return dummy temperature data from raspberrypi

INPUT: URL : ‘127.0.0.1:5000/’ in web browser

OUTPUT: View json data in browser

1. Server side program for returning JSON Temperature data(app.py)

from flask import Flask

from flask import jsonify

OUTPUT: View JSON data returned in your browser

Create a webserver program to return real temperature data from raspberrypi

INPUT: URL : ‘127.0.0.1:5000/’ in web browser

1. Connect the temperature sensor to raspberrypi as discussed in Peripheral Interfacing

<h1>Welcome to Rasperypi Temp Page</h1>

<p>Get Temperature at Lab1: Device 2</p>

<form class="form-inline" id="myform">

<button type="submit" id="submitted" class="btn btn-default">GET TEMP

$('#submitted').click ( function ( event ){

$.get( '/getjsontemp', $('#myform').serialize (), function ( response ){

var data = response.temp;

from flask import Flask,render_template

from flask import jsonify

data = data << 8

data = data | tempData[1]

data = data >> 3

temp = data * 0.0625

Вам также может понравиться