Raspberry Pi Pico W Web Server Tutorial with MicroPython

Overview
In this article, we will learn how to make a
Raspberry Pi Pico W
based
Web Server
using
MicroPython
programming. The web server is mobile
responsive
and can be accessed with any device that has a browser on the
local network
. We’ll show you how to create the web server and how the code works.
Before going straight to the project, it is important to outline what our web server will do:
The web server we will build
controls RGB LED
connected to the Pico W
GP13, GP14 & GP15
You can access Pi Pico W Web Server by typing the local
IP address
on a browser in local network.
By clicking the
buttons
on your web server you can instantly change the
state of RGB LED
The Webpage will also display the
Pi Pico W internal temperature
connected to the
ADC4
pin.
Components Required
We need the following components for the Raspberry Pi Pico W Web Server Demo. You can purchase all these components from
SunFounder Amazon
link which consists of the necessary sensors & modules along with 200+ components.
Raspberry Pi Pico W – 1
RGB LED – 1
Lipo Battery Charger – 1
Samsung 18650 Battery with Holder – 1
220-ohm Resistors – 3
Jumper Wires – 10
Breadboard – 1
Micro-USB Cable.
Circuit & Hardware Assembly
Start by building the circuit. Connect RGB LED to the Raspberry Pi Pico as shown in the following schematic diagram.
Connect the R, G, and B pin of RGB LED to GP13, GP14, and GP15 of Raspberry Pi Pico W respectively. You need to connect a 200-ohm resistor through each of the R, G, and B pins of the LED.
The Raspberry Pi Pico W has a
buck-boost converter
IC. Hence you can power the Raspberry Pi Pico W via a
Lipo Battery
. The Lipo Battery Charger Module which consists of
LTC4054
IC has been modified and specially designed for
powering Raspberry Pi Pico W
using
Lipo Battery
Using the Lipo Charger Module and
3.7V Samsung 18650 Rechargeable Lithium-Ion Battery
, you can power the Raspberry Pi Pico W & make the project
portable
MicroPython Code
The code for creating a Raspberry Pi Pico W based Web Server is simple. In the following code change the WiFi SSID and password.
Save the file to Raspberry Pi Pico W with the name main.py or anything else.

import
machine
import
socket
import
math
import
utime
import
network
import
time
wlan
=
network
WLAN
(
network
STA_IF
)
wlan
active
(
True
)
wlan
connect
(
"ssid"
"password"
)
# rgb led
red
=
machine
Pin
(

machine
Pin
OUT
)
green
=
machine
Pin
(

machine
Pin
OUT
)
blue
=
machine
Pin
(

machine
Pin
OUT
)
# Wait for connect or fail
wait
=

while
wait
>

:
if
wlan
status
(
)
<

or
wlan
status
(
)
>=

:
break
wait
-=

(
'waiting for connection...'
)
time
sleep
(

)
# Handle connection error
if
wlan
status
(
)
!=

:
raise
RuntimeError
(
'wifi connection failed'
)
else
:
(
'connected'
)
ip
=
wlan
ifconfig
(
)
[

]
(
'IP: '
ip
)
# Temperature Sensor
sensor_temp
=
machine
ADC
(

)
conversion_factor
=
3.3
/
(
65535
)
def
temperature
(
)
:
temperature_value
=
sensor_temp
read_u16
(
)
*
conversion_factor
temperature_Celcius
=

(
temperature_value
0.706
)
/
0.00172169
/

(
temperature_Celcius
)
utime
sleep
(

)
return
temperature_Celcius
def
webpage
(
value
)
:
html
=
f
""
"
<!DOCTYPE html>
<html>
<body>
<form action="
/
red
">
<input type="
submit
" value="
red
" />
</form>
<form action="
/
green
">
<input type="
submit
" value="
green
" />
</form>
<form action="
/
blue
">
<input type="
submit
" value="
blue
" />
</form>
<form action="
/
off
">
<input type="
submit
" value="
off
" />
</form>
<p>Temperature is {value} degrees Celsius</p>
</body>
</html>
"
""
return
html
def
serve
(
connection
)
:
while
True
:
client
=
connection
accept
(
)
[

]
request
=
client
recv
(
1024
)
request
=
str
(
request
)
try
:
request
=
request
split
(
)
[

]
except
IndexError
:
pass
(
request
)
if
request
==
'/off?'
:
red
low
(
)
green
low
(
)
blue
low
(
)
elif
request
==
'/red?'
:
red
high
(
)
green
low
(
)
blue
low
(
)
elif
request
==
'/green?'
:
red
low
(
)
green
high
(
)
blue
low
(
)
elif
request
==
'/blue?'
:
red
low
(
)
green
low
(
)
blue
high
(
)
value
=
'%.2f'
%
temperature
(
)
html
=
webpage
(
value
)
client
send
(
html
)
client
close
(
)
def
open_socket
(
ip
)
:
# Open a socket
address
=
(
ip

)
connection
=
socket
socket
(
)
connection
bind
(
address
)
connection
listen
(

)
(
connection
)
return
(
connection
)
try
:
if
ip
is
not
None
:
connection
=
open_socket
(
ip
)
serve
(
connection
)
except
KeyboardInterrupt
:
machine
reset
(
)
Run the above script, so that the Python Shell will display the IP Address of the Raspberry Pi Pico W.
Copy the IP Address and paste it on any Web browser and hit enter.
By clicking the red, green, and blue buttons you can control the RGB LED.
The Webpage will also display the temperature reading of the internal temperature sensor.
Code Explanation & Working of Raspberry Pi Pico W Web Server
The web page you are visiting is actually hosted on some server, and the socket on the server will send the web page to us when we visit it. A socket is a way a server can listen to a client that wants to connect to it. In this project, Pico W is your server, and your computer is accessing the web page hosted on Pico W through a browser.
First, we create a socket, which requires an IP address and a port. First Raspberry Pi Pico W connects to a local Wi-Fi network and prints the Ip Address. For the port part, we use 80. After setting up the socket, return it and use it for the next step.

import
socket
def
open_socket
(
ip
)
:
# Open a socket
address
=
(
ip

)
connection
=
socket
socket
(
)
connection
bind
(
address
)
connection
listen
(

)
(
connection
)
return
(
connection
)
Then, set up your web service where the socket you set up earlier will be used. The following code will allow your Pico W to receive access requests from your browser.

def
serve
(
connection
)
:
while
True
:
client
=
connection
accept
(
)
[

]
request
=
client
recv
(
1024
)
client
close
(
)
Next, you need an HTML page to send to the visitor. This example stores a simple HTML page in the form of characters in the variable
html

def
webpage
(
value
)
:
html
=
f
""
"
<!DOCTYPE html>
<html>
<body>
<form action="
/
red
">
<input type="
submit
" value="
red
" />
</form>
<form action="
/
green
">
<input type="
submit
" value="
green
" />
</form>
<form action="
/
blue
">
<input type="
submit
" value="
blue
" />
</form>
<form action="
/
off
">
<input type="
submit
" value="
off
" />
</form>
<p>Temperature is {value} degrees Celsius</p>
</body>
</html>
"
""
return
html
The first thing we need to know is what information the server receives when the browser accesses the web page. Therefore, change
serve()
slightly to print
request

def
serve
(
connection
)
:
while
True
:
client
=
connection
accept
(
)
[

]
request
=
client
recv
(
1024
)
request
=
str
(
request
)
(
request
)
html
=
webpage
(

)
client
send
(
html
)
client
close
(
)
When we run the script, the Shell will print the following message when we press a key on the web page.

b
'GET /red? HTTP/1.1\r\nHost: 192.168.18.162\r\nConnection: keep-alive.......q=0.5\r\n\r\n'
b
'GET /favicon.ico HTTP/1.1\r\nHost: 192.168.18.162\r\nConnection: keep-alive.......q=0.5\r\n\r\n'
b
'GET /blue? HTTP/1.1\r\nHost: 192.168.18.162\r\nConnection: keep-alive.......q=0.5\r\n\r\n'
b