「小程序JAVA实战」小程序注册与后端联调(35)

栏目: Java · 发布时间: 5年前

内容简介:小程序的后端spring boot的注册接口已经完成了,下一步就是修改小程序的前端请求联调下。之前说过wx.request的api。源码:https://github.com/limingios/wxProgram.git 中的wx-springboot 和 No.15app.jsapp.json

小程序的后端spring boot的注册接口已经完成了,下一步就是修改小程序的前端请求联调下。之前说过wx.request的api。源码:https://github.com/limingios/wxProgram.git 中的wx-springboot 和 No.15

注册与后端的联调

  • 在app.js定义后端服务器的路径

    >这里需要提一下,假设在手机上测,如果手机开启的4G信号,跟电脑不是在同一个局域网的情况下。需要电脑端开启内网穿透的功能才可以在测试。如果在同一个局域网内可以通过内网ip的形式。localhost直接都是一台机器。

app.js

//app.js
App({
  serverUrl:"http://localhost:8081",
  userInfo:null
})

app.json

{
  "pages":[
    "pages/userRegister/userRegister"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "小程序视频",
    "navigationBarTextStyle":"black"
  },
  "debug":true
}

userRegister.js

const app = getApp()

Page({
    data: {

    },

    doRegist: function(e) {
      var formObject = e.detail.value;
      var username = formObject.username;
      var password = formObject.password;

      // 简单验证
      if (username.length == 0 || password.length == 0) {
        wx.showToast({
          title: '用户名或密码不能为空',
          icon: 'none',
          duration: 3000
        })
      }else{
        wx.request({
          url: app.serverUrl +"/regist", 
          method:"POST",
          data: {
            username: username,
            password: password
          },
          header: {
            'content-type': 'application/json' // 默认值
          },
          success: function (res) {
            console.log(res.data);
            var status = res.data.status;
            if(status == 200){
              wx.showToast({
                title: "用户注册成功~!",
                icon: 'none',
                duration: 3000
              })
              app.userinfo = res.data.data;
            }else if(status == 500){
              wx.showToast({
                title: res.data.msg,
                icon: 'none',
                duration: 3000
              })
            }
          }
        })
      }
    },
    goLoginPage:function(e){
      console.log("跳转到登录");
    }
})
  • 程序测试

    >开启eclipse的spring boot的程序

「小程序 <a href='https://www.codercto.com/topics/22013.html'>JAVA</a> 实战」小程序注册与后端联调(35)

http://localhost:8081 不在以下 request 合法域名列表中,请参考文档:https://mp.weixin.qq.com/debug/wxadoc/dev/api/network-request.html

「小程序JAVA实战」小程序注册与后端联调(35)

「小程序JAVA实战」小程序注册与后端联调(35)

调试的解决方案

「小程序JAVA实战」小程序注册与后端联调(35)

  • 成功运行
    「小程序JAVA实战」小程序注册与后端联调(35)
  • 微信小程序模拟器在笔记本上input无法获取焦点,无法输入

    在input框里面鼠标长按即可

PS:整个这个从前端到后端的针对注册接口已经开发完毕了。

百度未收录

>>原创文章,欢迎转载。转载请注明:转载自IT人故事会,谢谢!

>>原文链接地址:


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

关乎天下

关乎天下

关明生 / 学林出版社 / 2005-8 / 8.00元

《关乎天下:中小企业赢取江山的秘诀》收录了作者多年在大企业(如阿里巴巴网站)从事管理基层得到的经验,可为众多中小企业提供招贤纳士和销售管理方面的新思路。一起来看看 《关乎天下》 这本书的介绍吧!

RGB CMYK 转换工具
RGB CMYK 转换工具

RGB CMYK 互转工具

HEX HSV 转换工具
HEX HSV 转换工具

HEX HSV 互换工具

HSV CMYK 转换工具
HSV CMYK 转换工具

HSV CMYK互换工具