来来来，咱们通过网页来聊天吧

B/S和C/S都是随着互联网的发展而出现的一种网络结构模式。

下面是百度百科对B/S简介。
B/S结构（Browser/Server，浏览器/服务器模式），是WEB兴起后的一种网络结构模式，WEB浏览器是客户端最主要的应用软件。这种模式统一了客户端，将系统功能实现的核心部分集中到服务器上，简化了系统的开发、维护和使用。客户机上只要安装一个浏览器，如Netscape Navigator或Internet Explorer，服务器安装SQL Server、Oracle、MYSQL等数据库。浏览器通过Web Server 同数据库进行数据交互。

下面是百度百科对C/S简介。
服务器-客户机，即Client-Server(C/S)结构。C/S结构通常采取两层结构。服务器负责数据的管理，客户机负责完成与用户的交互任务。

干说很不好理解，咱们具体例子吧。

B/S结构，咱们经常浏览的网页，例如，百度、谷歌、新浪等网站就是B/S结构的。服务器为我们提供的绝大部分数据处理服务，我们看网站的终端，可以是高性能计算机、普通PC机、笔记本电脑、手机、甚至是咱们的树莓派。这种架构的好处就是，瘦客户端——胖服务器，我们的客户端(上网终端)硬件配置很低，最终就剩上网和浏览网页的功能了。

C/S结构，咱们手机上的大部分app、手机游戏就是C/S结构的。我们的终端设备(手机、计算机等)要有一定的计算能力、甚至还要对操作系统有要求(手机上的ios、安卓，计算机上的windows、linux、macos)。这种架构的好处就是，为用户可以提供绚丽的用户交互界面、提供实时响应更好的应用。

咱们下面就用B/S结构的方式，来与树莓派唠一会，这样我们可以使用任何含有浏览器软件的手机、计算机等终端来访问树莓派。避免了采用C/S结构方式，要为每种终端编写相应的app。

我参考的例程为“树莓派实验室”的“树莓派+Flask实现视频流媒体WEB服务器”。

具体源码在“camWebServer2”目录下，我做的一定的修改。
(1)修改了软件提供服务的端口，由80端口更改为8080。由于80端口已经被其他应用占用了。
(2)当前去掉了视频流的功能。我现在手头没有摄像头，就去掉了该功能。
(3)修改由“采集DKT22温、湿度数据”更改为“采集DP83848温度数据“。手头NXEZ树莓派瑞士军刀扩展模块提供DP83848传感器。
(4)新增”LED控制“功能。通过浏览器按键，可以控制树莓派LED灯点亮或者熄灭。
(5)新增网页自刷新功能，网页每3s进行一次自刷新(浏览器每3s向服务器请求一次服务)。
经过我做的修改后，您可以在当前软件基础上，新增LED灯状态采集、GPIO控制等，修改成自己的树莓派”聊天“工具。

让我们的服务“飞起来”
我们运行jupyter-notebook的终端;
使用命令”cd /home/pi/Notebooks/easy_use_raspi_by_python/13.不论你身在何处，我都能握住你的手/camWebServer2″目录;
使用命令”python appCam2.py &”已后台方式运行我们的树莓派服务程序；
在我的笔记本上，启动火狐浏览器（其他浏览器亦可），在地址栏输入”192.168.43.115:8080″即可访问树莓派服务程序。
界面给出了两组信息：温度值和系统时间值，这两组信息均有树莓派提供。
界面提供2个控制按键，控制树莓派上NXEZ“瑞士军刀”扩展板LED点亮或熄灭。
关闭服务。在终端中输入指令“ps -aux”查看”python appCam2.py“进程号，通过”kill pid_id(python appCam2.py进程号)”，来结束该进程。

看看我的修改，这么简单，你也会

(1)“温、湿度采集”改为“温度采集”
更改文件：appCam2.py。

原版本程序：

get data from DHT sensor
def getDHTdata():
DHT22Sensor = Adafruit_DHT.DHT22 DHTpin = 16 hum, temp = Adafruit_DHT.read_retry(DHT22Sensor, DHTpin)
 
if hum is not None and temp is not None:
    hum = round(hum)
    temp = round(temp, 1)
return temp, hum

我更改后的版本：

get data from DHT sensor
def getDHTdata():
 
#DHT22Sensor = Adafruit_DHT.DHT22
#DHTpin = 16
#hum, temp = Adafruit_DHT.read_retry(DHT22Sensor, DHTpin)
 
hum = 1
temp = SAKS.ds18b20.temperature
if hum is not None and temp is not None:
    hum = round(hum)
    temp = round(temp, 1)
return temp, hum

核心点， 由“hum, temp = Adafruit_DHT.read_retry(DHT22Sensor, DHTpin)”更改为“temp = SAKS.ds18b20.temperature”

(2)更改服务端口由“80“端口变为“8080”端口。
更改文件：appCam2.py。

原程序版本： 

我更改后的版本：

核心点： 由”app.run(host=’0.0.0.0′, port =80, debug=True, threaded=True)“更改为”app.run(host=’0.0.0.0′, port =8080, debug=True, threaded=True)“

(3)新增led点亮按钮
更改文件：appCam2.py。

新增程序：

@app.route('/led_light') def led_on():
 
#点亮所有LED灯
SAKS.ledrow.on()
timeNow = time.asctime( time.localtime(time.time()) )
temp, hum = getDHTdata()
 
templateData = {
  'time': timeNow,
  'temp': temp,
  'hum'    : hum
}
return render_template('index.html', **templateData)

更改文件：templates/index.html。
增加了”LED_ON”按钮，按钮有效后，运行@app.route(‘/led_light’)程序，就完成了led点亮工作。
led熄灭新增功能一致，可自行阅读。

(4)网页自刷新功能
更改文件：templates/index.html。

课程 bilibili 视频地址：https://www.bilibili.com/video/av71878718/?p=24