微信小程序控制树莓派（一）

工作需要，尝试通过微信小程序实现对树莓派的控制，经过一番搜索整理与编码，目前可以在本地实现通过微信小程序界面向树莓派服务器端通信。

大致知识点如下：微信小程序开发，小程序端 https 请求与服务器端通信，python3 Django 搭建服务器，将 Django 服务器部署在树莓派。

此外，此次新接触团队，被安排任务之初开始接触思维导图概念，相比之前只考虑具体技术细节，思维导图全方位展开拓展和延伸更能激发自己在技术实现的同时可以更清晰地描述整个项目。

1. 系统演示

目前仅限本地演示：树莓派端运行服务器代码，微信小程序端可输入指令动态显示树莓派回执信息；微信小程序界面可以点选按钮，动态根据服务器端返回信息回显。

当按下小程序端“上”、“下”、“左”、“右”、“停”等按钮时，服务器端会收到相应指令；在小程序端输入框输入文本信息时，服务器端也会同步显示输入信息，并检测到输入“余额”时，返回给小程序一个余额数值。

因为只是最小可行系统的演示，目前只在本地通过 ip 和端口来实现通信。

2. 微信小程序页面

小程序页面功能与布局基本围绕前端代码展开，涉及 JavaScript、HTML、CSS 知识点。具体细节可以在注册完小程序后浏览微信官方的小程序开发文档。

通常刚注册的小程序会带着个人登陆头像显示的页面功能，我在开发中保留了它的显示，页面中简单加了输入框、按钮、以及可以动态展示信息的文本框。

比如动态展示输入信息 inputValue 的文本框、绑定了输入事件 bindKeyInput 的输入框、显示服务器返回信息 board 的文本框：

  <view class="usermotto">
    <view>
      <text class="user-motto">{
   {
   inputValue}}</text>
    </view>
    
    <view class="weui-cells weui-cells_after-title">
      <view class="weui-cells weui-cells_after-title">
        <view class="weui-cell weui-cell_input">
          <input class="weui-input"  maxlength="10" bindinput="bindKeyInput" placeholder="输入同步到view中"/>
        </view>
      </view>
    </view>
    <view>
      <text class="user-motto">{