一个网站由许多网页组成，可以在文件夹中放置多个网页，也可以嵌入其他子文件夹，最终形成树结构，如下图所示：

假如我们给顶级目录 program 绑定域名 www.domain.com，然后用户就可以通过了 www.domain.com 来访问 program 文件夹中的所有文件（包括子文件夹），例如：

• www.domain.com/demo.html
• www.domain.com/python/for.html
• www.domain.com/java/spring.html
• www.domain.com/java/maven/profile.html

可以简单认为，网站就是一个绑定了域名的文件夹，该文件夹中可以包含子文件夹以及各种各样的文件，域名可以访问这些文件。当我们在地址栏中输入一个时 URL 事实上，它已经显示了服务器上的目录结构，例如www.domain.com/python/for.html，就表示访问 linux 目录下的 for.html 文件。

URL是URI子集Uniform Resource Locator缩写被翻译为统一资源定位 符”。

通俗地说，URL是Internet上述信息资源的字符串主要用于各种信息资源WWW客户程序和服务器程序上。

采用URL各种信息资源，包括文件、服务器地址和目录，都可以用统一的格式来描述。URL是URI实现概念的一种方式。

URL一般格式为(带方括号[]的为可选项):

protocol ??/ hostname[:port] / path /xxx.html

URL格式由三部分组成：

①第一部分是协议(或服务模式)。

②第二部分是拥有该资源的主机IP地址(有时包括端口号)。

③第三部分是主机资源的具体地址，如目录和文件名。

第一部分和第二部分用/符号隔开，

第二部分和第三部分用/符号分开。

第一部分和第二部分是不可或缺的，有时可以省略第三部分。

网站的本质特征是超链接！ WWW以服务为基础Web页，WWW的核心是Web服务器。

• WWW语言用超文本标记 HTML（HyperText Markup Language）与超文本传输协议 HTTP（ Hyper Text Transfer Protocol)为用户提供统一访问界面的信息浏览系统。

• 网页：网页是单一的HTML文件，是WWW在服务器上发布信息的单位。

• 网站：存储网站WWW相关内容显示在服务器上网页和其它网络文件的集合。

• 主页：主页是一个特殊的网页，是整个网站信息的起点和总结点。主页是访问者浏览网站信息文件的起点。主页上的文件被称为index，后缀名为.htm 或.html

在Internet早期，Web站点是静态的web静态页面只能固定地显示预设计的页面内容。随着Web业务处理越来越多，业务需求水平越来越高，如商业网站客户数据获取、产品信息查询、信息反馈等，HTML限制越来越明显。因此，能够与用户动态交互的技术应运而生。服务端处理了动态网页内容，完成了动态个性化设置。然而，客户端用户收到的结果是HTML格式显示与传统页面没有区别。

Web也可以称为服务器网站服务器，可用于用户浏览网站文件。目前最主流的Web服务器有IIS、Apache和Nginx，此外Tomcat此外，使用也很常见kangle、WebSphere和Weblogic等类型。

IIS是Internet Information Server(信息服务)的缩写也是微软推广的web适用于服务器产品windows许多著名网站都使用系统IIS搭建，ASP、.net开发的程序只能在IIS上运行。

Apache它是世界上最受欢迎的Web支持跨平台应用的服务器之一，几乎可以在几乎所有的服务器中运行Unix、windows、linux特别是在系统平台上linux支持相当完美。

Apache免费开源，许多开发者参与了设计和改进，促进了产品的不断改进。Apache其特点是简单、高速、性能稳定，可作为代理服务器使用。到目前为止，Apache它仍然是世界上使用最多的Web服务器的成功主要在于源代码开放、强大的社区支持、跨平台应用和可移植性。不过，Apache基于过程的结构比线程消耗更多的系统费用，不适合多处理器环境，并发性不强，流量大容易出现500个错误。

Nginx高性能HTTP和反向代理web支持高并发性和负载平衡的服务器以其稳定性、丰富的功能集、示例配置文件和低系统资源的消耗而闻名。

Nginx大多数都可以Unix/Linux并有Windows移植版。Nginx安装简单，配置文件简单(支持perl语法)，同时Bug非常少，几可以做到7*24不间断运行，支持在不间断服务的情况下进行软件版本升级。在连接高并发的情况下，Nginx是Apache服务不错的替代品。同时Nginx的模块也非常丰富，能够满足不同的需求，适合做静态使用。另外Nginx还提供了IMAP/POP3/SMTP服务，是一个非常优秀的邮件代理服务器。

Tomcat是一个开放源代码、运行servlet和JSP Web应用软件、并基于Java的Web应用软件容器。由于技术先进、性能稳定，而且免费，深受Java 爱好者欢迎，同时，也得到了部分软件开发商认可，成为目前比较流行的Web应用服务器。

Tomcat 属于轻量级应用服务器，在中小型系统和并发访问用户不是很多的场合下被普遍使用，是开发和调试JSP 程序的首选。和IIS等Web服务器一样，tomcat也有处理HTML页面的功能，另外它还是一个Servlet和JSP容器（默认模式下为独立的Servlet容器）。不过，Tomcat处理静态HTML的能力不如Apache服务器，目前Tomcat最新版本为9.0。

Kangle是一款跨平台、功能强大、易操作的高性能web服务器和反向代理服务器，也是一款专为做虚拟主机研发的web服务器，实现虚拟主机独立进程、独立身份运行与用户安全隔离，支持php、asp、http://asp.net、java、ruby等多种动态开发语言。

WebSphere是IBM 的软件平台，包含了编写、运行和监视全天候的工业强度的随需应变Web应用程序和跨平台、跨产品解决方案所需要的整个中间件基础设施，如服务器、服务和工具。WebSphere 是一个模块化的平台，基于业界支持的开放标准，并可在 Intel、Linux 和 z/OS等多平台运行。

WebLogic是Oracle出品的一款多功能、基于标准的web应用服务器，是一款基于JAVAEE架构的中间件，用于开发、集成、部署和管理大型分布式Web应用、网络应用和数据库应用，将Java的动态功能和安全标准引入大型网络应用的开发、集成、部署和管理之中，为企业构建自己的应用提供了坚实的基础。

也即超越纯文本，这意味着 HTML 文档不仅能包含文本（文字），还能包含图片、音视频、表格、列表、链接、按钮、输入框等高级内容。

HTML 是一种计算机语言，但它不能编程，只能用来标记网页中的内容。HTML 通过不同的标签来标记不同的内容、格式、布局等，例如：

• 标签表示一张图片；

• 标签表示一个链接；

• 标签表示一个表格；

• 标签表示一个输入框；

• <p> 标签表示一段文本；

• 标签表示文本加粗效果；

• <div> 标签表示块级布局。

HTML 是一种用来开发网页的计算机语言，它通过标签（标记式指令）将文本、音视频、图片、表格、按钮、输入框等内容显示出来。也就是说，HTML 是用来给网页内容进行排版和布局的。

DHTML使HTML专注于文档结构整理，CSS来专注于信息的视觉表现。 HTML+CSS，可使网页内容(Content)与表现(Design)完全分离，以更好的结构来展示信息，使信息易于展现并易于修改。

JavaScript 脚本语言，可以用来为Web增加交互性。

HTML代表超文本标记语言，用于使用标记语言设计网页。HTML是超文本和标记语言的组合，超文本定义了网页之间的链接；标记语言用于定义标记内的文本文档，该文档定义网页的结构。此语言用于注释（在计算机注释中）文本，以便机器可以理解它并相应地操作文本。【推荐阅读：html参考手册】

大多数标记（例如HTML）语言都是人类可读的。该语言使用标签来定义必须对文本进行哪些操作。它用于在网页上构造和呈现内容。

HTML5是HTML的第五个版本，HTML5中删除或修改了许多元素。

（1）HTML5支持SVG，画布和其他虚拟矢量图形，而在HTML中，只有将它与Flash，Silver-light等不同技术结合在一起才能使用矢量图形。

（2）HTML5使用Web SQL数据库，可用于临时存储数据但在HTML中只有浏览器缓存才可用于此目的。

（3）HTML5支持新的表单控件，例如：日期和时间，电子邮件，数字，范围，电话，网址，搜索等。

（4）HTML 5是否允许音频和视频控件以及标签，HTML不允许音频

（5）在HTML 5中，Doctype声明非常简单易用，Doctype声明在HTML中太长且复杂，html5:文档声明相对来说更为简便，有利于程序员快速阅读和开发。

（6）charset，async和ping的属性是HTML 5的一部分，HTML中不存在charset，async和ping等属性

（7）增强了对Web应用程序功能的支持：在HTML5允许浏览器作为应用程序平台运行不需要使用任何基于JS或Flash的方法，因为HTML5中固有的元素提供了所有功能。

（8）新增加

​ 只要是有编辑功能的编辑器，基本都可以用来开发html，甚至可以使用电脑自带的记事本、word等编辑器，只要记住把文档的后缀名改为.html就可以了。当然不建议使用比如记事本之类的编辑器，因为这类编辑器没有提示也没有格式，使用起来开发效率低。如果是刚开始学习的话，可以使用这种编辑器，会帮助你记忆（写多了自然就记住了）。

我平常主要使用vscode.通过安装插件vscode开发起html,cs,js等各种语言十分方便。

强烈推荐这个编辑器，通过安装插件可以开发前端，java，Python，c#,c/c++等各种语言，也可以用来开发Arduino,stm32,esp-idf等。

https://blog.csdn.net/caohongxing/article/details/108632859 ||https://blog.csdn.net/caohongxing/article/details/108632859

下载地址：https://code.visualstudio.com/

功能介绍：

微软在2015年4月30日Build 开发者大会上正式宣布了 Visual Studio Code 项目：一个运行于 Mac OS X、Windows和 Linux 之上的，针对于编写现代 Web 和云应用的跨平台源代码编辑器。

Visual Studio Code软件功能非常强大，界面简洁明晰、操作方便快捷，设计得很人性化。软件主要改进了文档视图，完善了对 Markdown的支持，新增PHP语法高亮。

下载地址：http://www.dcloud.io/

功能介绍：

前端开发小白入门首选，hbuilder是国产的一款前端开发工具而且是免费的，对于英语不好的前端工程师是一个不错的消息。

优点是有强大的其他语言支持和开发webapp等功能，强大到没朋友。在语法提示、转到定义、重构、调试等方面都非常高效。缺点也是有一些的，就是其有些稳定，有时可能会有些卡顿的现象

下载地址：http://www.sublimetext.com/

功能介绍：

sublime text是一个轻量级的编辑器，也是支持各种编程语言，sublime text所有的强大功能都是支持插件的，而且快捷键十分的好用，可以极大的减少开发的劳动程度，使用sublime就是要使用其快捷键和插件。

sublime text3的优点的轻量级但是功能强大，优雅小巧启动速度快，有着丰富的第三方支持，能够满足各种各样的扩展缺点是对于项目的管理等不是很方便，但代码提示不如hubuilder强大。

下载地址：https://www.jetbrains.com/webstorm/

功能介绍：

WebStorm 是jetbrains公司旗下一款JavaScript 开发工具。官方提供的插件支持，满足许多不会配置的同学，ESlint，词法高亮，emmet，CSS预处理器，新版本也添加了对ES6的支持，内建了服务器调试。

目前已经被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等。与IntelliJ IDEA同源，继承了IntelliJ IDEA强大的JS部分的功能。

下载地址：https://atom.io/

功能介绍：

Atom 是github专门为程序员推出的一个跨平台文本编辑器。平易近人,但可删节的核心工具定制做任何事,也可以使用有效不沾一个配置文件。为开源而生。

具有简洁和直观的图形用户界面，并有很多有趣的特点：支持CSS，HTML，JavaScript等网页编程语言。它支持宏，自动完成分屏功能，集成了文件管理器。

下载地址：https://www.adobe.com/products/dreamweaver.html

功能介绍：

老牌的IDE ，曾经以PS+DW+FW称霸网页领域，号称网页三剑客，然而之前的版本更新较慢，版本陈旧，已经满足不了广大前端开发者的项目需求，逐渐被市场淘汰。

好在2017版本及时修正，外观、界面、语法高亮等已经很漂亮，并且添加了CSS预处理器支持，同时保留了部分预制组件，方便对语法还不熟悉的同学，对于不会node的同学也有提供实时预览，适合对前端有进一步了解的同学。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-mGYdxZh9-1650540844646)(C:\Users\immortal\AppData\Roaming\Typora\typora-user-images\image-20220303205849362.png)]

学习html很简单，就是学习一些标签的用法，但是需要我们多写，多练才能熟悉，才能灵活的应用。

一些好用的学习网站:

• W3school:https://www.w3school.com.cn/html/index.asp
• 菜鸟教程：https://www.runoob.com/html/html-tutorial.html
• c语言中文网：http://c.biancheng.net/html/

F12打开开发者工具

Chrome开发者工具中，调试时使用最多的三个功能页面是：元素（ELements）、控制台（Console）、源代码（Sources），此外还有网络（Network）等。

• 元素（Elements）：用于查看或修改HTML元素的属性、CSS属性、监听事件、断点等。css可以即时修改，即时显示。大大方便了开发者调试页面
• 控制台（Console）：控制台一般用于执行一次性代码，查看JavaScript对象，查看调试日志信息或异常信息。还可以当作Javascript API查看用。例如我想查看console都有哪些方法和属性，我可以直接在Console中输入"console"并执行Sources:断点调试JS。
• 源代码（Sources）：该页面用于查看页面的HTML文件源代码、JavaScript源代码、CSS源代码，此外最重要的是可以调试JavaScript源代码，可以给JS代码添加断点等。
• 网络（Network）：记录当前页面请求加载信息，并记录各个请求资源信息（包括状态、资源类型、大小、所用时间等），可以根据这个进行网络性能优化。
• **性能（Performance）😗*用来对当前页面进行性能分析。
• **内存（Memory）😗*用于分析当前页面内存消耗。
• **应用（Application）😗*记录网站加载的所有资源信息，包括存储数据（Local Storage、Session Storage、IndexedDB、Web SQL、Cookies）、缓存数据等。
• **安全（Security）😗*判断当前网页是否安全。
• **审计（Audits）😗*对当前网页进行网络利用情况、网页性能方面的诊断，并给出一些优化建议。

Html标签语法简单，本次课程通过菜鸟教程网站进行HTML5基本语法教学，选择性的讲解常用的html标签，帮助大家节省初次学习的时间，课程结束后可根据需要自己按需进行学习。

https://www.runoob.com/html/html-tutorial.html

**学习资料：**https://www.cnblogs.com/zyx110/p/11891335.html

计算机网络是由通信介质将地理位置不同的且相互独立的计算机连接起来，实现数据通信与资源共享。互联网的本质就是一系列的协议，总称为‘互联网协议’（Internet Protocol Suite).互联网协议的功能：定义计算机如何接入internet，以及接入internet的计算机通信的标准。

互联网协议按照功能的不同，分为 osi 七层， tcp / ip 五层， tcp / ip 四层协议。如下图：

OSI七层协议数据传输的封包与解包过程

osi 的七层协议体系结构的概念清楚，理论也比较完善，但它既复杂又不实用， ISO 制定的 osi 协议参考模型的过于庞大、复杂招致了许多批评。于此对照，由技术人员自己开发的 TCP / IP 协议获得了更为广泛的应用。因此，我们只需要弄明白 TCP / IP 五层协议 就能了解和明白计算机最底层的通信是怎么回事。

如图，从最下方的物理层到最上方的应用层，对于我们用户而言，最直接的是应用层。从上到下每一层都依赖于下一层

互联网协议族（Internet Protocol Suite，缩写IPS）是一个网络通信模型，以及一整个网络传输协议家族，为互联网的基础通信架构。它常被通称为TCP/IP协议族（TCP/IP Protocol Suite，或TCP/IP Protocols），简称TCP/IP。

TCP/IP 模型包含了 TCP、IP、UDP、Telnet、FTP、SMTP 等上百个互为关联的协议，其中 TCP 和 IP 是最常用的两种底层协议，所以把它们统称为“TCP/IP 协议族”。

在上面，通常我们是把TCP/IP协议族分为四层，但是如果是五层的话就是在链路层下再加个物理层。下面是对各层的详细介绍。

如上图所示，当应用程序采用TCP传送数据时，数据被送入协议栈中，然后，通过每一层直到被当做一串比特流传入网络中。其中每一层收到数据都会对数据增加一些首部信息（有的还需要尾部信息）。TCP传给IP的数据单元称为TCP报文段或简称为TCP段（UDP传给IP的数据单元称为UDP数据段），IP传给网络接口层的数据单元称为IP数据报。通过以太网传输的比特流称为帧。

当目的主机收到了一个以太网的数据帧时，数据要从协议栈中，由底往上，同时去掉各层协议上的报文首部，如下图所示：

学习资料：http://c.biancheng.net/view/2123.html

​ socket 的原意是“插座”，在计算机通信领域，socket 被翻译为“套接字”，它是计算机之间进行通信的一种约定或一种方式。通过 socket 这种约定，一台计算机可以接收其他计算机的数据，也可以向其他计算机发送数据。

​ socket 的典型应用就是 Web 服务器和浏览器：浏览器获取用户输入的 URL，向服务器发起请求，服务器分析接收到的 URL，将对应的网页内容返回给浏览器，浏览器再经过解析和渲染，就将文字、图片、视频等元素呈现给用户。

​ 简单来说，就是操作系统实现了TCP/IP协议族的各种通讯协议，然后通过Socket这个接口开放给用户，使用户和应用程序具有访问网络的能力。

Socket是应用层与TCP/IP协议族通信的中间软件抽象层，它是一组接口。在设计模式中，Socket其实就是一个门面模式，它把复杂的TCP/IP协议族隐藏在Socket接口后面，对用户来说，一组简单的接口就是全部，让Socket去组织数据，以符合指定的协议。

先从服务器端说起。服务器端先初始化Socket，然后与端口绑定(bind)，对端口进行监听(listen)，调用accept阻塞，等待客户端连接。在这时如果有个客户端初始化一个Socket，然后连接服务器(connect)，如果连接成功，这时客户端与服务器端的连接就建立了。客户端发送数据请求，服务器端接收请求并处理请求，然后把回应数据发送给客户端，客户端读取数据，最后关闭连接，一次交互结束。

• 所谓进程指的是：运行的程序以及运行时用到的资源这个整体称之为进程

• 所谓进程间通信指的是：运行的程序之间实现数据共享和传递

socket(简称 套接字) 是最通用的进程间通信的一种方式，它与其他进程间通信的一个主要不同是：

它能实现不同主机间的进程间通信，我们网络上各种各样的服务大多都是基于 Socket 来完成通信的

例如我们每天浏览网页、QQ 聊天、收发 email 等等

Http协议是基于TCP的，主要用于web的一种应用层协议

超文本传输协议（英文：HyperText Transfer Protocol，缩写：HTTP）是一种用于分布式、协作式和超媒体信息系统的应用层协议。HTTP是万维网的数据通信的基础。

HTTP的发展是由蒂姆·伯纳斯-李于1989年在欧洲核子研究组织（CERN）所发起。HTTP的标准制定由万维网协会（World Wide Web Consortium，W3C）和互联网工程任务组（Internet Engineering Task Force，IETF）进行协调，最终发布了一系列的RFC，其中最著名的是1999年6月公布的 RFC 2616，定义了HTTP协议中现今广泛使用的一个版本——HTTP 1.1。

2014年12月，互联网工程任务组（IETF）的Hypertext Transfer Protocol Bis（httpbis）工作小组将HTTP/2标准提议递交至IESG进行讨论，于2015年2月17日被批准。 HTTP/2标准于2015年5月以RFC 7540正式发表，取代HTTP 1.1成为HTTP的实现标准。

HTTP是一个客户端终端（用户）和服务器端（网站）请求和应答的标准（TCP）。通过使用网页浏览器、网络爬虫或者其它的工具，客户端发起一个HTTP请求到服务器上指定端口（默认端口为80）。我们称这个客户端为用户代理程序（user agent）。应答的服务器上存储着一些资源，比如HTML文件和图像。我们称这个应答服务器为源服务器（origin server）。在用户代理和源服务器中间可能存在多个“中间层”，比如代理服务器、网关或者隧道（tunnel）。

尽管TCP/IP协议是互联网上最流行的应用，HTTP协议中，并没有规定必须使用它或它支持的层。事实上，HTTP可以在任何互联网协议上，或其他网络上实现。HTTP假定其下层协议提供可靠的传输。因此，任何能够提供这种保证的协议都可以被其使用。因此也就是其在TCP/IP协议族使用TCP作为其传输层。

通常，由HTTP客户端发起一个请求，创建一个到服务器指定端口（默认是80端口）的TCP连接。HTTP服务器则在那个端口监听客户端的请求。一旦收到请求，服务器会向客户端返回一个状态，比如"HTTP/1.1 200 OK"，以及返回的内容，如请求的文件、错误消息、或者其它信息。

在浏览器地址栏键入URL，按下回车之后会经历以下流程：

1. 浏览器向 DNS 服务器请求解析该 URL 中的域名所对应的 IP 地址;
2. 解析出 IP 地址后，根据该 IP 地址和默认端口 80，和服务器建立TCP连接;
3. 浏览器发出读取文件(URL 中域名后面部分对应的文件)的HTTP 请求，该请求报文作为 TCP 三次握手的第三个报文的数据发送给服务器;
4. 服务器对浏览器请求作出响应，并把对应的 html 文本发送给浏览器;
5. 释放 TCP连接;
6. 浏览器将该 html 文本并显示内容;

HTTP 的请求报文由三部分构成：

• 请求行：由请求方法（Method）、URL 字段和 HTTP 的协议版本组成，注意其中的空格、回车符和换行符均不可省略，所以我们的请求方法实际上就是位于请求行中的了。

• 请求头部：位于请求行之后，个数可以为 0~若干个，每个请求头部都包含一个头部字段名和一个值，它们之间用冒号 “:” 分隔，在最后用回车符和换行符表示结束。

• 请求数据：如果请求方法为 GET，那么请求数据为空。它主要是在 POST 中进行使用，适用于需要填表单（FORM）的场景。我们通过一个实际的例子来看看 HTTP 的 GET 请求报文是什么样的，我们这里以访问 api.github.com/search/users?q=JakeWharton为例，通过抓包我们得到的请求报文如下所示：

请求头里面的内容举个例子：这个length表示请求体里面的数据长度，其他的请求头里面的这些键值对，陆续我们会讲的，大概知道一下就可以了，其中有一个user-agent，算是需要你记住的吧，就是告诉你的服务端，我是用什么给你发送的请求。

请求方法（所有方法全为大写）有多种，各个方法的解释如下： GET 请求获取Request-URI所标识的资源 POST 在Request-URI所标识的资源后附加新的数据 HEAD 请求获取由Request-URI所标识的资源的响应消息报头 PUT 请求服务器存储一个资源，并用Request-URI作为其标识 DELETE 请求服务器删除Request-URI所标识的资源 TRACE 请求服务器回送收到的请求信息，主要用于测试或诊断 CONNECT 保留将来使用 OPTIONS 请求查询服务器的性能，或者查询与资源相关的选项和需求 应用举例： GET方法：在浏览器的地址栏中输入网址的方式访问网页时，浏览器采用GET方法向服务器获取资源，eg:GET /form.html HTTP/1.1 (CRLF)

POST方法要求被请求服务器接受附在请求后面的数据，常用于提交表单。 eg：POST /reg.jsp HTTP/ (CRLF) Accept:image/gif,image/x-xbit,… (CRLF) … HOST:www.guet.edu.cn (CRLF) Content-Length:22 (CRLF) Connection:Keep-Alive (CRLF) Cache-Control:no-cache (CRLF) (CRLF) //该CRLF表示消息报头已经结束，在此之前为消息报头 user=jeffrey&pwd=1234 //此行以下为提交的数据

HEAD方法与GET方法几乎是一样的，对于HEAD请求的回应部分来说，它的HTTP头部中包含的信息与通过GET请求所得到的信息是相同的。利用这个方法，不必传输整个资源内容，就可以得到Request-URI所标识的资源的信息。该方法常用于测试超链接的有效性，是否可以访问，以及最近是否更新。

最常用的就是GET和POST请求

大家平时在使用单片机进行编程时，经常会遇到显示，控制和调试三个问题，即对单片机结果的展示，如何对单片机实施控制以及程序运行时对参数和程序的调试。以Stm32为例，显示可以采用OLED屏或LCD彩屏，控制可以采用按键或者电阻触摸屏，调试采用串口调试参数或者按键调试参数，对新手来说，采用以上方法可能有一些难度，在传统的前后台编程模式中，以上三个模块加入程序会增加程序的复杂度，可能会带来一系列的问题。

大家在平时做应用时，如果涉及到人机交互，可以考虑使用串口屏，串口屏内部集成了显示屏的驱动程序，MCU可以通过串口来实现显示，控制，和调试三个行为。但这种做法的唯一缺点就是串口屏幕的价格较高。同时，如果程序十分复杂的话，可以考虑在stm32上应用RTOS实时操作系统，简化编程难度，提高程序的执行效率。

针对使用串口屏价格较高，直接驱动LCD屏难以做出美观界面的问题。大家在平时的应用中可以考虑使用网页的形式来做人机交互。

• ESP32官网教程：https://docs.espressif.com/projects/esp-idf/zh_CN/latest/esp32/get-started/index.html

• Micropython教程：http://www.micropython.com.cn/en/latet/library/index.html

Esp32内置了lwip这个轻量级的TCP/IP协议栈；前面我们说过Socket是应用层与TCP/IP协议族通信的中间软件抽象层，因此我们可以在esp32上进行socket编程来使用tcp/udp等协议，而http又是基于TCP协议的，因此我们可以在esp32上使用HTTP协议来与手机或者电脑上的浏览器传递信息。

lwIP是一套在MCU层级上用C实现的IP协议栈，可以运行在裸机/RTOS/嵌入式Linux，乐鑫为ESP32提供了相关移植包

MIPS(Million Instructions Per Second)：单字长定点指令平均执行速度 Million Instructions Per Second的缩写，每秒处理的百万级的机器语言指令数。这是衡量CPU速度的一个指标。

BLE是低功耗蓝牙的英文缩写（Bluetooth Low Energy），是蓝牙4.0版本起开始支持的新的、低功耗版本的蓝牙技术规范。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-m4IOsdMy-1650540844663)(https://s2.loli.net/2022/03/04/6nDfsHuryZdBMpl.png)]

• 浏览器端处理：可以使用js的setInterval设置定时时间来执行相应的函数，或者通过事件的方式执行函数，发送http请求可以使用XMLHttpReq。
• MCU端处理：通过micropython的 _thread模块新建一个进程来单独负责http请求的处理，调用accept()函数后，线程被阻塞，当浏览器发起http请求时，先与MCU的80端口建立连接，然后发送HTTP请求头，控制信息可以包含在http请求头中，方便esp32端进行处理。

• ESP-IDF： 采用c/c++的语法进行编程，官方推荐，优点是灵活，官方文档上的各种API比较多。
• Micropython: Esp32需要刷入相应固件，人生苦短，我用python，优点不多说。但我使用的时候发现如果使用micropython的话好像不能发挥esp32的全部性能？在micropython中可以使用的内存变小了好多。
• Arduino: 使用c/c++语法编程，简单易用，Arduino平台上的各种开源库让你十分方便就能做出各种炫酷的应用。

以灯哥开源四足机器人项目控制程序为例：

项目开源地址 Github:https://github.com/ToanTech/py-apple-quadruped-robot

Linux服务器环境搭建可以参考我原来写过的一篇文章：http://www.gonghaojing.top:8080/archives/linux-yuan-cheng-fu-wu-qi-huan-jing-da-jian

云服务器是一台部署在云端的一台远程主机，通过ssh协议可以想在本地一样使用云服务器。ssh协议属于TCP/IP协议族中的一种用于远程登录的安全的通讯协议，它位于体系结构中的应用层，实际是使用Tcp协议进行通讯。常见的远程登录有telnet和ssh两种，但ssh协议是十分安全的，因为它在通讯的过程中，会对需要通讯的消息进行加密，实际传输的都是密文，十分安全，故而经常用于远程控制服务器。

拥有一台远程服务器是很酷的一件事情，拥有一台服务器可以干许多事情，例如搭建一台MQTT服务器，然后可以使用ESP8266或ESP32等芯片轻松实现物联网应用。搭建一台Frp服务，轻松实现内网穿透，解决众多小伙伴没有公网ip的烦恼。搭建一台Mysql服务器,实现数据的远程存储。配置Tomcat服务器,搭建个人网站或博客，或者搭建一台我的世界服务器等等…

现在网上有许多服务器的供应商，例如阿里云，腾讯云等，每个平台新用户或双十一的时候都有巨大折扣。购买服务器时主要看三个指标：**1.性能指标：**例如1核2G或2核4G,主要体现云服务器的性能。**2.带宽：**带宽也是一个很重要的指标，带宽除以8就是实际的最大网速，对于网站，游戏服务器等并发量可能会比较大的应用，需要选取合适的带宽。3，是否是境外服务器:对于境外服务器，搭建网站的时候不需要备案，如何时境内的，根据相关法律法规的要求，必须要进行备案。ps:网站备案程序十分麻烦，建议早做准备，我前段时间为我的域名备案，一顿操作后还让我苦等了半个月，其中艰辛不足为外人道也。。。如果是境外服务器还可以搭建梯子，frp就可以实现Socket代理和http代理，实现科学上网。但境外服务器的价格普遍比国内服务器的价格贵许多。

腾讯云：https://cloud.tencent.com/

阿里云：https://cn.aliyun.com/

配置好域名解析后可以通过域名直接访问到主机，免得去记忆主机ip。正常情况下，解析成功后80端口的网站是不能访问的，需要网站需要域名备案后才能访问。

腾讯云：https://buy.cloud.tencent.com/domain

Tomcat服务器教程：https://blog.csdn.net/heyeqingquan/article/details/96437921

个人网站。可以采用网上下载建站模板，自己修改的方式。零基础也可以迅速开发出精美的网站。

• 站长之家：https://sc.chinaz.com/moban/
• 第一模板网：https://www.11moban.com/grmb/index
• 网站模板库：http://www.baisheng999.com/
• 英文的模板库：https://html5up.net/
• 网页插件库：http://www.htmleaf.com/html5/html

个人博客。可以使用WordPress或者基于Java的halo博客工具，快速开发出自己的博客。

• Halo官网：https://halo.run/
• Halo美化教程：https://bestzuo.cn/posts/halo-beauty.html#%E5%86%99%E5%9C%A8%E5%89%8D%E9%9D%A2

一般在域名服务商那里都会有代备案系统

ICP备案的目的就是为了防止在网上从事非法的网站经营活动，打击不良互联网信息的传播，如果网站不备案的话，很有可能被查处以后关停。根据中华人民共和国信息产业部第十二次部务会议审议通过的《非经营性互联网信息服务备案管理办法》条例，在中华人民共和国境内提供非经营性互联网信息服务，应当办理备案。未经备案，不得在中华人民共和国境内从事非经营性互联网信息服务。而对于没有备案的网站将予以罚款或关闭。

网站备案是根据国家法律法规需要网站的所有者向国家有关部门申请的备案，公安局备案是其中一种。公安局备案一般按照各地公安机关指定的地点和方式进行，操作流程会比ICP备案流程简单，主要是已登记为主。

以百度官网为例，其中京公安网备11000002000001就是公安备案，京ICP证030173号就是ICP备案

该站长工具可以通过在你的网页中添加链接，从而对访问网页的人数，频率等进行统计。

CNZZ（ http://www.cnzz.com）是全球最大的中文互联网数据统计分析服务提供商，为中文网站及中小企业提供专业、权威、独立的第三方数据统计与分析服务。目前累计超过400万家网站采用了CNZZ提供的流量统计服务，一周覆盖90%以上的上网用户。

CNZZ站长统计和全景统计是两款专业的实时网站流量统计分析系统，可以帮助网站管理员、运营人员、推广人员等实时获取网站流量，并从流量来源、网站内容、网站访客特性等多方面提供网站分析的数据依据。从而帮助您提高网站流量，提升网站的用户体验，让访客更多的沉淀下来变成会员或客户，通过更少的投入获取最大化的收入。

通过简单的几步操作，安装CNZZ统计代码，您就可以实时获得多达几十种的网站数据报告，且所有的报告按照网站数据分析思路一气呵成。网站分析领域的统计指标在CNZZ统计中都可以快速找到，拥有“浏览次数（PV）”、“独立访客（UV）”、“IP”、“访问次数（Session）”这种基础流量指标，也拥有像“平均访问时长”、“跳出率”这种衡量访客行为的指标。更多可提供的指标见这里。

把你的服务器软件运行起来就上线了

如果你想成为一个专业的后端开发工程师

参照动力节点Java web学习流程：https://space.bilibili.com/76542346/favlist?fid=124751046

的中文互联网数据统计分析服务提供商，为中文网站及中小企业提供专业、权威、独立的第三方数据统计与分析服务。目前累计超过400万家网站采用了CNZZ提供的流量统计服务，一周覆盖90%以上的上网用户。

CNZZ站长统计和全景统计是两款专业的实时网站流量统计分析系统，可以帮助网站管理员、运营人员、推广人员等实时获取网站流量，并从流量来源、网站内容、网站访客特性等多方面提供网站分析的数据依据。从而帮助您提高网站流量，提升网站的用户体验，让访客更多的沉淀下来变成会员或客户，通过更少的投入获取最大化的收入。

通过简单的几步操作，安装CNZZ统计代码，您就可以实时获得多达几十种的网站数据报告，且所有的报告按照网站数据分析思路一气呵成。网站分析领域的统计指标在CNZZ统计中都可以快速找到，拥有“浏览次数（PV）”、“独立访客（UV）”、“IP”、“访问次数（Session）”这种基础流量指标，也拥有像“平均访问时长”、“跳出率”这种衡量访客行为的指标。更多可提供的指标见这里。

把你的服务器软件运行起来就上线了

如果你想成为一个专业的后端开发工程师

参照动力节点Java web学习流程：https://space.bilibili.com/76542346/favlist?fid=124751046