根本需要
前端局部:
1、拜访地址为:http://website/zrpd?useid=1234,其中 userid 是用户标识,页面须要依据不同的标识值返回不同的信息。
(1) 如果该 userid 字段不存在,或者该 userid 在后端不存在,则整个页面提醒:您输出的拜访地址有效,请从新输出。
(2) 如果 userid 和访问者的 ip 不对应,则整个页面提醒:您无权限拜访该地址,请从新输出。
2、页面的 UI 设计为单页面,无跳转,具体设计如下:
整个页面分为两个区域,一个区域为通过单词搜寻(残缺的单词),一个区域为通过音素搜寻(字母或字母组合),互不烦扰,互相独立。未搜寻前,下方显示为空。
3、单词搜寻区搜寻进去的单词,分段赋予色彩显示,比方 department,分为三段,de、part、ment,每一段用一种色彩,色彩应用的程序为(红绿橙蓝紫,超过 5 个字段,则循环这 5 个色彩):字段 1 字段 2 字段 3 字段 4 字段 5,例句中该单词用红色标出。
4、音素搜寻区搜寻进去的单词,色彩显示同单词搜寻区搜寻进去的单词,除此之外,还须要额定在搜寻的音素下方画横线标出。
5、点击搜寻按钮时,不整体刷新,后盾返回数据后,仅刷新显示区域。
6、点击喇叭图片能够播放声音,播放声音时,喇叭图片有动效。
7、单词图片点击能够放大,放大后右上角有叉号,点击能够敞开放大的图片。
后端局部:
1、以 json 字符串或 xml 等作为数据源文件,具体格局能够依照不便编程和提高效率来设计。
2、通过单词搜寻(大略有 3000 个单词)和通过音素(大略有 100 个音素)搜寻,设计两个独立的数据源文件,数据源在启动后加载到内存,无需每次搜寻时从新加载,如批改数据源文件,须要重启后盾服务能力失效。
3、userid 须要设计一个独立的数据源文件,每次页面拜访均需检索数据源文件,做到批改了数据源文件,即刻失效,无需重启后盾服务。每一个 userid 对应一个字符串(用于在页面上显示),一个 ip 地址列表(用于校验非法的拜访 ip 地址,0.0.0.0 代表所有地址均非法)。
编程语言
html+css+js+ajax+springboot+json
环境与工具
开发工具:hbuilderx、idea、json
开发环境:jdk
实现思路
1. 前端:应用前端三件套,灵便布局和渲染页面,次要技术点在于 js 的使用,应用 ajax 申请后端数据,以及管制、监听音频的播放暂停等。
2. 后端:应用传统的 web 开发思路,编写页面申请数渲染,采纳 json 模式的数据库,单词、音素、以及账号零碎都应用 json 建设独立的数据结构,响应给前端动静渲染到页面上。
3. 数据库:应用的是 json 文件保留 json 模式的数据,且 json 文件能够部署在 tomcat 或者本地。
成果展现
看完技术大佬们的解题思路,有没有学到什么呢?想要做兼职的小伙伴能够加咱们哦!