Spring+Spring MVC+微信小程序（IDEA）

最新推荐文章于 2024-10-08 15:03:47 发布

原创最新推荐文章于 2024-10-08 15:03:47 发布 · 1.5w 阅读

101 ·

CC 4.0 BY-SA版权

文章标签：

#Spring+Spring MVC+微信小程序

提高专栏收录该内容

15 篇文章

订阅专栏

本文详细介绍了微信小程序如何与后端进行数据交互，包括依赖导入、SpringMVC配置、前后端数据传输等关键步骤，解决了数据传输过程中的常见问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

看前须知：
本项目是微信小程序占座系统，功能还没有写完，但是其他问题都解决的七七八八了。微信小程序端的与连接和传输数据及数据使用无关的js代码，wxml代码就省略不写了，只写最核心的代码，并且项目是基于注解和xml配置的，没有直接使用servlet类，都是封装好的，使用起来更加方便。

首先，进行导入依赖，导入依赖的时候不要忘记打开网络，否则jar包无法下载

   <!--spring mvc需要导入的依赖-->
  <dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-context</artifactId>
    <version>${spring.version}</version>
  </dependency>

  <dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-web</artifactId>
    <version>${spring.version}</version>
  </dependency>

  <dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-webmvc</artifactId>
    <version>${spring.version}</version>
  </dependency>

  <dependency>
    <groupId>javax.servlet</groupId>
    <artifactId>servlet-api</artifactId>
    <version>2.5</version>
    <scope>provided</scope>
  </dependency>

  <dependency>
    <groupId>javax.servlet</groupId>
    <artifactId>jsp-api</artifactId>
    <version>2.0</version>
    <scope>provided</scope>
  </dependency>


    <!--spring 需要导入依赖-->
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-jdbc</artifactId>
      <version>5.0.2.RELEASE</version>
    </dependency>

    <dependency>
      <groupId>c3p0</groupId>
      <artifactId>c3p0</artifactId>
      <version>0.9.1.2</version>
    </dependency>

    <dependency>
      <groupId>net.sf.json-lib</groupId>
      <artifactId>json-lib</artifactId>
      <version>2.4</version>
      <classifier>jdk15</classifier>
    </dependency>

    <dependency>
      <groupId>commons-beanutils</groupId>
      <artifactId>commons-beanutils</artifactId>
      <version>1.7.0</version>
    </dependency>

    <dependency>
      <groupId>commons-collections</groupId>
      <artifactId>commons-collections</artifactId>
      <version>3.1</version>
    </dependency>

    <dependency>
      <groupId>commons-lang</groupId>
      <artifactId>commons-lang</artifactId>
      <version>2.5</version>
    </dependency>

    <dependency>
      <groupId>net.sf.ezmorph</groupId>
      <artifactId>ezmorph</artifactId>
      <version>1.0.3</version>
    </dependency>

    <dependency>
      <groupId>commons-logging</groupId>
      <artifactId>commons-logging</artifactId>
        <version>1.2</version>
    </dependency>

    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-test</artifactId>
      <version>5.1.6.RELEASE</version>
    </dependency>

    <dependency>
      <groupId>junit</groupId>
      <artifactId>junit</artifactId>
      <version>4.12</version>
    </dependency>

    <dependency>
      <groupId>mysql</groupId>
      <artifactId>mysql-connector-java</artifactId>
      <version>5.1.2</version>
    </dependency>

当导入完成之后，也就是IDEA下方提示加载完成之后，一定要去（如图所示）中看一看是否导入完成，我因为在添加依赖的时候只看了下面的加载提示，没有看是否导入进去了，结果没有导入进去，换了其他的依赖也导不进去，不知道是项目除了什么问题，建了一个新的项目才导入进去，浪费了好多时间，
在这里插入图片描述

接下来，进行springmvc.xml的配置

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"
       xsi:schemaLocation="
        http://www.springframework.org/schema/beans
        http://www.springframework.org/schema/beans/spring-beans.xsd
        http://www.springframework.org/schema/mvc
        http://www.springframework.org/schema/mvc/spring-mvc.xsd
        http://www.springframework.org/schema/context
        http://www.springframework.org/schema/context/spring-context.xsd">

    <!--开启注解扫描，在springmvc容器中只需要扫描Controller即可-->
    <context:component-scan base-package="demo.Controller"></context:component-scan>

<!--
    &lt;!&ndash;配置jsp视图解析器对象，用以跳转到指定对象&ndash;&gt;
    <bean id="internalResourceViewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix" value="/WEB-INF/pages/"></property>&lt;!&ndash;指定路径&ndash;&gt;
        <property name="suffix" value=".jsp"></property>&lt;!&ndash;指定后缀名&ndash;&gt;
    </bean>
-->
    

    <!--开启Spring MVC框架注解的支持（解析器，处理器，映射器）-->
    <mvc:annotation-driven />
    <mvc:default-servlet-handler/>
</beans>

易错点：此处需注意，如果开启Spring MVC框架的支持的时候写成如下样式，则会报500错误，并且控制台会显示很多错误，让人心里很慌

<mvc:annotation-driven conversion-service="conversionService"/><!--只有将conversion-service="conversionService"/属性去掉才不会报错-->

提示错误为：

Caused by: org.springframework.beans.factory.NoSuchBeanDefinitionException: No bean named 'conversionService' available

在这里插入图片描述
补充：

    <mvc:default-servlet-handler/><!--这个配置可以不要-->

关于这个配置的理解
在我的另一篇博客里

配置bean.xml（配置Spring）

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
        http://www.springframework.org/schema/beans/spring-beans.xsd
        http://www.springframework.org/schema/context
        http://www.springframework.org/schema/context/spring-context.xsd">

    <!--告知spring在创建容器时要扫描的包，注解配置-->
    <context:component-scan base-package="demo.Dao"/>
    <context:component-scan base-package="demo.Service"/>
    <context:component-scan base-package="demo.pojo"/>
    <!--配置jdbcTemplate-->
    <bean id="jdbcTemplate" class="org.springframework.jdbc.core.JdbcTemplate">
        <property name="dataSource" ref="dataSource"></property>
    </bean>

    <!--配置数据源-->
    <bean id="dataSource" class="com.mchange.v2.c3p0.ComboPooledDataSource">
        <!--注入连接数据库的必备信息-->
        <property name="driverClass" value="com.mysql.jdbc.Driver"></property>
        <property name="jdbcUrl" value="jdbc:mysql://localhost:3306/seat"></property>
        <property name="user" value="root"></property>
        <property name="password" value="047139"></property>
    </bean>
</beans>

此处没有什么大问题，只要依赖添加正确就可以使用

下面进入正题：微信小程序和后台连接并进行数据传输

Dao层和Server层我就不写了，源代码在我的github仓库里，如果需要可以去clone

https://github.com/SHUANGYANPI/WxSeatDemo.git

微信小程序发送请求

wx.request({
    url: 'http://localhost:8080/studentController/Login',              //自己请求的服务器的地址
    
      data:{                                               		//发送请求时传给后台的数据，用后台处理数据是从wxml页面中获取的
        "uno":that.data.uno,
        "password":that.data.password
        },
        
      method: 'POST',											       //以post形式发送请求
      header: {
        'content-type': 'application/json;charset=UTF-8', // 默认值，用json格式传数据
        'dataType':'json'
      },
      
      success: function (req) {   //请求成功自动执行
        var getdata = req.data;    //获取后台传过来的数据，赋值给一个变量
        that.setData({
         f: getdata            //用f得到getdata的数据，如果要使用f，必须要在data中声明，否则会报错：f未定义，声明如下
        })
       
        if (that.data.f.flag){
          wx.switchTab({
            url: '../person/person'                //跳转页面
          });
        }else{
          wx.showModal({
            title: '提示：',
            content: '学号或密码输入错误！',
          })
        }
      }
    })

//声明需要用到的变量
  data: {
    userNo:'',
    userPwd:'',
    f:''
  },

wxml使用后端返回信息

<view class="ifm" hover-class='hv'>
我是获取的数据：{{f.flag}}
    </view>

后台响应数据，并返回数据给前端

   /**
     * 用户登录
     * @param userno
     * @return
     */
    @RequestMapping(value = "/Login",produces="text/html;charset=UTF-8")//登录
    public @ResponseBody String Login(@RequestBody String userno){
    
        JSONObject jsonObject = JSONObject.fromObject(userno);
        String uno = jsonObject.getString("uno");
        String password = jsonObject.getString("password");  //解析前端传来的json数据并获取值的的基本语句，得到后就可以直接使用了
        
        System.out.println(uno);
        if (jsonObject==null||uno.equals("")||password.equals("")){
            return "{\"flag\":\"false\"}";
        }
        Map<String,Object> map = userService.FindUserByNo(uno);
        if (map.get("password").equals(password)){
            return "{\"flag\":\"true\"}";
        }
        else {
            return "{\"flag\":\"false\"}";
        }
    }

易错点：注解@RequestMapping中必须要加上produces="text/html;charset=UTF-8属性，否则前端获取的汉字会乱码！！！！！！！！

JSONObject类用来解析前端传过来的json数据，只要依赖不添加错，此类都能用，获取数据时，要加@RequestBody注解说明接收类型

返回json类型数据：用"{“flag”:“true”}"这种形式，以键值对的形式传输，返回类型要响应成String类型@ResponseBody String

难点基本就这么多了，还有传数组还没有尝试，尝试完再贴出来