三周学会小程序第三讲：服务端搭建和部署

经过第二讲咱们已经知道了怎么快速搭建一个小程序客户端，固然服务端也是必不可少的。登陆验证，内容存储等等都离不开服务端。
本章节主要讲解怎么快速搭建一个服务端框架和免费部署。由于好多同窗仅仅为了学习小程序，为此购买一个服务器成本仍是蛮高的，因此小编特此找了一种免费的服务资源提供给你们，等到你真正要部署小程序的时候再购买也不迟。(第一讲《小程序注册和注意事项》里面已经说了，部署小程序必须须要购买服务器和域名，而且须要备案)。

代码准备

和上一讲《客户端代码准备和基础功能讲解》同样，咱们先克隆小编为你们准备的源码库，而后对源码进行讲解。源码库地址：
https://github.com/codedrinke...
本讲的 Tag 为 V3。

工具准备

JDK 1.8 或更高版本
IDEA，若是有条件尽可能用付费版本，一些扩展的工具后面可能用到，好比Database。
Maven，这个是比较基础的工具了。

运行项目

下载项目成功之后，打开 IDEA， 使用 Maven方式导入项目，一直下一步便可。导入完成之后等待 Maven 下载依赖，下载依赖完成之后直接找到 Application.java 类右键运营便可启动服务。地址栏访问
http://localhost:8888 便可看到咱们的欢迎页面。是否是使用 Spring Boot 运营项目很是简单？不再用磨磨唧唧配置 Tomcat了。

项目结构

如图，

一个很是标准的 Spring Boot项目目录，不了解 Spring Boot 能够直接去官网看一下初步理解就能够，你能够把 Spring Boot 简单的看作让你方便的经过一个类就能运行项目的方式，具体细节等你熟练使用之后天然会明白。
http://spring.io/projects/spring-boot
Application.java，项目的启动类，直接右键运行便可，固然可使用java命令启动，如
java -jar -Dspring.profiles.active=production target/jiuask-server-1.0.0.jar

resources/public，是web项目的静态资源，好比 js，css，img等都存放到这里，Spring 默认会把 public 配置为根目录，全部使用的时候直接 logo.jpg 便可。

templates，是存放Spring的web模板，类比的话就是咱们熟知的 jsp 页面，这里用的thymeleaf模板语言，更强大，如今你理解它就是 HTML里面有不少占位符，能够赋值便可。

application-*.yml，这个是替代了咱们以前使用的application.properties，由于 yml 的语法更强大，同时application.yml 是默认配置，因此你直接运行 Application.java 文件会启动 8888 端口就是由于里面配置的是 port: ${port:8888}。

applicationContext.xml，便使咱们熟知的 Spring 的配置文件，后面有什么须要来这里配置就行了。咦？没有 web.xml 文件 Spring 是怎么知道这个文件的呢？那由于我在 Application.java 文件中添加了一个注解:@ImportResource({"classpath*:applicationContext.xml"})

pom.xml，就不用细说了，若是你不了解 Maven 那么你须要百度几个文章了解下。
还剩下几个文件，不要着急，咱们后面会讲到。

代码讲解

为了让初步接触 Spring Boot 的同窗更好的理解项目，小编这里简单的对项目的代码进行讲解。
首先从 Application.java 开始:
@SpringBootApplication 表示这个类是 Spring 项目的启动类。
@Controller 表示把当前类定义为一个 Controller。
@ComponentScan 表示 Spring 加载 Bean 的方式是扫描目录，不须要每次都经过 xml 配置。
@RequestMapping("/") 则是定义访问路径和方法的映射。
return "index"; 表示返回 templates/index.html 这个模板。

好，既然说到了模板，咱们就简单说一下模板里面的逻辑。如图:

我作了一个简单的封装，为了不写重复的代码，我把头部和底部封装到了 layout.html 在 index.html 和 error.html 直接引用这个布局，替换它的 body。因此你这个时候在 8888/后面随便输入内容访问的即是 error 页面，头部和底部都是源自于 layout.html。

这样一来你就掌握了项目和本地部署的技能，那么微信小程序须要访问远端的地址才能工做，怎么部署到远端呢？

免费部署

小编讲解的免费部署的方式是使用 Heroku，免费一定有限制，好比15分钟不访问会自动宕机，下次访问会自动启动，每一个帐号有550个小时的无偿使用时长，不过虽然有这些限制，对于咱们作测试使用已经足够了，并且它还会提供一个 **.herokuapp.com 的域名，正好给咱们使用。

话很少说，咱们开始准备环境，首先你须要去 Heroku 官网注册一个帐号，国外的网站访问有点慢，自行解决。
https://id.heroku.com/login
不过有一个很是很差的消息，Heroku 不支持 126 邮箱，不过你不须要注册多个，因此小编使用的本身的 QQ 邮箱。所有填写完信息之后，点击 Create Free Account。而后去邮箱验证，设置密码便可。

下面咱们须要建立一个 app，能够简单理解为建立一个 服务器，能够用于部署咱们的代码。

按照如图步骤填写名称，找到一个不被占用的英文，而后点击 create。我填写的是 jiuask， 这样我就会获得一个免费的域名 jiuask.herokuapp.com。这样咱们就拥有一个免费的服务器了，是否是很简单?那接下来咱们部署服务吧?

其实自动跳转的页面有提示，若是你英文好，直接按照提示来也能够，大体的步骤以下:
1，打开你的终端，进入刚才准备好的项目目录。
2，运行 heroku login 命令，会提示你输入用户名和密码，刚才你注册的邮箱和密码。
3，输入以下命令，固然后面的 jiuask 应该是你的名称:
heroku git:remote -a jiuask
这个步骤就是在添加一个 Heroku 的 Git 仓库，当你提交代码到 Heroku 的 Git 残酷的时候会自动部署。
4，运行以下命名部署：
git push heroku master
5，等待命令行命令结束，浏览器输入以下网址看下效果，记住把 jiuask 换成你本身的名字：
jiuask.herokuapp.com
是否是出现了神奇的一幕？这样你就拥有一个本身免费的服务器了，之后怎么部署呢？每次 commit 代码之后，运行 4 步骤的部署就能够更新成功了。

别着急激动，咱们仍是简单说一下为何能部署成功：
1，小编的pom.xml里面配置项目名称是jiuask-server因此编译打包之后会有一个jiuask-server-1.0.0.jar 的 jar 包。
2，Heroku 会默认识别 Procfile 文件里面的命令做为部署命令：
web: java -jar -Dspring.profiles.active=production target/jiuask-server-1.0.0.jar

因此每当我运行部署的时候，Heroku 帮咱们执行了一下 Procfile 文件，因此若是你的没有部署成功，仔细检查一下本身的配置是否正确。这样今天的讲解就进入了尾声，是否是小程序的服务器不用愁了？若是以为有用记得给小编点小骨头哦。[:)阴险脸]

做业

好，下面是做业时间，看懂了，立刻就本身动起手来。
1，不知道你是否注意观察，经过浏览器打开的时候 Tab 上面有一个 “久问” 的 logo，你如今须要把他换成你的 logo。
2，修改 Controller 里面的 index 方式，使得访问
http://localhost:8888/?user=jiuask
跳转 index 页面。user等于其余状况均跳转 error 页面并显示登 **用户登陆失败。
3，新添加一个地址
http://localhost:8888/api/login
访问是，返回 JSON 内容，{'success':true}。
4，修改项目名称，包括pom.xml，package，Procfile 和 Readme。
5，使用 Heroku 建立本身的帐号，并部署成功。
若是你作好了，能够发到群里向小伙伴儿炫耀一下哦。[:)鬼脸]

6，使用 Heroku 命令查看一下最新的日志。小编提示：heroku help 命令是一个百科全书哦。

问答

若是您对本系列文章有兴趣，欢迎置顶本订阅号，第一时间获取更新。
若是有任何问题，欢迎加入下方交流群。请添加小编微信，切记备注“小程序”，小编拉你进去。【只讨论技术，非诚勿扰】

关注

小编运营的订阅号 “码匠笔记”，就前后就任于 ThoughtWorks、阿里巴巴等互联网公司的经验分享，包含但不限于 JAVA、并发编程、性能优化、架构设计、小程序、开源软件等。有兴趣能够关注一波，一块儿学习、讨论。