esp8266开发web网页版无线串口助手+5路可编程PWM开发心得

缘起

一年前我就想做一个通过web页面来探制esp8266串的想法，主要是只要一个浏览器就在局域网可以实现串口调试，可以跨设备，跨平台使用

开发平台

开发为ardino IDE+H5+css+javascript+websocket+esp8266部分 原生sdk代码移植，硬件基于esp8266 mini D1开发板
esp8266 nodemcu系列开发板有个问题 对部分MCU的串口只能发数据，不能收据需要改造一下才行。

从开始动手到做到现在这个样子，差不多写写停停八花了10月，可能你看到的页面就那么几个，这些页面其实就我不断给自己挖坑，再填坑爬出来，再挖，如此循环面来。现在终于可以露个脸了。
简单说，我就是为了喝一杯牛奶，结果开了一个养牛场！！！下面分享一下我的经验
已实现主要功能：
1、web版无线串口助手，采用websocket与模块通讯，数据交互算是接近实时，功能主要参考了各流行的pc版串口助手，hex ascii 的方式都有，不过目前仅支持8位数据，应该大部分够用
2、 加了modbus crc16校验生成，方便modbusRTU设备的调试。
3、SYN6288语模块播放代码转换，也就是输入中文后可以一键转放成语音模块的播放代码，这个原本是为了测试长数据发送的可靠性的， SYN6288支持一次收200个字节,后觉得这个模块用起来不错，就将这个功能留下了
4、自我感觉web管理页面的交互性不错，因为可以用H5+javascript代码干很多事情，当然也有不足的地方，因为我没有用框架，全部用原生代码写，相当麻烦，为了一个功能要在度娘找好久，很多是没有现成的可用，只能自行拼接。
5、我一个朋友想要一pwm输出功能和一个开关控制功能，原先我就写了一路，esp8266+arduino IDE要实现pwm还是比容易实现，不过是软件模拟的。原本就这么结了，后来发现原来pwm可以干很多活，比如驱动舵机，步进电机，因为驱动步进电机要四路，后来就搞成四路了，每路2hz-10KHZ
分辨率1024，一般用还是没问题，库文件好像是按16路设计的变量数组，有兴趣的可以看一下库文件。
6、 至于可编程，就是可以用字符串命令控制pwm输出，可以设置每路的频率，占空比，变化超始，变化终止，每隔nm,占空比变化量等，最简单的应用是可以控制四个舵机机械臂的运动动作。外加一个电机驱动板可以驱动5相四线，2相四线步进电机
7、 一路开关功能，可以实现2ms-999h周期的pwm信号，通俗讲可以听不同频率的继电器声音，定时开，定关之类的。如我设计的命令格式为：on:50|off:50|$[3]loop,功能是开50ms ,关50ms 循环3次停止，on:3s 就是开3秒停，个人觉得ascii命令还是有优势，esp8226频率可以到160M了，不用在乎多几个字节的时间，配合web界面在控制方面还是比较友好。
8、实现了web版本可视化 OTA在线升级功能
9、实现了网页版内网发现硬件，airkiss配网，也就是smartconfig

功能要点：

1、硬件内网发现，wifi配网一气呵成，
2、 跨平台，跨设备的无线web网页串口助手，
3、 0.0001Hz-10KHz ,可编程PWM方波信号发生器，可以驱动4舵机机械臂，加上驱动板可以驱动5线四相，4线两相步电机，可以当时间继电器测试用
4、固件在线升，可以很方便修复BUG
如果内存够用，准备再加上MQTT上传OneNet云平台的温度计
esp8266+arduino 确实是好搭挡**

所有网络功能基本上是基于H5页面完成，类似于一个路由器操作界面，设好模块的固定IP,就可以在路由器上设置端口映射，如果你的宽带有固定Ip,就可以通过外网远程访问串口了，也可以通过花生壳进行远程访问web 无线串口

为了测试兼容性我试了很多浏览器，我觉得在IPAD上使用最方便，屏幕大小合适，显示的网页控件也算漂亮，无需装客户端就可以用串口调式备

开发心得分享：

1、esp8266 确实是一个好模块，就是内存少了点，共80K,我把以上功能实现，差不多用掉40k了，别以为余下40k新富有，如果用自带的webserver库，为升级方便我没有用文件流方式（有点慢），直接将网页内容以变量的方式保存在flash中，如果一个页面15K，webserver库要是再整个变量拼装一次，在内存高占用时段，可能内存就溢出了，后果就是访问的网页会显示不全，严重时重启，所以一定要控制好一个页面的字节数，连js变量都要尽量短，代码进行压缩 。
2、esp8266稳定性还是可以的，有时会莫明的重启，大部分情况是变量设置不当，虽然编译通过了，但变量在调用过程中可出现异常，造成函数运行时变量内存溢出，写复杂代码时，最好是不要一次写了很多再编译调试，因为如果有问题，你可能要回滚很多步错误才消失。

尽量少用全局变量，全局变量非常耗内存，内存不足也是esp8266不稳定因素之一。长串的变量尽量作长度控制，设定边界，如果你的项目很大，一定要规划好变量，高手经常说少用全局变量，我现在才明白是很有道理的。
尽量不要在loop循环中定义变量，尽量只放函数封装，貌似这里定义了变量不会像函数中的局变量用完就回收。
3、自带例程是基础，不过例程功能有限，如果有需要可以进一步到函数库中了解函数功能，一级级往底层函数扒。
4、esp8266 IDE开发环境现在最新的版本是2.4.2,建议使用最新，修复了不少bug,如果你用ajax访问webserver库建的web服务，注意，新版本中默认不支持跨ajax跨域访问（2.3版本是支持的），需要自行设置http头
5、关于硬件，用的是esp8266 mini d1开发板，这个开发板体积小，有一个配套的断电器模块，可以听继电器的声音，哈哈。

界面图 IPAD访问

本系统承载的硬件平台 esp8266 mini d1 开发板

微信配网过程

这个是微信airkiss 配网的二维码
http://u55.in 这个短域名申请了很久，专门放上微信配网的二维码，有兴趣的朋友可以收藏，超短顶级域名配网二维码