用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

微客吧 首页 教程 微信小程序 新手教程 查看内容

简易微信小程序签到功能

纸飞机 2018-11-12 16:05

一、效果图  点击签到后二、数据库  用一张数据表存用户签到的信息,每次用户签到都会往表中添加一条记录了用户id和签到日期的数据,如下图三、后端  后端写两个接口,一个用于查询用户今日是否签到和签到记录 ...

一、效果图

  点击签到后

二、数据库

  用一张数据表存用户签到的信息,每次用户签到都会往表中添加一条记录了用户id和签到日期的数据,如下图

三、后端

  后端写两个接口,一个用于查询用户今日是否签到和签到记录总数,一个用于添加用户签到信息到数据库。这里用的是python的flask框架。

  (1)查询用户签到信息接口:

  1. @app.route('/get_sign/')
  2. def get_sign(user_id):
  3. try:
  4. data=get_sign_info(user_id)
  5. except Exception as e:
  6. return jsonify({'status':0,'Exception':str(e)})
  7. return jsonify({'status':1,'data':data})
  8. def get_sign_info(user_id):
  9. conn = sqlite3.connect('test.sqlite')
  10. cursor = conn.cursor()
  11. cursor.execute('select date from sign where user_id=?',(user_id,))
  12. all_date=set([x[0] for x in cursor.fetchall()])
  13. now_date=date.today().strftime('%Y-%m-%d')//将日期字符串化
  14. if now_date in all_date:
  15. signed=True
  16. else:
  17. signed=False
  18. total=len(all_date)
  19. conn.close()
  20. return {'total':total,'signed':signed}

  查询到所有签到日期后用set去除重复项,然后判断一下当天的日期是否在其中,如果不在其中,signed=False表示今日未签到。签到总数就是all_date的长度

  使用了datetime库来获取日期信息。from datetime import date

(2)添加用户签到信息接口:

  1. @app.route('/sign/')
  2. def sign(user_id):
  3. try:
  4. update_sign(user_id)
  5. except Exception as e:
  6. return jsonify({'status':0,'Exception':str(e)})
  7. return jsonify({'status':1})
  8. def update_sign(user_id):
  9. now_date=date.today().strftime('%Y-%m-%d')
  10. conn = sqlite3.connect('test.sqlite')
  11. cursor = conn.cursor()
  12. cursor.execute('insert into sign (user_id,date) values(?,?)',\
  13. (user_id,now_date))
  14. conn.commit()
  15. conn.close()

wxml文件

  1. class="sign" wx:if="{{isLogin == true}}">
  2. class="image" src='../../dist/images/sign.png'>
  3. class="sign_info">
  4. wx:if="{{signed==false}}" bindtap='sign'>点击此处签到
  5. wx:if="{{signed==true}}">今日已签到
  6. 已签到{{total_sign}}天

wxss文件

  1. .image{
  2. float:left;
  3. width: 140rpx;
  4. height: 140rpx;
  5. margin-right: 7%;
  6. margin-left:20%;
  7. }
  8. .sign{
  9. margin-top: 10%;
  10. }
  11. .sign_info{
  12. width: 100%;
  13. color: #666;
  14. font-size: 43rpx;
  15. }

js文件

  1. get_sign: function(){
  2. var that = this;
  3. var userId = wx.getStorageSync("userId");
  4. wx.request({
  5. url: 'http://服务器公网ip:80/get_sign/'+userId,
  6. method: "GET",
  7. success: function (res) {
  8. if (res.data.status == 1) {
  9. that.setData({
  10. total_sign: res.data.data.total,
  11. signed: res.data.data.signed,
  12. })
  13. }
  14. else{
  15. console.log("status error: " + res.data.Exception)
  16. }
  17. },
  18. })
  19. },
  20. sign:function(){
  21. var that = this;
  22. var userId = wx.getStorageSync("userId");
  23. wx.request({
  24. url: 'http://服务器公网ip:80/sign/' + userId,
  25. method: "GET",
  26. success: function 邀请
    鲜花
    鲜花
    握手
    握手
    雷人
    雷人
    路过
    路过
    鸡蛋
    鸡蛋
    分享至 : QQ空间
    收藏