打造个人版微信小程序——本地开发api接口调用

关键词：

如果觉得这篇文章对您有所启发，欢迎关注我的公众号，我会尽可能积极和大家交流，谢谢。

  从今天开始，开始打造一个个人版的微信小程序，尽早上线，方便大家使用以及技术讨论。这套小程序包括前台、后台、数据库等部分，估计需要花些时间了。
  小程序开发在入门阶段直接参照官方的帮助文档即可，包括基本语法（和Vue.js大同小异）、开发工具（腾讯提供了一个小的开发工具）等，官方文档：微信小程序开发。
  小程序开发自然而然分为前台后台，前台程序的入门参照官方文档，后台程序则需要自己搭建了。主要问题是微信小程序要求内部调用的API接口必须都是https的，并且最好是带域名，因此需要在搭建后台的时候费点功夫，整体后台基本流程如下：

• 1 选用API接口。想让产品能够吸引用户来用，首先得要求其有一些实实在在的功能，这就需要对应业务的API接口了。
• 2 Springboot统一后台。整合用到的api业务接口，同时支撑一些自定义功能（如登录注册等）
• 3 云服务器、域名、SSL证书：后台部署的媒介，同时负责将http接口转换为https接口
• 4 Nginx反向代理：将域名和IP绑定，以https的形式提供给前端程序调用
• 5 微信小程序：前端

1 API市场

1.1 API市场

  有多少程序员在入门的时候都写过天气预报的demo?这就是一个最简单的数据API。目前在市面上有很多API接口可供大家调用，有付费的也有免费的，这里举两个例子：聚合数据、阿里云API市场。这两个市场的优缺点我并没有仔细研究。
  这里以阿里云API市场中的天气预报API接口为例来做：天气预报API接口。

1.2 购买API

  首先，需要先购买该API接口之后才能调用，即使是表明免费的接口也需要进行购买操作，否则无法进行调用。这里有很多便宜且实用的接口，如天气预报、快递查询、驾照查分、身份证识别等等，具体如何组合使用还是取决于我们对产品发展的设想：

  以天气预报查询为例，我们在登录阿里云账号（支付宝可以直接登录）并购买对应API接口之后，在对应的控制台中可以查看到该接口的AppCode、AppKey、AppSecret，这些都是我们对该接口的调用凭证，在调用时是需要放到header中上传的：

1.3 测试API

  在API购买完成之后，我们需要测试一下这个接口的可用性，我这里使用postman来测试一下，对应的调用方式在文档中已经都明确说明过了：天气预报API接口
  调用地址见文档，调用方式为get请求，请求头中写入AppCode做身份认证，添加城市名称作为请求参数，测试如下：

具体身份认证方式见文档：Appcode简单认证

2 搭建Springboot

2.1 IDE

  这里选用IntelliJ IDEA，IntelliJ IDEA是付费最好的java编辑器，eclipse是免费最好的java编辑器。为了方便springboot项目的新建和编写，这里推荐下载两个插件，即GsonFormat和Spring Assistant：

2.2 新建springboot项目

  Spring Assistant能够方便快速的新建一个springboot项目：“file”->“new”->“project”->“Spring Assistant”，按照提示一步步创建SpringBoot项目即可。有一点需要说明的就是，这里默认通过maven来构建项目以及依赖包的管理，IDEA默认是国外的maven仓库地址，第一次构建下载相应的jar包时会相当慢，需要转换到国内镜像来下载，具体如下：maven国内镜像地址；
  在新建Springboot项目时，记得选中web的依赖，后续在使用网络请求的时候会用到这个依赖：

  数据库的依赖这里先不要选，等用到的时候再添加即可，不然程序启动不起来。程序新建完成之后，找到对应的Application入口，右键debug它：

  也可以通过“shift+alt+F9”快捷键来实现debug，控制台输出一下内容，说明程序启动正常：

2.3 集成swagger接口文档

  Swagger是一种Rest API的 简单但强大的表示方式，这里应用知乎上的一篇文章作为介绍：swagger简介。接下来，我们要在新建的springboot项目中将swagger集成进来。
  1、在项目的pom.xml文件中添加swagger相关依赖：

        <!-- Swagger -->
        <dependency>
            <groupId>io.springfox</groupId>
            <artifactId>springfox-swagger2</artifactId>
            <version>2.6.1</version>
        </dependency>

        <dependency>
            <groupId>io.springfox</groupId>
            <artifactId>springfox-swagger-ui</artifactId>
            <version>2.6.1</version>
        </dependency>

每次修改pom文件时，系统在右下角有所提示，点击“import change”即可完成相关依赖包的添加。
  2、在和Application同级的目录中，新建名为“Swagger2”的类：

swagger2文件中的代码如下：

@Configuration
@EnableSwagger2
public class Swagger2 
    private String BASE_PACKAGE = Swagger2.class.getPackage().getName();

    @Bean
    public Docket createRestApi() 
        return new Docket(DocumentationType.SWAGGER_2).apiInfo(apiInfo()).select()
                .apis(RequestHandlerSelectors.basePackage(BASE_PACKAGE)).paths(PathSelectors.any()).build();
    

    private ApiInfo apiInfo() 
        return new ApiInfoBuilder().title("WechatApplet")
                .description("微信小程序后台支持")
                .termsOfServiceUrl("http://www.neuqosft.com")
                .version("0.0.1")
                .build();
    

  “ctrl+F5”重启项目，启动成功之后在浏览器中输入：http://localhost:8080/swagger-ui.html，显示swagger页面，配置完成。

3 调用阿里云api市场中的天气预报接口

  springboot的项目建完之后，需要在其中调用我们之前购买的API接口。

3.1 新建package

  新建api、weather两个包，同时在weather新建dto、service两个包：

• api：放置SpringMVC中的controller，直接接受前台的请求，并返回数据结果
• weather：放置有关天气相关的service层、dto层、entity层代码
• service：负责相关业务调用和逻辑处理
• dto：构造bean，负责将API返回的json串解析成对应的类

3.2 新建dto

  在dto包下新建WeatherInfoDto的java class，dto生成可以使用插件gsonformat。首先，在postman中复制接口返回的所有字符串数据：

在WeatherInfoDto的类内部（大括号包裹的区域），点击右键->“Generate”->“GsonFormat”，然后将接口中返回的json字符串完整的复制到弹出的输入框中：

点击“OK”->“OK”，对应的javabean会根据接口返回的字符串来自动生成：

3.3 新建Service

  Service层主要是负责业务逻辑的处理，同时将处理结果返回给Controller层。这里在Service层中完成接口的网络请求，这里的网络请求选用RestTemplate。在使用RestTemplate之前，需要先在pom文件中添加“spring-boot-starter-web”依赖，这个我们在新建项目的过程中已经完成。在service包下新建名为“WeatherService”的java class文件，具体如下：

@Service
public class WeatherService 

    public WeatherInfoDto queryBasicInfo(String strCityName)
        RestTemplate restTemplate = new RestTemplate();
        HttpHeaders requestHeaders = new HttpHeaders();
        Map<String,String> parmaters = new HashMap<String,String>();

        requestHeaders.set("Authorization","APPCODE ae35098dabb84cd883c047c80672cb2b");
        parmaters.put("city",strCityName);

        HttpEntity requestEntity = new HttpEntity(requestHeaders);
        ResponseEntity<WeatherInfoDto> response = restTemplate.exchange("http://chkj02.market.alicloudapi.com/qgtq?city=city",HttpMethod.GET, requestEntity, WeatherInfoDto.class, parmaters);
        return response.getBody();
    

有如下几个问题需要强调：

• 1 RestTemplate官方文档：1RestTemplate
• 2 需要在header中加入参数“Authorization”，其中的值包含申请到的Appcode；请求参数（parmaters）包含”city”，具体指由controller层传入
• 3 RestTemplate中get请求的URL为“http://chkj02.market.alicloudapi.com/qgtq?city=city”，注意需要将参数拼接到后边，否则无法正常进行传参
• 4 service层，需要加“@Service”注解

3.4 新建Controller

  Service中完成之后，可以开始编写Controller层中的代码了。Controller层主要职责是接受前台的网络请求，调用对应的service层代码，并将service层的处理结果返回给调用者。在api中新建名为“WeatherController”的java class文件，代码如下：

@Api(description = "天气信息查询")
@RestController
@RequestMapping("/weather")
public class WeatherController 

    @Autowired
    private WeatherService weatherService;

    @ApiOperation(value = "天气基本信息查询")
    @ApiImplicitParam(name = "strCityName", value = "城市名称", required = true, paramType = "query")
    @GetMapping("/jbxx")
    public WeatherInfoDto queryBasicInfo(@RequestParam String strCityName) 
        return weatherService.queryBasicInfo(strCityName);
    

这些都是基本的Springboot、swagger注解，这里就不在一一解释。

3.5 运行

  至此，Springboot中API调用代码已经完成，ctrl+F5重启一下程序，输入swagger地址：http://localhost:8080/swagger-ui.html：

点击“try it out”按钮，正常返回信息，程序运行正常：

  OK，这篇博客先到此为止，在下一篇博客中我们重点解释如何将这个简单的springboot程序部署到腾讯云上，并且通过“域名+https”的形式代理出来，供前台接口进行调用，谢谢。

欢迎打赏，谢谢：

springboot微信小程序保存微信登录者的个人信息

1.前言微信小程序开发平台，提供有一类API，可以让开发者获取到微信登录用户的个人数据。这类API统称为开放接口。这一类API较多，且API之间功能有重叠之处，相互之间的区别较微小。有的适用于低版本，有的适用于高版本。... 查看详情

【微信小程序】保存图片到本地相册

...理用户拒绝授权的情况授权完成后执行保存图片，先看看微信的开发文档,需注意我用红框框起来的地方。我说的两种方法一种是保存临时文件路径的图片，另一种是保存的永久文件的路径，看完两种方法怎样使用看个人选择。... 查看详情

微信小程序如何调用后台接口

参考技术A本课程讲解了微信小程序如何调用线上API中心接口，主要使用了wx.request去和API中心交互，API中心提供给了下面的几个接口:接口是用JFinal开发封装@jfinal用key-value形式存取数据。 查看详情

小程序没有对应的api

微信小程序API（ApplicationProgrammingInterface），应用程序编程接口，也是程序员口中常说的接口。其实api并不专属于小程序，任何编程语言或程序形态都有相对应的api。而我们今天谈的小程序api，是微信小程序团队为了方便开发人... 查看详情

微信小程序|小程序系统api调用

🖥️微信小程序专栏：小程序系统API调用🧑‍💼个人简介：一个不甘平庸的平凡人🍬✨个人主页：CoderHing的个人主页🍀格言:☀️路漫漫其修远兮,吾将上下而求索☀️👉你的一键三连是我更... 查看详情

微信小程序api路由

　　路由：由于页面的跳转；　　　　wx.switchTab()　　跳转到tabBar页面，并关闭掉其他所有非tabBar页面；参数：为对象，　　对象的属性：　　　　url：需要跳转的tabBar的页面路径（需在app.json的tabBar字段定义的页面），路径后... 查看详情

微信小程序小游戏怎么开发？

小猪CMS小程序管理系统怎么样？您好，“微信小程序”开发之前必须要完成和注册认证。如果是个人或者小公司想开发微信小程序，也可以找微信认证第三方开发商，比如赢在移动、正品科技等。1、微信小程序注册在微信公众... 查看详情

微信小程序unionid和授权机制

...可以通过UnionID来区分用户的唯一性，因为只要是同一个微信开发平台账号下的移动应用,网站应用,公众号和小程序，用户的UnionID是唯一的。换句话说，同一个用户，对同一个微信开发平台的不同应用，UnionID是唯一的。获取完用... 查看详情

微信小程序同步微信公众号文章（二）

...ess_token获取公众号的access_token的在前文中已经实现。基于微信小程序云函数的方式获取微信公众号access_token-2、遍历调用公众号永久素材列表接口获取数据调用素材列表接口，获取相应的文章信息，这里主要获取公众号的图文信... 查看详情

微信小程序云开发|插件的微信小程序云开发

...据(除非数据被主动传递给另一方)。2●创建插件项目在用微信开发者工具创建插件小程序项目时，要填写或选择项目基本信息(项目名称、项目所在的目录、A 查看详情

微信小程序一般去哪里对接一些商品接口

微信小程序的商品接口可以通过以下几种方式进行对接：1.微信官方提供的小程序电商组件：通过使用微信官方提供的小程序电商组件，可以将小程序连接到微信支付和商家后台，实现商品展示、下单、支付等功能。2.第三方电... 查看详情

微信小程序wx.getlocation()获取经纬度及javascriptsdk调用腾讯地图api获取某一类地址(代码片段)

 简介腾讯位置服务为微信小程序提供了基础的标点能力、线和圆的绘制接口等地图组件和位置展示、地图选点等地图API位置服务能力支持，使得开发者可以自由地实现自己的微信小程序产品。在此基础上，腾讯位置服务微信... 查看详情

微信小程序-网络请求(代码片段)

一、网络请求之前在调用网络请求方法之前，需要在「小程序后台-开发-开发设置-服务器域名」中进行配置不配置默认网络请求时无法通过的，当然也可以关闭校验，但是只在调试的时候生效，开发完成准备上线... 查看详情

微信小程序-网络请求(代码片段)

一、网络请求之前在调用网络请求方法之前，需要在「小程序后台-开发-开发设置-服务器域名」中进行配置不配置默认网络请求时无法通过的，当然也可以关闭校验，但是只在调试的时候生效，开发完成准备上线... 查看详情

微信小程序后端java接口开发(代码片段)

微信小程序后端Java接口开发微信小程序使用wx.request(OBJECT)来调用后端接口。首先我们来一个简单案例——helloworld实现1、搭建一个springboot项目并引入依赖<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-... 查看详情

微信小程序怎么调用微信支付接口

微信小程序是可以接入微信支付的接口的，比如目前还信用卡的小程序就可以通过微信支付来完成信用卡的还款；要使用此功能，用户只需在微信中关联一张银行卡，并完成身份认证，即可将装有app的智能手机变成一个全能钱包... 查看详情

请问：微信小程序可靠吗？

知道的说下1.微信小程序与之前各方开发的app相比，各方所开发出来的app的代码非常的复杂，业务系统很难统一，所以每一家开发出来的app安全性表现不同，有一些开发商推出来的app安全性非常低，下载完成之后还会带来很多的... 查看详情

微信个人api(转)

安卓微信的api，个人微信开发API协议，微信ipadsdk，微信ipad协议，微信web版接口api，微信网页版接口，微信电脑版sdk，微信开发sdk，微信开发API，微信协议，微信接口文档sdk，替代微信ipad协议的api接口，网页个人微信api分享1、... 查看详情