微信小程序实战 (微信小程序后端Java接口开发demo)

简介: 微信小程序实战 (微信小程序后端Java接口开发demo)

前面的几篇简单介绍了一部分小程序框架基础,然后我们开始实战开发一哈(有些许前端基础的我看不下去了),还是等遇到问题在查一下官网的开发手册吧.

微信小程序后端Java接口开发

1.小程序后端开发

新建一个spring boot程序 pom.xml

<parent>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-parent</artifactId>
    <version>2.2.6.RELEASE</version>
    <relativePath/> <!-- lookup parent from repository -->
</parent>
<dependencies>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-web</artifactId>
        <scope>provided</scope>
    </dependency>
</dependencies>
复制代码

新建TestController

import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
/**
 * @Author : lizzu
 * @create 2022/10/8 22:34
 */
@RestController
@RequestMapping("v1/weChat/")
public class TestController {
    @GetMapping("/getInfo")
    public String getInfo(String userName){
        return "hello: "+userName;
    }
}
复制代码

测试:

网络异常,图片无法展示
|

2.新建helloWord小程序项目

创建helloWord页面

"pages":[
    "pages/helloWord/helloWord",
    "pages/index/index",
    "pages/logs/logs"
  ],
复制代码

修改helloWord.js 增加接口调用方法 getData(that)

/**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    var that =this;
    this.getData(that);
  },
  /**
   * 接口调用
   */
  getData(that){
    wx.request({
      url: 'http://localhost:8080/v1/weChat/getInfo',      
      method:"GET",
      data:{
        userName: '李先生'
      },
      header:{
        'content-type': 'application/json'//json格式
      },
      success(res){//成功回调
        console.log(res.data);
        console.log(that);
        that.setData({
          result:res.data
        })
      }
    })
  },
复制代码

页面增加

<!--pages/helloWord/helloWord.wxml-->
<text>pages/helloWord/helloWord.wxml</text>
<view>收到后台响应数据:{{result}}</view>
复制代码

测试:报错“不在以下 request 合法域名列表中”

网络异常,图片无法展示
|

解决方案1 点击【详情】-勾选【不校验合法域名、web-view(业务域名)、TLS版本以及HTTPS证书】

网络异常,图片无法展示
|

解决方案2 打开参考文档可以看到

每个微信小程序需要事先设置通讯域名,小程序**只可以跟指定的域名进行网络通信**。
复制代码

按照提示配置通讯域名

网络异常,图片无法展示
|
刷新测试

网络异常,图片无法展示
|

设置本地域名内网穿透可参考 SpringCloud Alibaba 开发微信公众号(新建微信公众号,内网穿透工具的使用)

网络异常,图片无法展示
|

测试效果:

网络异常,图片无法展示
|

至此微信小程序后端java接口开发demo整完

下一篇 微信小程序实现图书查询功能


相关文章
|
7月前
|
缓存 小程序 前端开发
商城/点餐/家政类小程序源码合集_微信抖音小程序源码开发从入门到精通实战
本文系统讲解如何利用现有源码快速开发商城、点餐、家政类微信/抖音小程序,涵盖环境搭建、核心功能实现、多平台部署与优化,提供完整技术方案。实战导向,助力开发者高效入门与落地。
|
7月前
|
小程序 PHP 图形学
热门小游戏源码(Python+PHP)下载-微信小程序游戏源码Unity发实战指南​
本文详解如何结合Python、PHP与Unity开发并部署小游戏至微信小程序。涵盖技术选型、Pygame实战、PHP后端对接、Unity转换适配及性能优化,提供从原型到发布的完整指南,助力开发者快速上手并发布游戏。
|
11月前
|
JSON 监控 小程序
微信百度字节小程序包过大解决方案(实战经验总结)-优雅草卓伊凡|果果|小无
微信百度字节小程序包过大解决方案(实战经验总结)-优雅草卓伊凡|果果|小无
1326 14
微信百度字节小程序包过大解决方案(实战经验总结)-优雅草卓伊凡|果果|小无
|
存储 JSON 小程序
微信小程序入门之新建并认识小程序结构
微信小程序入门之新建并认识小程序结构
290 1
|
存储 小程序 前端开发
微信小程序与Java后端实现微信授权登录功能
微信小程序极大地简化了登录注册流程。对于用户而言,仅仅需要点击授权按钮,便能够完成登录操作,无需经历繁琐的注册步骤以及输入账号密码等一系列复杂操作,这种便捷的登录方式极大地提升了用户的使用体验
3762 12
|
小程序 测试技术 数据安全/隐私保护
微信公众号接口测试实战指南
微信公众号接口测试是确保系统稳定性和功能完整性的重要环节。本文详细介绍了测试全流程,包括准备、工具选择(如Postman、JMeter)、用例设计与执行,以及常见问题的解决方法。通过全面测试,可以提前发现潜在问题,优化用户体验,确保公众号上线后稳定运行。内容涵盖基础接口、高级接口、微信支付和数据统计接口的测试,强调了功能验证、性能优化、安全保护及用户体验的重要性。未来,随着微信生态的发展,接口测试将面临更多挑战和机遇,如小程序融合、AI应用和国际化拓展。
|
小程序 前端开发 算法
|
小程序 JavaScript API
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机
这篇文章介绍了如何在uni-app和微信小程序中实现将图片保存到用户手机相册的功能。
3931 0
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机
|
JavaScript 小程序 开发者
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
3216 0
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
3973 7
下一篇
开通oss服务