专栏首页小程序·云开发专栏用云开发制作教务助手小程序丨实战
原创

用云开发制作教务助手小程序丨实战

▌项目背景

本项目由一人承担从后端到前端的构思以及开发,下面我就讲讲从教务助手小程序的构思到开发实现(基于云开发)。

1、灵感来源

教务小程序的灵感来源:用完即走,查个成绩和课表,无需下载app或去翻看公众号内的历史内容。

加上本人很久以前就想实现开发一个类似的app,但app的开发对于开发小白不太友好,不知从何下手!幸好 **小程序·云开发** 的出现解决了我的需求,它的低入门门槛和免后端运维等优势让非科班出身的我也能快速动手开发一款应用类小程序。

2、构思

教务小程序需要核心就是: **成绩查询、课表查询、教务通知查询** ! 那么问题来了,学校教务处只有网页版,教务小程序数据从何而来呢?

经过一系列思考,百度各种问题,思路就来了:

**后端模拟登陆——拿到页面数据——整理数据——反馈到小程序前端渲染**

大概结构如下:

▌项目开发

1、后端

后端的实现 **完全基于云开发**。

部分目录:

采用云开发后端node.js语言,主要利用模块有:

Router模块:

const cloud = require('tcb-admin-node');

//   npm  install tcb-route

const TcbRouter = require('tcb-router');

cloud.init({

  env: '//'

})

const db = cloud.database();

const \_ = db.command;

// 云函数入口函数

exports.main = async (event, context) => {

  const app = new TcbRouter({ event });

  /\*\* 教务处登陆 eg\*/

  app.router('login', async (ctx, next) => {

    const test = require('login/login.js');

    ctx.body = test.main(event, context);

  });

  /\*\*查取成绩\*/

  app.router('getpoint', async (ctx, next) => {

    const logList = require('getpoint/index.js');

    ctx.body = logList.main(event, context);

  });

  /\*\*学术活动\*/

  app.router('academic', async (ctx, next) => {

    const userList = require('schoolnews/academic.js');

    ctx.body = userList.main(event, context);

  });

  app.router('xsxx', async (ctx, next) => {

    const userList = require('schoolnews/xsxx.js');

    ctx.body = userList.main(event, context);

  });

  return app.serve();

}

Cherrio实现课表成绩等网页解析:

const cloud = require('tcb-admin-node')

const rp = require('request-promise');

var cheerio = require("cheerio");

cloud.init()

module.exports = {

  main: async (event, context) => {

    var url ='URL'

    var res = await rp({method: 'get',uri: url,json: false}).then((body) => {

      var academic = [];

      var $ = cheerio.load(body);

      $('.fl').find('dl').each(function (i, elem) {

        //业务代码未写

        /\*\*

          \*\*/

        academic.push({date: date,time:time,title:title,speaker:speaker,place:place,link:link})

      });

      return academic

    }).catch(err => {

      return err;

    })

    return res

  }

}

数据库access_token定时修改

// 云函数入口文件

const cloud = require('wx-server-sdk'),rp = require('request-promise'),key=require('key.js')

cloud.init({

  env: "//"

})

//指定数据库环境

const db = cloud.database({

  env: "//"

}), \_ = db.command;

// 云函数入口函数

exports.main = async (event, context) => {

  try { 

    var res = await rp(

      {

        method: 'get',

        uri: 'https://api.weixin.qq.com/cgi-bin/token?grant\_type=client\_credential&appid='   key.APPID   '&secret='   key.APPSECRET,

        qs: {},//参数

        headers: {},//请求头

        json: true  //是否json数据

      }

    ).then((body) => {

      return body

    }).catch(err => {

      return {errmsg:"rp函数获取失败"}

    })

/\*将获取的access\_token存到数据库\*/

    console.log(res)

    if (res.hasOwnProperty('access\_token')) {

      await db.collection('key').where({

        type: "accesstoken"

      }).update({

        data: {

          accesstoken: res.access\_token,

          datearray: \_.unshift(new Date(new Date().getTime())),

          num: \_.inc(1)

        }

      })

    } else {

      console.log("err错误"   res)

    }

  } catch (err) {

    console.log(err)

  } 

  

}

此外还借助了其他模块实现登陆、数据处理(课表等数据格式化)、云开发数据库操作(用户信息储存,消息发布)、用户权限鉴定(确保后台信息安全)等,在此就不赘述。

2、前端

小白就是“简单粗暴”的进行各种if、var操作;

部分详细介绍如下:

① 课程表:

实现了一键导入(其实课程表这一功能可以单独形成一个通用的小程序上线),每天一卡片形式在首页提醒:今天有什么课,上完没有?

②主题全局替换:

支持自定义主题色,给用户自定义能力。

③校历:

利用了插件【极点日历】再加以美化。

▌感悟

一个从小白到从后端到前端到UI全部自己写的入门者参赛的心路历程就这么多了,目前源码暂不开放,对本小程序有疑问与建议均可在留言,同时希望大家能够利用好小程序实现自己的想法和创意!

源码地址

https://github.com/TencentCloudBase/Good-practice-tutorial-recommended


如果你想要了解更多关于云开发CloudBase相关的技术故事/技术实战经验,请扫码关注【腾讯云云开发】公众号~

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 如何在云托管中操作云开发数据库?

    作为新一代云原生应用引擎(App Engine 2.0),云托管拥有无痛迁移、自动化弹性扩缩容、免运维、支持跨平台部署和联动云开发能力等优势,让开发者可以不限语...

    腾讯云开发TCB
  • 基于云开发 CloudBase 搭建在线视频会议应用教程

    在线视频会议应用是基于浏览器的能力 WebRTC 以及 腾讯云开发 CloudBase 能力构建而成的应用. 在云开发的助力下, 一个复杂的在线会议应用, 一个...

    腾讯云开发TCB
  • 基于云开发 CloudBase 搭建在线视频会议应用

    「在线视频会议应用」是基于浏览器的能力 WebRTC 以及云开发 CloudBase 能力构建而成的应用,在云开发的助力下,一个复杂的在线会议应用,1人、1-...

    腾讯云开发TCB
  • NodeJS使用formidable实现文件上传

      最近自学了一下NodeJS,然后做了一个小demo,实现歌曲的添加、修改、播放和删除的功能,其中自然要实现音乐和图片的上传功能。于是上网查找资料,找到了一个...

    用户1174387
  • ES6 你可能不知道的事 – 基础篇

    ES6,或许应该叫 ES2015(2015 年 6 月正式发布),对于大多数前端同学都不陌生。

    用户4962466
  • Serverless + Egg.js 后台管理系统实战

    作为一名前端开发者,在选择 Nodejs 后端服务框架时,第一时间会想到 Egg.js,不得不说 Egg.js 是一个非常优秀的企业级框架,它的高扩展性和丰富...

    腾讯云serverless团队
  • Serverless + Egg.js 后台管理系统实战

    作为一名前端开发者,在选择 Nodejs 后端服务框架时,第一时间会想到 Egg.js,不得不说 Egg.js 是一个非常优秀的企业级框架,它的高扩展性和丰富的...

    网站运维工程师
  • Web APIs 和JS基础关联性

    JS基础学习ECMAScript 基础语法为后面作铺垫,web APIs是JS的应用,大量使用JS基础语法做交互效果

    星辰_大海
  • 闪回数据库不是“万金油”(r11笔记第73天)

    闪回数据库这个特性在很多Oracle DBA眼里就是鸡肋特性,因为谁会因为恢复数据而需要在主库闪回,最后可能丢掉更多的数据,这个观点没错。 但是...

    jeanron100
  • 【每天一道编程系列-2018.2.2】(Ans)

    You are given two non-empty linked lists representing two non-negative integers...

    yesr

扫码关注云+社区

领取腾讯云代金券