摘要：近几年，随着科技的发展，移动终端APP开发成为热点，目前的技术更多的是使用原生应用开发和HTML5应用开发。然而，原生应用的可移植性相较而言比较差，而且在不同的平台需要各自开发APP，即使逻辑、界面相同；而HTML5应用开发使用Web技术，这就导致APP不能直接访问设备硬件和离线存储，在体验和性能上有很大的局限性。基于此，混合（Hybrid）APP开发备受瞩目。

    混合（Hybrid）APP开发，结合了原生和HTML5开发的技术，开发的APP能在不同的移动平台使用，开发效率高；更新和部署方便，只需要在服务端升级。在此次数学建模APP的开发上，基于ionic的混合（Hybrid）APP跨平台开发无疑是最合适的选择。

本项目前端使用的是Angular、TypeScript等，后端使用的是SpringBoot、MyBatis框架，数据库是MySQL，另外使用tomcat搭建了文件服务器。基于此，完成了基于ionic的数学建模APP的跨平台开发，数学建模APP让教师及学生及时了解数模动态与新闻，能够为学生提供最新的、较为丰富的数模学习资源下载服务，能够为学生提供一个在线的问题回复的平台，促进数学建模的良好发展。

关键词：混合（Hybrid）APP开发，ionic，Angular，TypeScript，SpringBoot，MyBatis，MySQL

 

目录

摘要

ABSTRACT

1 引 言-1

1.1 课题的背景、意义-1

1.2 国内外研究现状-1

1.3 课题研究的目标、内容和解决的一些相关关键问题-1

1.4 可行性分析-2

2 系统平台选择-2

2.1 硬件平台选择-2

2.2 系统操作平台选择-2

2.3 数据库平台选择-3

2.4 使用到的插件-3

2.4.1 APP Update-3

2.4.2 File、FilePath、Transfer、Camera-3

2.4.3 Storage-3

2.4.4 热部署-3

2.4.5 Mybatis的分页插件PageHelper-3

2.4.6 Druid数据源-3

2.4.7 Maven-3

2.5 开发工具的选择—WebStorm&IDEA-4

2.6 文件服务器-4

2.7 小结-4

3 系统需求分析-4

3.1 物理模块设计图-4

3.2 系统功能详细划分-5

3.3 系统功能概述-6

3.3.1 登录注册功能-6

3.3.2 个人信息管理-6

3.3.3 新闻通知-6

3.3.4 下载中心-6

3.3.5 数模论坛-7

3.3.6 日夜模式-7

3.4 设计小结-7

4 系统详细设计-7

4.1 系统数据库设计-7

4.1.1 数据库系统的需求分析-7

4.1.2 数据库的概念结构设计-8

4.1.3 数据库的逻辑结构表-12

4.2 开发环境搭建-15

4.2.1 ionic开发环境搭建-15

4.2.2 SpringBoot项目搭建-16

5 功能模块设计-17

5.1 APP功能模块设计-17

5.1.1 APP-Tab页-17

5.1.2 服务类（Providers）rest.ts-17

5.1.3 UI层公用方法抽象类（common/baseui.ts）-18

5.1.4 输入法表情组件（components/emojipicker）-19

5.1.5 个人中心模块-21

5.1.6 首页模块-27

5.1.7 下载中心模块-29

5.1.8 数模论坛模块-31

5.2 后台功能模块设计-31

5.2.1 application.yml配置-31

5.2.2 用户登录模块-32

5.2.3 获取新闻信息模块-33

5.2.4 发布数模难题模块-35

5.2.5 上传文件模块-37

6 系统开发中的问题-38

6.1 创建ionic项目出错-38

6.2 在数据库中保存特殊字符（emoji）-38

参 考 文 献-39