精华内容
下载资源
问答
  • 微信小程序实现登录

    千次阅读 2019-02-07 18:44:29
    实现微信小程序微信登录的前提,你需要注册一个微信公众平台 小程序 账号 ,然后才可以进行下面的操作!(感觉小程序登录相对于企业微信登录简单一点) 话不多说 上代码: 在微信小程序端发起登录   ---------...

     

     

    实现微信小程序微信登录的前提,你需要注册一个微信公众平台 小程序 账号 ,然后才可以进行下面的操作!(感觉小程序登录相对于企业微信登录简单一点)

    话不多说 上代码:

    在微信小程序端发起登录

     

    -------------------------------------------------微信小程序端--------------------------------------------------------

    <button style=" background-color: green;" open-type='getUserInfo' bindgetuserinfo='doLogin'>微信登录</button>

    现在登录用button的形式授权  open-type='getUserInfo'    bindgetuserinfo='doLogin' 这两个是重要的属性

     doLogin :function(e){
      console.log(e)
      wx.login({
        success: function(res){
            console.log(res)
            //获取登录临时凭证
            var code = res.code;
            //调用后端接口 获取微信的session_key 和 openID
            wx.request({
              url: 'http://localhost:8080/wxLogin?code='+code,
              method:"post",
              success: function (resule){
                console.log(resule);
              }
            })
        }
      })  
      }

    然后到 js 调用微信小程序 login 方法 访问后台接口  

     

     

    ------------------------------------------------java后端代码---------------------------------------------------------

    @PostMapping("/wxLogin")
    	public IMoocJSONResult wxLogin(String code) {
            String url = "https://api.weixin.qq.com/sns/jscode2session";
    		Map<String, String> param = new HashMap<>();
    		param.put("appid", "这里放你的微信小程序id");
    		param.put("secret", "这里放你的微信小程序密匙");
    		param.put("js_code", code);
    		param.put("grant_type", "authorization_code");
    		String wxResult = this.doGet(url, param);
    		System.out.println(wxResult);
            //wxResult  已经拿到openid  和 session_key  下面转为json格式
    		WXSessionModel model = JsonUtils.jsonToPojo(wxResult, WXSessionModel.class);
    		return IMoocJSONResult.ok(model);
    	}
    
    
    
    
        public static String doGet(String url, Map<String, String> param) {
    
    		// 创建Httpclient对象
    		CloseableHttpClient httpclient = HttpClients.createDefault();
    
    		String resultString = "";
    		CloseableHttpResponse response = null;
    		try {
    			// 创建uri
    			URIBuilder builder = new URIBuilder(url);
    			if (param != null) {
    				for (String key : param.keySet()) {
    					builder.addParameter(key, param.get(key));
    				}
    			}
    			URI uri = builder.build();
    
    			// 创建http GET请求
    			HttpGet httpGet = new HttpGet(uri);
    
    			// 执行请求
    			response = httpclient.execute(httpGet);
    			// 判断返回状态是否为200
    			if (response.getStatusLine().getStatusCode() == 200) {
    				resultString = EntityUtils.toString(response.getEntity(), "UTF-8");
    			}
    		} catch (Exception e) {
    			e.printStackTrace();
    		} finally {
    			try {
    				if (response != null) {
    					response.close();
    				}
    				httpclient.close();
    			} catch (IOException e) {
    				e.printStackTrace();
    			}
    		}
    		return resultString;
    	}

    可直接cv,以上就是微信小程序获取登录的一个流程和实现

     


     

     

     

     

    展开全文
  • 主要为大家详细介绍了微信小程序实现登录遮罩效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • 主要为大家详细介绍了微信小程序实现登录注册切换效果,简易版tab切换效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • 微信小程序目前的火热程度相信不用多言,最近利用空余时间用小程序实现了个动态的登录页效果,所以下面这篇文章主要给大家介绍了利用微信小程序实现登录页云层漂浮动画效果的相关资料,需要的朋友可以参考借鉴,下面...
  • 微信小程序实现登录页面

    万次阅读 多人点赞 2019-05-06 08:51:08
    wxml文件: <view class="container"> <view class="login-icon"> <image class="login-img" src="../../img/loginLog.jpg"></image>...view class="login-from"&g...

    wxml文件:

    <view class="container"> 
    
     <view class="login-icon"> 
     <image class="login-img" src="../../img/loginLog.jpg"></image> 
     </view> 
     <view class="login-from"> 
    
     <!--账号-->
     <view class="inputView"> 
      <image class="nameImage" src="../../img/name.png"></image> 
      <label class="loginLab">账号</label> 
      <input class="inputText" placeholder="请输入账号" bindinput="usernameInput" /> 
     </view> 
     <view class="line"></view> 
    
     <!--密码-->
     <view class="inputView"> 
      <image class="keyImage" src="../../img/key.png"></image> 
      <label class="loginLab">密码</label> 
      <input class="inputText" password="true" placeholder="请输入密码" bindinput="passwordInput" /> 
     </view> 
     
     <!--按钮-->
     <view class="loginBtnView"> 
      <button class="loginBtn" type="primary" size="{{primarySize}}" loading="{{loading}}" plain="{{plain}}" disabled="{{disabled}}" bindtap="login">登录</button> 
     </view> 
     </view> 
    </view>

    wxss文件:

    page{ 
     height: 100%; 
    } 
    
    .container { 
     height: 100%; 
     display: flex; 
     flex-direction: column; 
     padding: 0; 
     box-sizing: border-box; 
     /* background-color: rgb(156, 23, 78) */
    } 
    
    /*登录图片*/
    .login-icon{ 
     flex: none; 
    } 
    
    .login-img{ 
     width: 750rpx;
    } 
    
    /*表单内容*/
    .login-from { 
     margin-top: 20px; 
     flex: auto; 
     height:100%; 
    } 
    
    .inputView { 
     /* background-color: #fff;  */
     line-height: 45px; 
     border-radius:20px;
      border:1px solid #999999;
    } 
    
    /*输入框*/
    .nameImage, .keyImage { 
     margin-left: 22px; 
     width: 18px; 
     height: 16px
    } 
    
    .loginLab { 
     margin: 15px 15px 15px 10px; 
     color: #545454; 
     font-size: 14px
    } 
    
    .inputText { 
     flex: block; 
     float: right; 
     text-align: right; 
     margin-right: 22px; 
     margin-top: 11px;
     color: #cccccc; 
     font-size: 14px
    } 
    .line { 
     margin-top: 8px; 
    } 
    
    /* .line { 
     width: 100%; 
     height: 1px; 
     background-color: #cccccc; 
     margin-top: 1px; 
    }  */
    
    /*按钮*/
    .loginBtnView { 
     width: 100%; 
     height: auto; 
     /* background-color:#DCDCDC;  */
     margin-top: 0px; 
     margin-bottom: 0px; 
     padding-bottom: 0px; 
    } 
    
    .loginBtn { 
     width: 90%; 
     margin-top: 40px; 
     border-radius:10px;
    }

    js文件:

    //index.js
    //获取应用实例
    const app = getApp()
    
    Page({
      data: {
        username: '',
        password: ''
      },
      //事件处理函数
      bindViewTap: function() {
        wx.navigateTo({
          url: '../logs/logs'
        })
      },
      onShow: function () {
        // 生命周期函数--监听页面显示
        wx.hideTabBar({})
      },
      onLoad: function () {
       
      },
    
    
      // 获取输入账号 
      usernameInput: function (e) {
        this.setData({
          username: e.detail.value
        })
      },
    
      // 获取输入密码 
      passwordInput: function (e) {
        this.setData({
          password: e.detail.value
        })
      },
    
      // 登录处理
      login: function () {
        var that = this;
        if (this.data.username.length == 0 || this.data.password.length == 0) {
          wx.showToast({
            title: '账号或密码不能为空',
            icon: 'none',
            duration: 2000
          })
        } else {
          wx.request({
            url: app.globalData.globalReqUrl +'/login/login', // 仅为示例,并非真实的接口地址
            method: 'post',
            data: {
              username: that.data.username,
              password: that.data.password
            },
            header: {
              'content-type': 'application/x-www-form-urlencoded' // 默认值
            },
            success(res) {
              if (res.data.code == "OK") {
                var unitName = res.data.data.User.unitName;
                var unitId = res.data.data.User.unitId;
                wx.setStorageSync('unitId', unitId);
                wx.setStorageSync('unitName', unitName);
                wx.switchTab({
                  url: '../overviewData/realTimeData'
                })
              } else {
                wx.showToast({
                  title: res.data.message,
                  icon: 'none',
                  duration: 2000
                })
              }
            }
          })
        }
      }
    })
    
    

     

    效果图:

       这里界面里用到的两个图标

     

     

     

     

     

                                ---------------长按二维码关注程序媛小姐姐公众号有更多彩蛋哦---------------

                                                

    展开全文
  • 上次老师跟大家分享了下基于Docker搭建基础自动化部署的相关知识,今天跟大家分享SpringBoot 整合微信小程序实现登录与增删改查的知识。1SpringBoot 整合微信小程序实现登录与增删改查项目描述:在微信小程序中通过...

    55a72c13ca458d000fde13226c4577cb.png

    1265f563696da3e7caca766099a21576.png       阅读本文约需要8分钟 

    大家好,我是你们的导师,我每天都会在这里给大家分享一些干货内容(当然了,周末也要允许老师休息一下哈)。上次老师跟大家分享了下基于Docker搭建基础自动化部署的相关知识,今天跟大家分享SpringBoot 整合微信小程序实现登录与增删改查知识。

    1 SpringBoot 整合微信小程序实现登录与增删改查

    项目描述:在微信小程序中通过与Springboot操作数据库实现简单的增删改查,其中我是用springboot整合mybatis-plus 和mysql使用的

    1. 开发前准备

    1.1 前置知识

    • java基础
    • SpringBoot简单基础知识

    1.2 环境参数

    • 开发工具:IDEA
    • 基础环境:Maven+JDK8
    • 主要技术:SpringBoot、lombok、mybatis-plus、mysql 、微信小程序
    • SpringBoot版本:2.2.6

    2.开发者服务器

    项目结构:

    d51100706808e0b0363df1ec8461c733.png

    2.1 初始配置

    (1)pom.xml配置

    <dependencies>        <dependency>            <groupId>org.springframework.bootgroupId>            <artifactId>spring-boot-starter-webartifactId>        dependency>        <dependency>            <groupId>org.mybatis.spring.bootgroupId>            <artifactId>mybatis-spring-boot-starterartifactId>            <version>2.1.1version>        dependency>                <dependency>            <groupId>org.springframework.bootgroupId>            <artifactId>spring-boot-starter-thymeleafartifactId>        dependency>                <dependency>            <groupId>com.alibabagroupId>            <artifactId>druidartifactId>            <version>1.1.14version>        dependency>                <dependency>            <groupId>mysqlgroupId>            <artifactId>mysql-connector-javaartifactId>            <version>5.1.42version>            <scope>runtimescope>        dependency>                <dependency>            <groupId>com.baomidougroupId>            <artifactId>mybatis-plus-boot-starterartifactId>            <version>3.1.0version>        dependency>                <dependency>            <groupId>org.projectlombokgroupId>            <artifactId>lombokartifactId>            <optional>trueoptional>        dependency>                <dependency>            <groupId>com.github.pagehelpergroupId>            <artifactId>pagehelper-spring-boot-starterartifactId>            <version>1.2.5version>        dependency>                <dependency>            <groupId>junitgroupId>            <artifactId>junitartifactId>            <scope>testscope>        dependency>        <dependency>            <groupId>org.springframework.bootgroupId>            <artifactId>spring-boot-starter-testartifactId>            <scope>testscope>            <exclusions>                <exclusion>                    <groupId>org.junit.vintagegroupId>                    <artifactId>junit-vintage-engineartifactId>                exclusion>            exclusions>        dependency>    dependencies>    <build>        <plugins>            <plugin>                <groupId>org.springframework.bootgroupId>                <artifactId>spring-boot-maven-pluginartifactId>            plugin>        plugins>    build>project>

     (2)application.yml

    # Spring Boot 的数据源配置spring:  datasource:    name: wx    url: jdbc:mysql://localhost:3306/wx_mini_program?useUnicode=true&characterEncoding=utf8&zeroDateTimeBehavior=convertToNull&useSSL=true&serverTimezone=GMT%2B8 username: root    password: root    # 使用druid数据源    type: com.alibaba.druid.pool.DruidDataSource    driver-class-name: com.mysql.jdbc.Driver    filters: stat    maxActive: 20 initialSize: 1 maxWait: 60000 minIdle: 1 timeBetweenEvictionRunsMillis: 60000 minEvictableIdleTimeMillis: 300000 validationQuery: select 'x' testWhileIdle: true testOnBorrow: false testOnReturn: false poolPreparedStatements: true maxPoolPreparedStatementPerConnectionSize: 20 maxOpenPreparedStatements: 20 # mybatis-plus相关配置mybatis-plus:  # xml扫描,多个目录用逗号或者分号分隔(告诉 Mapper 所对应的 XML 文件位置)  mapper-locations: classpath:mapper/*.xml  # 以下配置均有默认值,可以不设置  global-config:    db-config:      #主键类型 AUTO:"数据库ID自增" INPUT:"用户输入ID",ID_WORKER:"全局唯一ID (数字类型唯一ID)", UUID:"全局唯一ID UUID";      id-type: auto      #字段策略 IGNORED:"忽略判断"  NOT_NULL:"非 NULL 判断")  NOT_EMPTY:"非空判断"      field-strategy: NOT_EMPTY      #数据库类型      db-type: MYSQL  # 指定实体类的包  type-aliases-package: com.ckf.login_wx.entity  configuration:    # 是否开启自动驼峰命名规则映射:从数据库列名到Java属性驼峰命名的类似映射    map-underscore-to-camel-case: true    # 如果查询结果中包含空值的列,则 MyBatis 在映射的时候,不会映射这个字段    call-setters-on-nulls: true    # 这个配置会将执行的sql打印出来,在开发或测试的时候可以用    log-impl: org.apache.ibatis.logging.stdout.StdOutImpl# PageHelper分页插件pagehelper:  helperDialect: mysql  reasonable: true  supportMethodsArguments: true  params: count=countSql

    2.2 小程序用户表

    CREATE table users( id int not null PRIMARY key auto_increment, name varchar(255) not null, age int not null );insert into users value(null,'陈克锋',18);insert into users value(null,'陈克帅',11);insert into users value(null,'陈克兵',14); select * from users;

    2.3 pojo

    6fd5e4596f3020f0b08852dceb666568.png

    2.4 mapper

    e81948bc1f0a19f49bf5cca1628c1d4a.png

    2.5 service

    70b2dce93d7abbbcb66d981e5633d63a.png

    2.5 serviceImpl

    c31384ac56ebc7085972042cb61ec7c6.png

    配置SpringBoot扫描mapper

    d4be046703a9861ca1bd64396bc3182f.png

    2.6 controller

    LoginController

    package com.ckf.login_wx.controller;import org.springframework.web.bind.annotation.PostMapping;import org.springframework.web.bind.annotation.RestController;import java.util.HashMap;import java.util.Map; /** * @author 安详的苦丁茶 * @date 2020/4/30 11:46 */ @RestController public class LoginController { /**     * 登录     * @param phone     * @param password     * @return */ @PostMapping("/doLogin") public Map doLogin(String phone, String password){        Map map = new HashMap(); if ((phone.equals("10086")&& password.equals("123456"))){            map.put("code",200);            map.put("result","登录成功");            System.out.println("登录成功");        }else {            map.put("result","no");        } return map;    }}

    UserController

    package com.ckf.login_wx.controller;import com.ckf.login_wx.entity.User;import com.ckf.login_wx.servic.UserService;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.web.bind.annotation.*; /** * @author 安详的苦丁茶 * @date 2020/4/30 13:39 */ @RestController@RequestMapping("/test") public class UserController {    @Autowired private UserService userService; /**     * 查询全部     * @return */ @GetMapping("/list") public Object list(){        System.out.println("查询成功"); return userService.list();    } /**     * 根据id删除     * @param id     * @return */ @GetMapping("/delete") public boolean delete(Integer id){        System.out.println("删除成功"); return userService.removeById(id);    } /**     *  根据id查询      * @param id     * @return */ @GetMapping("/byid") public Object byid(Integer id){        System.out.println("查询成功"); return userService.getById(id);    } /**     *  修改     * @param user     * @return */ @PostMapping("/update") public boolean update(@RequestBody User user){        System.out.println("修改成功"); return userService.updateById(user);    } /**     * 添加     * @param user     * @return */ @PostMapping("/add") public boolean add(@RequestBody User user){        System.out.println("添加成功"); return userService.save(user);    }}

    3. 微信小程序

    项目结构:

    f6abe1bc81e03f3b5e9184891f2d83d1.png

    3.1 初始配置

    119d2e93d4102ad02c88875c17283ed5.png

    3.2 bing.wxml

    55a72c13ca458d000fde13226c4577cb.png

    <view>  <form bindsubmit='doLogin'>                        <view class="inputView">                <label class="loginLabel">账号label>                <input name="phone" value='10086' class="inputText" placeholder="请输入账号" />            view>            <view class="line">view>                        <view class="inputView">                <label class="loginLabel">密码label>                <input name="password" value='123456' class="inputText" password="true" placeholder="请输入密码" />            view>            <view class="line">view>                        <view class='backColor'>                <button class="loginBtn" formType="submit"  open-type='getUserInfo' >登录button>            view>                    form>view>

    3.3 bing.js

    13088dbef69244523e5ef1f8cd8d2339.png

    3.3 list.wxml

      <button class="add" type='primary' bindtap='addArea'>添加button><view class="container">  <view class='widget'>    <text class='column'>编号text>    <text class='column'>姓名text>    <text class='column'>年龄text>    <text class='link-column'>操作text>  view>  <scroll-view scroll-y="true">    <view>      <block wx:for='{{list}}'>      <view class='widget'>         <text class='column'>{{item.id}}text>        <text class='column'>{{item.name}}text>         <text class='column'>{{item.age}}text>        <view class='link-column'>          <navigator class='link' url='../operation/operation?id={{item.id}}'>编辑navigator> |          <text class='link' bindtap='deleteArea' data-areaid='{{item.id}}' data-areaname='{{item.name}}' data-index='{{index}}'>删除text>          view>        view>            block>    view>  scroll-view>view>

    3.4 list.js

    // pages/list/list.jsPage({ /**   * 页面的初始数据 */ data: {    list:[]  }, /**   * 生命周期函数--监听页面加载 */ onLoad: function (options) {  }, /**   * 生命周期函数--监听页面初次渲染完成 */ onReady: function () {  }, /**   * 生命周期函数--监听页面显示 */ onShow: function () { var that=this;    wx.request({      url: 'http://localhost:8080/test/list',      method:'GET',      data:{},      success:function(res){ var list=res.data; if(list==null){ var toastText='获取数据失败';          wx.showToast({            title: toastText,            icon:'',            duration:2000 //弹出时间 })        }else{          that.setData({            list:list          })        }      }    })  }, /**   * 生命周期函数--监听页面隐藏 */ onHide: function () {  }, /**   * 生命周期函数--监听页面卸载 */ onUnload: function () {  }, /**   * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () {  }, /**   * 页面上拉触底事件的处理函数 */ onReachBottom: function () {  }, /**   * 用户点击右上角分享 */ onShareAppMessage: function () {  },  addArea:function(){    wx.navigateTo({      url:'../operation/operation' })  },  deleteArea: function (e) { var that=this;    wx.showModal({      title: '提示',      content: '确定要删除[' + e.target.dataset.areaname +']吗?',      success:function(sm){ if(sm.confirm){          wx.request({            url: 'http://localhost:8080/test/delete',            data: { id: e.target.dataset.areaid},            method:'GET',            success:function(res){ var result=res.statusCode; var toastText="删除成功"; if(result!=200){                toastText = "删除失败";              }else{                that.data.list.splice(e.target.dataset.index,1);                that.setData({                  list:that.data.list                });              }              wx.showToast({                title: toastText,                icon:'',                duration:2000 });            }          })        }      }    })  }})

    3.5 app.json

    { "pages": [ "pages/bind/bind", "pages/list/list", "pages/logs/logs", "pages/operation/operation", "pages/index/index" ], "window": { "backgroundColor": "#F6F6F6", "backgroundTextStyle": "light", "navigationBarBackgroundColor": "#29d", "navigationBarTitleText": "login", "navigationBarTextStyle": "black" }, "sitemapLocation": "sitemap.json", "style": "v2" }

    4. 测试

    启动开发者服务器,启动SpringBoot的main方法。

    打开微信小程序开发者工具

    登录页面

    5efbe8904bc690313a13d5ad983c922e.png

    首页

    d80593f4266ef1ab46e428c375a69b46.png

    添加页面

    ae4c44967f14352e5c292e83ce690a9c.png

    修改页面

    64a3f526c2bede733f863389e6a74fc3.png

    删除

    4f8d7eba5395598686edd0b6d341ecd7.png

    到处基本的增删改查操作已经完成了

    如有需要前往 Gitee(码云)下载

    前台:https://gitee.com/ckfeng/applet_of_wechat.git后台:https://gitee.com/ckfeng/wx_login.git
    参考文献:cnblogs.com/ckfeng/p/12812214.html

    好了,今天技术部分就讲到这里。还有一个重要的事,我们现在已开放对外招导师。工资还可以,大概15K-25K,点击下面【链接】有详细介绍!(注意!每期我们只招1个人!)

    060281a3c27080434dae6097f303e1f0.png

    15K~25K招聘导师若干名

    64e0908315e6081730e24079b49479b4.png
    展开全文
  • 微信小程序实现登录Java前后端分离

    千次阅读 2020-02-05 10:44:17
    找了很多资料虽然文档很多,但是自己需要的的并不多,现在我把自己学会的做一个小小的demo,以便给那些还没有经验的入门者一些小小的指引,我这是一篇基于Java后端的前后端分离的微信小程序实现登录。鉴于是简单的...

    最近在学习微信小程序相关的知识,找了很多资料虽然文档很多,但是自己需要的的并不多,现在我把自己学会的做一个小小的demo,以便给那些还没有经验的入门者一些小小的指引,我这是一篇基于Java后端的前后端分离的微信小程序实现的登录。鉴于是简单的前后端demo就没有用Java框架了。前端也是简单的导入了一些组件。该项目是一个完整的登录项目,实际中应用到了MySQL,jdbc进行数据的查询,json作为数据交换。项目中需要用到的jar包,我也会一起放上来,以便大家下载学习。希望大家多多支持。

    项目我已经上传到码云了,传送门

    1. 项目结构
    • 前端
    • 后端
    1. 微信小程序
    2. Java后端
    3. MySQL

    项目结构

    前端

    • 下载微信开发者工具,点此跳转
    • 注册微信开发者账号,查看自己的APPID(这里其实在开发过程中可以暂时不用,在这里我不过多的描述,这个可以看别人的教程)
    • 导入项目,微信小程序中的代码。
    • 下面是界面图片和包结构
      在这里插入图片描述
      这里不用纠结pages里面那么多的页面文件,主要登录用的是login页面的文件。读者只需将login文件看懂即可。然后修改下app.json中的配置文件。
      在这里插入图片描述

    后端

    • 这里我使用的是IDEA,当然也可以使用eclipse或者MyEclipse,都是没得问题的,我就简单的建立了一个Javaweb的项目,方便能够接收跨域的请求。下面是我的项目结构,
      在这里插入图片描述
    • 这里我着重的贴一下Java端用来接收前端请求的selvlet的代码,其他的Java后端代码也已经上传到码云项目中了。
    package servlet;
    
    import com.google.gson.Gson;
    import dao.UserDao;
    import vo.User;
    
    import javax.servlet.ServletException;
    import javax.servlet.annotation.WebServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import java.io.IOException;
    import java.io.Writer;
    import java.sql.SQLException;
    import java.util.HashMap;
    import java.util.Map;
    
    @WebServlet("/WechatDemo1")
    public class WechatDemo1 extends javax.servlet.http.HttpServlet {
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            doGet(request, response);
        }
    
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    
    
            //设置请求编码
            request.setCharacterEncoding("utf-8");
            response.setContentType("text/html;charset=utf-8");
            /* 设置响应头允许ajax跨域访问 */
            response.setHeader("Access-Control-Allow-Origin", "*");
            /* 星号表示所有的异域请求都可以接受, */
            response.setHeader("Access-Control-Allow-Methods", "GET,POST");
    
    
            //获取微信小程序get的参数值并打印
            String account = (String) request.getParameter("x");
            String password = (String) request.getParameter("y");
            System.out.println(account + "---->" + password);
    
    
            UserDao userDao = new UserDao();
            User user = null;
    
            try {
                user = userDao.findUserByAccountAndPassword(account,password);
    
            } catch (Exception e) {
    //            System.out.println(e.getMessage());
                e.printStackTrace();
            }
    		//转成json数据
            Map<String,Object> result = new HashMap<String, Object>();
            result.put("data",user);
    
    		//使用Gson类需要导入gson-2.8.0.jar
            String json = new Gson().toJson(result);
            
    		//返回值给微信小程序
            Writer out = response.getWriter();
            out.write(json);
            out.flush();
            
        }
    }
    
    
    • 上面需要的jar包也在项目中有包含,可以直接从项目中下载,还有就是数据库文件。数据库连接配置在util包中的DBConnection中修改。
    package util;
    
    import java.sql.Connection;
    import java.sql.DriverManager;
    import java.sql.SQLException;
    
    public class DBConnection {
    
        private DBConnection (){
    
        }
    
        public static Connection getInstance(){
            Connection con = null;
            DBConnection db = new DBConnection();
            return db.getConnection(con);
    
        }
    
        private Connection getConnection(Connection con){
    
            String driver = "com.mysql.cj.jdbc.Driver";  //驱动路径
            String url = "jdbc:mysql://localhost:3306/wechat_demo";  //数据库路径,需要自行修改
            String name = "root";  //数据库用户名
            String password = "XXXXXXX";  //这里是数据库密码
    
            try {
                Class.forName(driver);
                System.out.println("数据库驱动加载成功");
    
                con = DriverManager.getConnection(url,name,password);
                System.out.println("数据库连接成功");
            } catch (ClassNotFoundException | SQLException e) {
                e.printStackTrace();
            }
            return con;
        }
    }
    
    
    • 下面是我数据库中的table,我的MySQL版本应该是8.0.19,所以这里我上传的驱动也是相应的版本,一般的5.0版本也可以去MySQL官网下载,这里请读者自行百度。
      在这里插入图片描述
      数据库管理工具自己决定用什么吧,我这里用的是Navicat,新建一个user表,插入数据如下。
    INSERT INTO `users` VALUES (1000000001, 'admin', '123456', 'Admin');
    INSERT INTO `users` VALUES (1000000002, 'test', '123456', 'Test');
    

    项目已经搭建成功了。我讲得可能比较含糊,如果大家有不明白的地方,可以留言,在我力所能及的范围下,我都会给以解答的,谢谢了。

    具体的项目地址,点此访问

    展开全文
  • SpringBoot+Mybatis+Mysql结合微信小程序实现登录

    千次阅读 多人点赞 2019-03-17 09:33:22
    今天利用了休息的时间自学了一下微信小程序 后端采用了流行的SpringBoot框架 接下来我们看代码吧 首先介绍的是后端代码 搭建Spring Boot框架,搭建好后修改一下application.yml文件 server: servlet: context...
  • 微信小程序实现登录之java后台

    千次阅读 2019-04-27 09:02:50
    微信小程序登录流程大致为: 第一步:前端调用wx.login()函数,获取返回的code值。(每次通过wx.login()得到的code值可能不一样) 第二步:传递获取到的code值到服务器端,在服务器端用小程序appid,appsecret等去...
  • 微信小程序实现登录获取头像昵称

    千次阅读 2020-04-21 00:17:39
    微信小程序获取用户头像昵称 新的改变 我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写博客: 全新的界面设计 ,将会带来全新的写作...
  • 微信小程序实现登录功能

    千次阅读 2017-12-08 19:47:05
    直接获取用户数据 wx.getUserInfo({ success: function (res) { var userInfo = res.userInfo console.log("获取登录用户的所有信息") console.log(res.userInfo) } }) 如果
  • 因为一些原因,我就开始学习了小程序,这次做了一个登录一个注册页面,源码地址:https://gaoyixiang1.github.io/Lunch/大概功能:登录在账户和密码都没有输入的情况下,页面不会跳转。当登录成功和信息输入不全时...
  • 作者:安详的苦丁茶链接:https://www.cnblogs.com/ckfeng/p/12812214.html项目描述:在微信小程序中通过与Springboot操作数据库实现简单的...
  • 项目描述:在微信小程序中通过与Springboot操作数据库实现简单的增删改查,其中我是用springboot整合mybatis-plus 和mysql使用的 1. 开发前准备 1.1 前置知识 java基础 SpringBoot简单基础知识 1.2 环境...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,704
精华内容 681
关键字:

微信小程序实现登录

微信小程序 订阅