前言

刚刚第一次自己一个人开发完了一个微信小程序，包括前端，后端，服务器运维，经历了很多坎坷，中间也有想过放弃，但是最后终于做完了，感觉很有成就感。在这里分享给大家大概开发的流程，以及踩过的一些坑。因为项目原因，不能贴出代码，请 jym 谅解~

开发步骤

第一步：需求确认

首先是确认需求，功能比较简单，就是满足某大学在校大学生的课表，成绩查询功能，总共是课表，成绩，学霸排行，反馈四个功能。课表，成绩自不用说，学霸排行应该是要做一个学生的成绩 gpa 排名。

第二步：ui设计

这里参考了其他类似的小程序，登录页就在花瓣网找了个登录页样式做的。
图标什么的就在iconfont上建个项目，找图标然后引入就好

第三步：前端开发

技术选型的是 Taro，因为博主是 React 框架的，Taro 也是用 React 语法开发的，还有一些现成的ui库可以用 taroify 和 taro-ui。
开发工具用的是 vscode + 微信开发者工具。

第四步：后端开发

技术选型 node.js，接口的话，有人会问，我都没有那个大学的数据库怎么去显示。我在这里用的是学校官网的接口，看了下学校官网是基于 ASP.NET 开发的，里面的接口除了需要加个token，把referer改为对应的网站地址以外并不难，就从学校官网的接口入手，爬虫，模拟登陆获取到 Cookie，然后塞进接口 header 里就行。
首先是登录页面，需要获取到验证码并返回，验证码解析，返回前端，进行显示。
然后是登录接口，这里使用了 superagent 进行表单提交实现伪登录。其他的接口也是一样，都加上登录过后获得的 Cookie，并且修改 referer 最后获得的就是一个携带相关信息的页面数据，使用正则匹配获得需要的数据，处理过后返回给前端。
学霸排行接口需要一个数据库，记录当前学院所有学生的成绩和相关信息并排名，我用的是 koa 全家桶，其他的就是 mysql 的基本操作 crud。

第五步：部署

前面这些都是在本地操作的，接下来要把前端和后端部署上线，前端就是走小程序的发布流程，后端需要自己买个服务器，我买的是腾讯云的轻量服务器，这个操作也比较简单，可以一键登录。然后就是利用 transmit 把本地的代码传到服务器上去，这里需要关掉防火墙才能连上。

fxp 传文件无法上传可能的问题

可能没有文件权限 sudo chmod 777 /home/user
防火墙配置的ip需要是 0.0.0.0/0 全部放开
试试关闭防火墙 sudo systemctl stop firewalld

因为用到了数据库，就需要在服务器上安装 mysql，这里用的是 docker 拉镜像安装，可以参考这个博客教程，这里不再赘述。这里有个注意点：

防止数据库被黑：

记得把root密码改复杂点
设置数据库访问 ip 白名单
也可以关掉外网访问改用 ssh

因为小程序限制请求必须使用 https 并且有域名，并且 ICP 备案（后面会说），所以需要再装个 nginx 挂载 ssl 证书（需要去腾讯云官网申请一下后面会说），所以还需要装个 nginx，可以参考这两篇安装 nginx 和 nginx挂载证书，但是最后注意docker run那边我们需要映射出容器的 443 端口到外面的 443 端口，所以要改成这样：

docker run -p 9002:80 -p 443:443 --name nginx -v /home/nginx/conf/nginx.conf:/etc/nginx/nginx.conf -v /home/nginx/conf/conf.d:/etc/nginx/conf.d -v /home/nginx/log:/var/log/nginx -v /home/nginx/html:/usr/share/nginx/html -v /home/my_keys:/etc/my_keys  -d nginx:latest

否则就会无法访问 https 网站。最后贴一下我的 nginx 配置。

server {
    listen    443  ssl;
    server_name  域名;
    ssl_certificate /etc/my_keys/xxx_bundle.pem;
    ssl_certificate_key /etc/my_keys/xxx.key;
    ssl_session_timeout  5m;    #缓存有效期
    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;    #加密算法
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;    #安全链接可选的加密协议
    ssl_prefer_server_ciphers on;

   location / {
        proxy_pass  http://ip:端口;
     }
   }

server {
      listen       80; #监听端口
      server_name  你的域名; #请求域名
      rewrite ^(.*)$ https://你的域名/$1 permanent; #将请求转成https
   }
}

服务器命令持久化，可以先 npm install -g forever 装下 forever，然后用 forever start 一下入口文件就好了。
线上开发环境搞完以后，可以先去微信开放平台申请个小程序，提交代码，在还没上线之前，体验版本可以一直用 1.0.0 会自动替换，这个时候手机上已经可以扫码访问了，需要加一下测试人员，如果无法访问接口可以右上角打开开发调试。
接下来需要买个域名，然后解析到服务器外网 ip。
申请 ICP 备案，第一次管局审核可能慢一些，我就用了一星期左右吧。
申请 ssl 证书，并且用 nginx 挂载 ssl。
修改接口地址为线上地址，提交小程序审核，通过以后发布就可以了。

下面是 APP 的预览图片哈。

从0到1开发一个微信小程序

前言

开发步骤

第一步：需求确认

第二步：ui设计

第三步：前端开发

第四步：后端开发

第五步：部署

fxp 传文件无法上传可能的问题

防止数据库被黑：