前言

微信小程序的出现的时候，接触过也开发了一下简易版的Demo，但是由于种种的原因没有进行下去，这次趁着疫情有大把的时间，
对微信小程序进行深入了解一下，查询了很多的资料以及结合自身的需求，经过筛选最终选择练手的项目为类似“豆瓣电影”电影咨询获取，
从小程序的开发到上线部署整个过程进行一个记录，避免文章过于冗长内容讲解的不会特别的详细，，文章中关于更加详细的内容都会有相关文档的链接，如有不对的地方还望指正。

服务器的搭建

1.购买云服务

我的云服务器购买的是阿里云轻量应用服务器具体配置如下:
CPU：1 核
内存：2GB
公网带宽：1 Mbps
操作系统：CentOS 7.3 64位
系统盘:40GB SSD云盘

2.服务的配置

我选择的服务器系统选择为CentOS 7.3,为了方便操作，我选择宝塔Linux面板进行操作
具体的安装命令如下:
Linux面板6.0安装命令(暂时仅兼容Centos7.x，其它系统版本请安装5.9稳定版)

1	yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && bash install.sh

Linux面板6.0升级专业版:

1	curl http://download.bt.cn/install/update6.sh\|bash

安装完成后进行登录到宝塔面板进行配置,具体的操作请访问宝塔面板官网进行查看，这里就不进行赘述。

3.购买域名

域名的作用收到映射IP地址的，可以代替IP地址来访问域名锁绑定的服务器，服务器的访问本身是可以使用IP地址+端口进行访问的，但是微信小程序是不允许使用IP加端口形式的url，而且域名相比较IP而已好记了许多。
我使用的域名是在万网上买的购买的。

4.阿里云域名解析

域名购买好了之后怎么跟服务器进行绑定并使用的呢？
具体的操作可以点击此链接进行配置云解析 DNS > 快速入门 > 新手引导,不进行赘述。

5.阿里云域名的备案

国内申请的域名统统需要进行备案，详细的备案过程就不在赘述了，此处我选择的是阿里云备案备案
域名备案的时间是毕竟长的，短则十几天，长则二十几天，需要耐心的等待。

6.阿里云SSL证书

SSL证书:SSL证书就是遵守 SSL协议，由受信任的数字证书颁发机构CA，在验证服务器身份后颁发，具有服务器身份验证和数据传输加密功能。
在没有配置SSL证书时,url是以http开头，而配置了SSL证书的时候url是以https开头的，而微信小程序中要求的域名访问方式是以https开头的,所以需要配置SSL证书。
关于如何配置阿里云SSL证书可以参考此篇文章如何选择SSL证书、并配置阿里云SSL证书

总结

服务器已经购买并且配置好了以后,下面就实现小程序的具体的实现方法了。

小程序

1.注册小程序的账号

首先在微信公众平台上注册微信小程序的账号,注册完成后下载小程序开发工具:微信开发者工具

2.小程序开发

打开下载后的微信开发者工具,扫码登录后创建小程序项目，界面如图所示，其中AppID为小程序的ID。
小程序的文档

3.小程序开发过程

小程序主要使用的是js语言进行开发，开发的过程中遵循小程序开发文档的规范进行开发，调用的后端接口必须是以https开头的,服务器域名需要在微信公众平台中配置好。
此处推荐一个内网传统的工具uTools,我在开发调试的时候使用的就是这个工具很方便。具体的开发过程这里就不进行赘述了，详细的参考开发文档

4.打包上线

开发完成后，并且进行了测试后没有任何的问题进行部署，在微信开发者工具点击上传，上传的时候需要填写版本号和注释，上传完成后登录到微信公众平台中，在版本管理>开发版本页面可以看到
刚刚上传的小程序了,此版本也可以设置为体验版，可以进行扫码的进行体验，如果需要让更多的人进行体验，可以在成员管理中>体验成员页面进行人员的添加。点击提交审核后等待审核通过的通知
审核通过后就可以微信中搜索到你的小程序进行访问。在提交审核之前需要进行基本信息的完善，在微信公众平台中设置>基本信息，主要填写的信息是小程序的名称以及图标之类的。

总结

至此小程序的前端工作基本完成，微信小程序大量的工作算是在前端页面的了，页面的设计需要扎实的技术。如果涉及到复杂的逻辑以及数据的交互，牵扯到后端的数据的接口。

服务端

后端服务主要是为小程序提供数据接口,使用的是http接口,返回的数据格式为Json格式。
以下是部分Api的Java代码

/**
 * 电影Api
 *
 */
@RestController
@RequestMapping(value = "/Movie")
public class ApiController {

    /**
     * 最近热映
     * @param request
     * @return
     */
    @GetMapping(value = "/in_theaters")
    public Object in_theaters(HttpServletRequest request) {
        String result = HttpUtil.get("https://douban.uieee.com/v2/movie/in_theaters");

        return  ResultJson.json(result);
    }

    /**
     * top250
     * @param request
     * @return
     */
    @GetMapping(value = "/top250")
    public Object top250(HttpServletRequest request) {
        String start = request.getParameter("start");
        String count = request.getParameter("count");
        String result = HttpUtil.get("https://douban.uieee.com/v2/movie/top250?start=" + start + "&count=" + count + "");
        return  ResultJson.json(result);
    }
    
    }

以上贴出了最近热映、top250、两个接口的代码，通过观察得知，这两个接口的数据是都通过公共API获取豆瓣电影信息。具体的问题可以点击Douban API Proxy进行查询。
通过公共API获取豆瓣电影信息并进行数据的处理。

@RestController注解相当于@Controller+@ResponseBody两个注解的结合表示这个类处理http请求，返回格式为Json。
@RequestMapping是一个用来处理请求地址映射的注解，作用于类上，表示类中的所有响应请求的方法都是以该地址作为父路径。
@GetMapping是一个组合注解，是@RequestMapping(method = RequestMethod.GET)的缩写。该注解将http Get 映射到特定的处理方法上，因为在前端页面请求的时候指定了请求数据method的请求模式为GET

服务端代码编写完成后通过浏览器访问”http://localhost:8085/movie/in_theaters"获取到返回的数据

总结

经过本地的测试没有任何的问题和，需要打包上线到自己购买的服务器上，并且可以通过域名进行访问。
关于CentOs7部署JAVA程序可以参考此篇内容,此处不再赘述。

说明

关于小程序搭建的说明，以及相应问题的解决方法

小程序说明

此次搭建的小程序是基于wechat-weapp-movie开源项目,此Demo仅仅用来学习,并进行了部分的修改和增加,包括后端程序的编写,非常感谢sesine开源此项目
修改内容:由于微信小程序修改了获取用户信息的方式,所以对此进行了相应的修改，由于官方问题导致搜索接口无法使用，所以取消了搜索功能。
增加内容:增加每部影片的影评以及打分的星星。

服务端程序说明

后端程序使用的是开源的豆瓣ApiDouban API Proxy,自己经过数据的处理；

总结

由于从小程序的开发到部署上线，中间也遇到很多的问题,收获也很多同时也发现了自己的问题所在，印象最深的是需要多多看微信小程序的Api，如有不足之处还望指正。
关于微信小程序问题及解决方法可以查看此文章小程序问题