论文总字数：29880字

摘 要

近年来，我国互联网广告发展迅速，数据显示，2016年度中国网络广告市场规模达到2902.7亿元，比2015年同比增长32.9%。然而目前存在的互联网广告投放平台采用“广撒网”策略，即将广告大量、无针对性的投放至网页、APP、报纸中，这不可避免的导致了资源和资金的浪费。如果能够“将最有吸引力的广告放到最有需求的人眼前”，那么互联网广告行业将会飞跃发展。

本次毕业设计主题为基于react的标签管理系统的设计与实现，标签管理系统的目的在于创建并管理具有分析意义的标签，这些标签代表了分析对象的属性，基于这些标签能够将数量庞大、类型复杂多样的分析对象分解成数量相对较小类型相对集中的多个群体，从而做到降低之后工作的分析难度提高分析的精准性。

标签管理系统需要实现的功能有以下四点：1.构造对象；2.构造关系；3.为对象和关系配置属性与标签；4.管理数据源。使用react技术来搭建标签管理系统的前端页面，页面中使用的可视化组件来自于antd（ant design），页面间的跳转采用react的路由库react-router方式，客户端和服务器的交互方式采用Ajax 和 RESTful Web 服务，系统采用基于token的身份验证方式保证系统的安全性。

该毕业设计结束后开发出一个相对简单的标签管理系统，实现上述四个基本功能，同时进一步提高系统的安全性，设置成半小时内无用户操作自动退出系统。经系统测试验证后，系统功能无误，且该系统的稳定性和页面的流畅性较高，页面布局合理。

关键词：标签，react，ant design，react-router，ajax

Abstract

In recent years, Internet advertising in China develops rapidly. The Internet advertising industry will leap forward when “put the most attractive ads in front of the most demanding people” is possible.

The topic of this graduation project is the design and implementation of the tag management system based React, this system aims to create and manage tag which is analyzable. These tags represent the attributes of the object, based on these tags, amounts of and complex objects can be divided into a number of relatively small and highly concentrated groups, so as to reduce the difficulty of analysis and improve the precision.

The tag management system needs to realize four functions:1.construct object;2.construct relationship;3.configure properties and tags for object and relationship;4.manage data sources. The React technology is used to build the front of this system, the visual components are from antd(ant design), jump between pages is realized by using the react-router of React, client and server interact in the way of Ajax and RESTful Web services, token based authentication is used to ensure the security of the system.

After the graduation project finished, the system must realize the four basic functions above and the security of the system has further improvement that automatically set up when user makes no action in half an hour. The stability of the system and the flow of pages are high, the layout of pages needs to be reasonable.

KEY WORDS: tags, react, ant design, react-router, ajax

目录

摘要 I

Abstract II

第一章 选题背景 1

1.1 社会背景 1

1.2 技术背景 1

第二章 需求分析 3

2.1 登陆设置 4

2.2 对象、关系设置 4

2.3 标签设置 4

2.4 数据源设置 5

第三章 系统总体设计 7

3.1 前端框架 7

3.2 UI框架 7

3.3 获取数据的方式 8

第四章 系统详细设计与实现 11

4.1 模块设计 11

4.2 开发环境搭建 12

4.3 代码编写 12

4.3.1 主页面 13

4.3.2 关系管理与对象管理页面 14

4.3.3 标签管理页面 23

4.3.4 数据源管理页面 25

4.3.5 公共组件 31

4.3.6 fetch 34

4.3.7 token 35

第五章 原型系统及测试 38

5.1 前端页面 38

5.2 系统测试 42

第六章 结论 55

6.1 待优化部分 55

6.2 系统前景 55

致谢 57

参考文献 58

选题背景

社会背景

现在，互联网已经渗入到老百姓的日常生活当中。出门不用带钱包，购物不需要出门，所有的支付通过手机或者网页就能完成，这极大程度的方便了老百姓的生活，也是很多人选择网上购物的一个原因。因此很多商家看中了互联网的消费潜力，将部分的销售重心投入到互联网中。不仅仅是购物，互联网还提供了获取世界各地资料的渠道，通过查询互联网解决困惑，这又是互联网渗入日常生活中的体现。

互联网广告就是通过网络广告平台在网络上投放广告，与传统的四大传播媒体（报纸、杂志、电视、广播）广告相比，互联网广告充分利用网络优势，使得广告传播迅速且广泛。通过网络，可以使用某些技术手段获取、挖掘每个IP背后网民的上网习惯、浏览习惯、个人信息等，再根据长期的累计和深度分析来研究用户的偏好，从而可以按照用户的行为特点、兴趣爱好等挑选最匹配的广告信息。数据显示，2016年度中国网络广告市场规模达到2902.7亿元，比2015年同比增长32.9%，可以看到我国互联网广告发展迅速。

剩余内容已隐藏，请支付后下载全文，论文总字数：29880字