基于java的⼩程序的实现(三)登录,注册,注⼩程序端的实现⽂章⽬录
1.⼩程序项⽬结构认识
js⽂件⽤来写相关的逻辑操作,主要是⽤来操作数据
json⽂件⽤来写⼀些相关的配置
wxss相当于css⽤来写页⾯样式
wxml相当于html⽤来写页⾯的元素的
pages⽂件夹中可以存放多个⽂件夹,每个⽂件夹⾥⾯都是⼀套是js,json,wxss,wxml的⽂件结构
2.相关配置的写⼊
1.现将⼩程序的相关信息写⼊app.json⽂件
{
"pages":[
"pages/userLogin/login",
"pages/userRegist/regist",
],
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "佐仓⼩视频",
"navigationBarTextStyle": "black"
}
}
2.将相关配置写⼊app.js
//app.js
App({
//服务器的路径(因为该路径不能直接填写ip地址,所以这才采⽤的是内⽹穿透⼯具⽣成的外⽹url,并配置到本地的tomcat上)
serverUrl:"lex.",
//该函数为将⽤户信息存⼊⼿机的缓存中
setGlobalUserInfo:function(user){
wx.setStorageSync("userInfo", user);
},
//从缓存中取出⽤户信息
getGlobalUserInfo: function (key) {
StorageSync(key);
}
})
3.注册功能需求分析
⽤户在注册页⾯输⼊的内容不能为空,如果⽤户名或者密码为空则需要弹出提⽰消息(暂没有对⽤户名和密码长度做出限制)⽤户在输⼊⽤户名和密码点击注册之后,要调⽤注册接⼝,在回调函数中进⾏判断,如果返回的状态码为200则说明注册成功,如果为500则说明注册失败,并提⽰错误信息给⽤户
注册成功之后会直接跳到登录界⾯
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{
var serverUrl=app.serverUrl;
url: serverUrl +'/regist',
method:'POST',
data:{
username:username,
password:password
},
header:{
'content-type': 'application/json'
},
success:function(res){
console.log(res.data)
if (res.data.status==200){
wx.showToast({
title: '恭喜你,注册成功',
icon:"none",
duration:3000
})
}else{
wx.showToast({
title: res.data.msg,
icon:"none",
duration:3000
})
}
}
})
}
},
goLoginPage:function(){
wx.navigateTo({
url: '../userLogin/login'
})
}
})
4.登录功能需求分析
登录功能需要对密码和⽤户名进⾏⾮空的判定,如果为空,给⽤户返回错误提⽰
点击登录按钮触发js事件并调⽤后台登录接⼝,如果回调函数返回200则说明登陆成功,则将后端返回的⽤户信息保存到⼿机的缓存中,并进⾏页⾯的跳转
如果500给⽤户提⽰错误信息
doLogin:function(e){
var me =this;
var formObject=e.detail.value;
var username = formObject.username;
var password = formObject.password;
var serverUrl=app.serverUrl;
if (username.length == 0 || password.length == 0) {
wx.showToast({
title: '⽤户名或密码不能为空',
icon: "none",
duration: 3000
})
}else{
// wx.showToast({
// title: '登录ing..',
// icon:"none"
// })
wx.showLoading({
title: '登陆ing',
})
url: serverUrl+'/login',
method:'POST',
data: {
username: username,
password: password
},
header: {
'content-type': 'application/json'
},
success:function(res){
if(res.data.status==200){
wx.showToast({
title: '登陆成功',
icon: "success"
})
// app.userInfo=res.data.data;
//将后端返回的⽤户信息存⼊缓存中
app.setGlobalUserInfo(res.data.data);
url: '../mine/mine'
)
}有趣的java小程序
}else{
wx.showToast({
title: '登陆失败',
icon: "none"
})
}
console.log(res.data);
}
})
}
}
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论