微信小程序签到功能
本文实例为大家分享了简易微信小程序签到功能的具体代码,供大家参考,具体内容如下
一、效果图
点击签到后
二、数据库
用一张数据表存用户签到的信息,每次用户签到都会往表中添加一条记录了用户编号和签到日期的数据,如下图
三、后端
后端写两个接口,一个用于查询用户今日是否签到和签到记录总数,一个用于添加用户签到信息到数据库。这里用的是大蟒的瓶框架。
(1)查询用户签到信息接口:
@ app。路由('/get _ sign/user _ id ')def get _ sign(user _ id): try : data=get _ sign _ info(user _ id)除了Exception as e :返回jsonify({ ' status ' :0,' Exception ' : tr(e)})返回jsonify({ ' status ' :1,' data ' 3: data })def get _ sign _ info(user _ id)3: conn=1、(user _ id)、)all_date=set([x[0]代表光标。fetchall()])now _ date=date。今日().字符串时间(' % Y-% m-% d ')//将日期字符串化如果now _ date in all _ date : signed=True else : signed=False total=len(all _ date)conn . close()返回{“total”: total,“signed”: signed }查询到所有签到日期后用设置去除重复项,然后判断一下当天的日期是否在其中,如果不在其中,有符号=假表示今日未签到。签到总数就是全部_日期的长度
使用了日期时间库来获取日期信息从日期时间导入日期
(2)添加用户签到信息接口:
@ app。路由('/sign/user _ id ')def sign(user _ id):尝试: update _ sign(user _ id)除了异常as e :返回jsonify({ ' status ' :0,' Exception ' : str(e)})返回jsonify({ ' status ' :1 })def update _ sign(user _ id)3: now _ date=date today().字符串时间(' % Y-% m-% d ')conn=SQLite 3。连接('测试。SQLite ')游标=conn . cursor()游标。执行('插入登录(user _ id,日期)值(?)',\ (user_id,now _ date))conn.commit()conn . close()四、小程序前端
页面结构文件
view class=' sign ' wx : if=' { { isLogin==true } } ' image class=' image ' src='././dist/images/sign。png '/image view class=' sign _ info ' view wx : if=' { { sign==false } } ' bind tap=' sign '点击此处签到/view view wx : if=“{ { signed==true } }”今日已签到/view视图已签到{{total_sign}}天/view /view /viewwxss文件。图像{ float:left宽度: 140 rpx高度: 140 rpx保证金-权利: 7%;保证金-左侧:20%;}.符号{利润率-前: 10%;}.sign _ info { width : 100%;color : # 666 font-size : 43r px;}js文件
get_sign:函数(){ var=thisvar userId=wx。getstorage ync(' UserID ');wx.request({ url: 'http://服务器公网ip:80/get_sign/' userId,method: 'GET ',success :函数(RES){ if(RES . data。status==1){即。setdata({ total _ sign : RES . data。数据。总计,签名: RES .数据。数据。签名,})else { console。日志('状态错误: ' RES . data。异常)} },})},符号3360 function(){ varvar userId=wx。getstorage ync(' UserID ');wx.request({ url: 'http://服务器公网ip:80/sign/' userId,method: 'GET ',success :函数(RES){ if(RES . data。status==1){即。setdata({ total _ sign :数据。total _ sign 1,signed: true,}) wx.showToast({ title: '成功,icon:“成功”,持续时间: 2000 })else { console。日志('状态错误: ' RES . data。例外)} },})},用户登录后,会立即触发get_sign函数,从数据库获取用户签到信息存到页的数据中,页面也会显示用户今日是否签到和签到总数。
用户点击签到后,会保存签到信息,并更新数据。用showToast弹窗提示签到成功。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。