一、前言当初微信小程序越来越火了，置信不少人都通过各种路径学习过微信小程序或者尝试开发，作者就是已经因为趣味理解开发过微信小程序，所以当初用这篇博客记录我之前开发的一些教训和一些心得吧。二、次要内容 springboot 后端架构构建小程序我的项目构建小程序 api 调用后盾 resetful 接口编写小程序调用后盾接口收费的 https 申请 linux 下部署上线三、微信小程序我的项目构建这些根底的货色我就不过多介绍，大家在刚开始开发的时候个别都没有本人的服务器及域名，所以大家在本地编写的时候，在“具体”下的“我的项目设置”外面将“不校验域名安全性”勾选。
至于微信小程序的组件，即前端页面的开发心愿大家耐住寂寞认真在微信开发平台上。组件: https://developers.weixin.qq.com/miniprogram/dev/component/api：https://developers.weixin.qq.com/miniprogram/dev/api/ 四、后打量解我在后端编写次要是用 java，当然对其余开发语言相熟的也能够应用其余语言开发后端。当初我就 java 编写后端 api 的解说。次要框架 springboot，开发工具 myeclipse，服务器阿里云服务器。创立一个 maven 我的项目，导入相干依赖：pom.xml 依赖 <!– 对立版本控制 –> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>1.5.9.RELEASE</version> </parent> <dependencies> <!– freemarker 渲染页面 –> <!– https://mvnrepository.com/artifact/org.springframework.boot/s… –> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> </dependency> <!– spring boot 外围 –> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <!– springboot 整合 jsp –> <!– tomcat 的反对. –> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> <exclusions> <exclusion> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-tomcat</artifactId> </exclusion> </exclusions> </dependency> <dependency> <groupId>org.apache.tomcat.embed</groupId> <artifactId>tomcat-embed-jasper</artifactId> </dependency> </dependencies> 在配置文件 src/main/resources/ 下创立 application.properties 文件能够批改一些配置参数等。#jsp 反对 spring.mvc.view.suffix=.jspspring.mvc.view.prefix=/WEB-INF/jsp/#this is set port#server.port=80server.port=443# 增加 ssl 证书 #ssl 证书文件名 server.ssl.key-store=classpath:xxxxxxx.pfxserver.ssl.key-store-password=xxxxxxxxserver.ssl.keyStoreType=xxxxxxxx 在理论我的项目中可能波及数据库，还要整合 mybatis，在文章中，我仅仅做测试就不做应用数据库的测试。首先创立 springboot 的入口程序:app.class 上面贴上代码：@ComponentScan(basePackages= “com.bin”)// 增加扫包 @ComponentScan(basePackages= “”)@EnableAutoConfigurationpublic class App{// 启动 springboot public static void main(String[] args) {SpringApplication.run(App.class, args); }} 启动我的项目时间接右击 run 即可。在写一个测试的 controller 进行微信小程序与 java 后端实现通信，controller 代码如下：@RestController@SpringBootApplicationpublic class ControllerText {@RequestMapping(“getUser”) public Map<String, Object> getUser(){ System.out.println(“ 微信小程序正在调用。。。”); Map<String, Object> map = new HashMap<String, Object>(); List<String> list = new ArrayList<String>(); list.add(“zhangsan”); list.add(“lisi”); list.add(“wanger”); list.add(“mazi”); map.put(“list”,list); System.out.println(“ 微信小程序调用实现。。。”); return map; } @RequestMapping(“getWord”) public Map<String, Object> getText(String word){Map<String, Object> map = new HashMap<String, Object>(); String message = “ 我能力无限，不要尴尬我 ”; if (“ 起初 ”.equals(word)) {message=” 正在热映的起初的咱们是刘若英的处女作。”;}else if(“ 微信小程序 ”.equals(word)){message= “ 想获取更多微信小程序相干常识，请更多的浏览微信官网文档，还有其余更多微信开发相干的内容，学无止境。”;}else if(“ 西安工业大学 ”.equals(word)){message=” 西安工业大学（Xi’an Technological University）简称”西安工大“，位于世界历史名城古都西安，是中国西北地区唯一一所以兵工为特色，以工为主，理、文、经、管、法协调倒退的教学研究型大学。原中华人民共和国兵器工业部直属的七所本科院校之一（“兵工七子”），陕西省重点建设的高水平教学研究型大学、陕西省人民政府与中国兵器工业集团、国防科技工业局共建高校、教育部“卓越工程师教育培养打算”试点高校、陕西省大学生创新能力造就综合改革试点学校。国家二级窃密资格单位，是一所以 \” 军民结合，寓军于民 \” 的国防科研高校。”;} map.put(“message”, message); return map; } @RequestMapping(“”) public String getText(){ return “hello world”;}} 至此繁难的后端框架及测试根本实现。阐明：@RestController 与 @Controller 注解的区别 @RestController 相当于两个注解，它能实现将后端失去的数据在前端页面（网页）中以 json 串的模式传递。而微信小程序与后盾之间的数据传递就是以 json 报文的模式传递。所以这就是抉择 springboot 框架开发小程序后端的次要起因之一。能够方面咱们进行小程序的后端开发。五、小程序发动网络申请在实现了小程序的后端开发，上面进行小程序端发动网络申请。上面以一个简略的按钮申请数据为例：wxml 文件 <button bindtap=’houduanButton1′> 点击发动申请 </button><view wx:for=”{{list}}”> 姓名：{{item}} </view>js 文件 /* 页面的初始数据 */ data: {list: ”, word: ”, message:”}, houduanButton1: function () { var that = this; wx.request({ url: ‘http://localhost:443/getUser’, method: ‘GET’, header: { ‘content-type’: ‘application/json’ // 默认值}, success: function (res) {console.log(res.data)// 打印到控制台 var list = res.data.list; if (list == null) {var toastText = ‘ 数据获取失败 ’; wx.showToast({ title: toastText, icon: ”, duration: 2000}); } else {that.setData({ list: list}) } } }) } 次要调用的 api 就是 wx.request，想晓得将具体的介绍大家能够去微信公众平台（https://developers.weixin.qq.com/miniprogram/dev/api/）。接下来以搜寻类型的申请为例：wxml 文件：<input type=”text” class=”houduanTab_input” placeholder=” 请输出你要查问的内容 ” bindinput=’houduanTab_input’></input> <button bindtap=’houduanButton2′> 查问 </button> <view wx:if=”{{message!=”}}”> {{message}} </view>js 文件：变量的定义见上一个 js 文件 // 获取输入框的内容 houduanTab_input: function (e) {this.setData({ word: e.detail.value}) }, // houduanButton2 的网络申请 houduanButton2: function () { var that = this; wx.request({ url: ‘http://localhost:443/getWord’, data:{ word: that.data.word}, method: ‘GET’, header: {‘content-type’: ‘application/json’ // 默认值}, success: function (res) {console.log(res.data)// 打印到控制台 var message = res.data.message; if (message == null) {var toastText = ‘ 数据获取失败 ’; wx.showToast({ title: toastText, icon: ”, duration: 2000}); } else {that.setData({ message: message}) } } }) } 至此曾经实现了繁难的微信小程序端与 java 后端进行通信。当初能够在启动后端我的项目在微信开发工具上进行测试。演示成果：
所以至此曾经实现了小程序的前后端通信。六、ps 申请其实也不算什么申请，在购买域名之后能够申请收费的 ssl 证书，在后面的配置文件 application.properties 中有证书的配置，将证书的 pfx 文件间接增加到后端我的项目下即可。七、购买服务器部署后端 api 代码对于 springboot 我的项目，自己倡议打 jar，间接在服务器上部署即可，在服务器上只须要装置对应版本的 jdk 即可。我的项目部署命令：我购买的是阿里云的轻量级应用服务器部署的。比拟划算吧。运行命令：nohup java -jar helloworld.jar &nohup 的意思不挂服务，常驻的意思，除非云服务器重启，那就没法了；最初一个 & 示意执行命令后要生成日志文件 nohup.out，当然还能够应用 java -jar helloworld.jar。八、源码百度云链接: https://pan.baidu.com/s/1PfByFfEgqkVALcc3PRhn9w 提取码: c7yfPS：如果感觉我的分享不错，欢送大家顺手点赞、在看。END