微阅读与电影小程序的设计与实现

2021-03-22 02:53徐祎麟刘星含
电脑知识与技术 2021年4期
关键词:云服务微信小程序

徐祎麟 刘星含

摘要:随着社会进步和科技发展,移动端技术得到迅速发展,手机已经普及到各个年龄段,信息服务重心从电脑端向移动端转移。但学生信息服务的移动应用目前还不太完善,学生无法快速获最新消息和对应数据。基于微信小程序的微阅读与电影前端使用原生态App进行开发,后端采用云服务框架构建,前后端信息交互通过架包封装API接口实现,微阅读与电影微信小程序为大众建立一个公共电影服务以及文章阅读平台,敢于挑战传统的信息服务,采用个性化设计,时刻关注用户的使用体验。

关键词:微信小程序;数据爬取;小程序开发;云服务

中图分类号:TP393     文献标识码: A

文章编号:1009-3044(2021)04-0083-02

小程序无需用户进行应用的下载和安装,大大缩短了等待时间,优化用户使用体验。微信小程序服务于微信平台,只需要安装微信便可使用各种各样小程序。当前网络信息过度泛滥,造成信息的不一致和虚假传播,用户所能获得的信息真实度有限,使用微信小程序,可以收获大量的用户群体,同时净化网络环境。使用者在使用小程序时,与微信账号进行绑定,产品公开免费,因此小程序可以迅速获得用户关注并方便后期维护和优化。此应用可以帮助用户第一时间获取信息,同时进行信息交流分享,创造良好的网络环境。

1需求分析

通过数据分析和市场调研,信息服务重心更倾向于移动端,但学生信息服务的移动应用目前还不太完善。高校学生的关注集中在日常生活和消费娱乐,此应用旨在提供观影和阅读方面的服务,为学生的生活提供便利。包括的功能有:浏览推荐文章,收听流行音乐,查看电影排名和评分数据,搜索电影等功能。此应用为大众建立一个公共电影服务以及文章阅读平台,程序分为三大的模块:阅读文章、浏览电影、用户信息。

2体系架构

该程序前端页面使用原生态App进行开发,方便查看源码和代码维护。前端页面向后端发送请求获取数据,后端再把结果传递给前端,经过数据渲染功能显示在页面上。后端采用云服务框架构建,与云数据库进行交互,从微信服务器获取信息,经过后端逻辑层处理数据,前端再进行数据渲染和显示。

3 功能模块

3.1阅读文章模块

阅读文章模块包括文章阅读和评论分享。用户可以查看文章列表,会跳转到具体文章页面,查看文章作者,标题和内容。该页面实现音乐播放接口,用户通过点击页面图片,实现音乐播放和暂停。文章底部有三个图片,用户可以为相关文章点赞,评论和收藏。点击评论图标,可以查看用户评论和发表评论内容。

3.2浏览电影模块

浏览电影模块包括查看电影榜单和搜索功能。调用电影网站接口,页面分成三个板块:新片榜,热映榜和高分榜。用户点击电影海报图片,即可查看有关的电影信息,如电影评分,电影简介,演员阵容等内容。电影模块界面上端有搜索框,用户可以根据关键字,索引到具体电影名称,进而获得想要的内容。用户可以拖曳榜单,实现数据的即时刷新。

3.3用户信息模块

用户信息模块根据功能不同进行分类,主要分为八个功能:系统信息,网络状态,地图显示,即时定位,用户登录,应用服务,扫码支付,运动步数。用户可以查看相关信息和体验服务,某些功能需要通知用户进行允许权限设置。例如,开启地图显示功能,用户可以查看自己位置。支持微信扫码功能,获得更多的信息服务与支持。打开应用服务,里面有第三方平台服务,增加用户体验。

4 功能实现

4.1页面布局

传统的前端设计,依赖于盒子模型,但在某些特殊布局,如垂直居中设计就比较困难,采用Flex弹性布局可以有效解决此类问题。指定父容器display属性为flex,对于文字列表,设置flex-direction属性为column,垂直方向由上至下排列。每个列表内容设置flex-direction属性为row,对于主轴justify-content和交叉轴align-items对齐方式都设置为center。一般获取的电影数量不只几个,再设置元素的flex-wrap属性为warp,当数量超出屏幕宽度时,实现自动换行。

4.2数据获取

本地数据库存储文字和图片,音乐和电影数据分别调用音乐外链和电影API接口进行实现。通過wx.request方法发起https请求,参数url为请求资源地址,调用默认get方法获得的资源是json格式文件,然后通过在线json转码器翻译为js文件。定义一个函数,通过循环遍历电影目录,根据得到的数据字段,依此获得电影名称,评分,简介和演员等数据,再设置success函数调用请求数据和fail函数如果返回资源错误。

4.3接口调用

在用户界面,实现运动步数功能获得用户步数,首先调用login函数登录小程序,如果申请有appID的话,可以通过云函数得到cloudID后,weRunData的值便可以公开获取,经过前端界面数据渲染,用户便可以查看。定位功能的实现,开发者需要登录微信开发者平台,申请第三方服务,按照官方文档要求,调用第三方服务接口。

5结束语

微阅读与电影小程序借助于微信平台,开发成本简单,代码易于维护。目前小程序的初期效果已经实现,后期还有待继续完善,未来在大学校园里推广,能有效节省学生时间和促进合理消费,同时数据实现即时更新,可以与学生会和广播站进行联合,刊登优秀文章到小程序中,营造良好的大学氛围。合理设计和应用小程序能为学生的学习和生活提供便利,同时宣传和扩大学校知名度。

参考文献:

[1] 雷磊.微信小程序开发入门与实践[M].北京:清华大学出版社,2017.

[2] 雷磊.微信官方文档.小程序[EB/OL].[2020-08-15].https://developers.weixin.qq.com/miniprogram/dev/framework/

[3] 蒋文娟,苏喜红,孟丽珍.基于微信小程序的音乐播放器研究与实现[J].软件导刊,2020,19(6):141-145.

[4] 徐星明.微信小程序第三方平台的设计与实现[D].济南:山东大学,2020.

[5] 余跃泓.基于弹性盒子的响应式网页布局[J].信息与电脑,2020,32(10):181-183.

【通联编辑:梁书】

猜你喜欢
云服务微信小程序
当图书馆遇上微信小程序
基于会计服务的SWOT分析