2019⾼校⼩程序开发⼤赛获奖作品——《brain头脑智
序》
⽬录
前⾔
今年4⽉份机缘巧合和团队成员参加了2019 年⾼校⼩程序开发⼤赛,经过长时间的“头脑风暴”,我们最终将主题定为“头脑风
暴”类——《》(喜欢的话到我们的github上star⼀下呀(*^▽^*))
我们开发这款项⽬的初衷是:
创造出⼀款针对“⾼效思维发散、打破思维定势,优化思维产出”⽽设计的功能性实⽤且独特,操作流程简明扼要,界⾯简洁⽽⼜新颖的⼩程序。
前期我们讨论出来的项⽬必须要有的特点是:
考虑到我们的项⽬是需要接近上线的,我们⽤到的后台及数据库就采⽤了基于⾃带的——看官⽅解释:云开发为开发者提供完整的原⽣云端⽀持和服务⽀持,弱化后端和运维概念,⽆需搭建服务器,使⽤平台提供的 API 进⾏核⼼业务开发,即可实现快速上线和迭代,同时这⼀能⼒,同开发者已经使⽤的云服务相互兼容,并不互斥。
简⽽⾔之,就是⽆需购买⾃⼰的服务器、部署后端服务这些,云开发提供⼀站式后台服务,直接在前台利⽤api和云函数来操作各种后台服务⽐如数据库增删改查以及⽂件存储管理等(在新建项⽬的时候勾选创建 “云开发 QuickStart 项⽬”即可。当然空间⼤⼩也是有限制的,超了需要⽀付⼀定的⾦额),虽然速度上是慢了点,但是特容易上⼿,后台⼩⽩如我也能操作,⾮常推荐!
关于云开发还需要提醒⼀下
云开发需要指定环境,⼀般都是有⼀个测试环境,⼀个发布环境,开发的时候选择测试环境即可。
Node.js云函数需要上传并部署到云端才⾏,否则这些云函数都不起作⽤。
交互流程说明图
先撒⼀张交互流程说明图(这是前期设计的,后期开发的时候考虑到⼀些问题,我们并没有严格按照此图设计开发项⽬,会有⼀些⼩改动)
项⽬开发主要是我和另⼀个⼩伙伴⼀起操⼑的
我的任务
我的任务主要是
⽽此次开发主要是要⽤到数据库来存储信息,数据库预览如下,分为集合和记录,他们的关系是⼀对多的关系,即⼀个集合⾥包含有多条记录,每条记录都是拥有相同属性的json对象。之后会专门说清楚如何操作数据库。
好的,接下来开始说明开发思路了
登录授权(login)
我们的项⽬肯定是需要⽤户的⾝份信息的,⽐如openid(⽤户唯⼀标识)、头像、昵称等,所以需要⼀个登录授权页⾯才⾏
云开发提供了login云函数可以⽅便快捷的获取⽤户的openid,那么在获取⽤户数据思路如下(注意:由于进⼊我们⼩程序的⽅式有两条:1、正常点击⼩程序进⼊⾸页 2、点击房主分享的链接直接进⼊房间等待区。所以我们需要在⽤户进⼊⼩程序前捕获他原本需要进⼊的页⾯path)
所以先在app.js的onLaunch函数中插⼊如下数据
let userInfo = wx.getStorageSync('userInfo');
let selfOpenId = wx.getStorageSync('selfOpenId');
if (!selfOpenId || !userInfo.avatarUrl) {
selectediconpath什么意思url: 'pages/login/login?redirect_url=' + encodeURIComponent(`/${redirect_url}`),
})
return
}
在登陆界⾯中,核⼼代码如下:
// 调⽤云函数
wx.cloud.callFunction({
name: 'login',
data: {},
success: res => {
let openid = sult.openid;//存储⽤户代码
app.globalData.selfOpenId = openid;
wx.setStorageSync('userInfo', userInfo);//本地缓存⽤户信息
wx.setStorageSync('selfOpenId', openid);
wx.hideLoading();
that.setData({
loading: false
});
//先查询是否有此⽤户记录
let data = res.data;
if (data.length === 0) {//没有则在users集合中新建⼀条记录
//多次会⽤到数据库操作,建议直接封装代码到app.js
avatarUrl: app.globalData.userInfo.avatarUrl,//头像
hisRoom: [],//⽤于历史纪录,查询进去过的房间号
nickName: app.globalData.userInfo.nickName,//昵称
star: [],
userInfo: {},
openid: app.globalData.selfOpenId
}).then(()=>{
console.log('插⼊⽤户数据成功')
})
}else{
console.log('⽤户已有数据')
}
//开始跳转页⾯
if (direct_url) {
console.log('跳转开始')
url: direct_url
})
} else {
url: 'pages/index/index'///
})
return
}
})
},
fail: err => {
<('[云函数] [login] 调⽤失败', err)
}
})
登陆完毕后,进⼊⾸页啦
⾸页(tababr分析)
⾸页如下,简洁吧嘻嘻(为了⽅便⾃⼰……⼀下参与者只有我……,但是实测过⼏⼈参与也是能运⾏的!当然如果各位⼜遇到什么问题欢迎评论区狂砸我!)
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论