结对第二次作业--编程实现

022000232沈向炜学生 2023-03-24 22:29:35

2023春软件工程实践	2023年福大-软件工程实践-W班社区-CSDN社区云
这个作业要求在哪里	结对第二次作业
这个作业的目标	用web技术实现结对作业一的原型网站并部署在云服务器上
其他参考文献	构建之法，澳大利亚网球公开赛官网

// 返回每日赛程数据
public class ResultServlet extends HttpServlet{
    protected void doGet(HttpServletRequest request, HttpServletResponse response) {...}
}
// 返回晋级图数据
public class DrawServlet extends HttpServlet {
    protected void doGet(HttpServletRequest request, HttpServletResponse response) {...}
}

数据获取: 打开浏览器开发者工具的网络模块去刷新官网页面，发现晋级图和每日赛程的数据分别来自于draws和result文件，将其另存为json文件。【爬取行为仅用于教学行为】

JSON数据读取：使用StringBuilder和BuffereReader来拼接Json字符串

    public static String readJson(String jsonFilePath) throws FileNotFoundException,IOException{
        StringBuilder data=new StringBuilder();
        .......
        InputStream file=new FileInputStream(jsonFilePath);
        BufferedReader reader=new BufferedReader(new InputStreamReader(file,StandardCharsets.UTF_8));
            while((tem=reader.readLine())!=null){
            data.append(tem);
        }
        reader.close();
        return data.toString();
    }

Servlet设计

通过getParameter获取url传来的参数再使用Lib获取json数据并用response对象返回

@WebServlet(name = "DrawsServlet", value = "/draws")
public class DrawsServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        String date = request.getParameter("type");
        String result = Lib.getDraw(date);
        response.setContentType("text/html");
        response.setCharacterEncoding("UTF-8");
        PrintWriter out = response.getWriter();
        out.print(result);
        out.flush();
        out.close();
    }
}

Lib接口设计(以晋级图为例)

Servlet获取数据的的大致逻辑顺序：

getDraw(type) Servlet调用这个接口并传入比赛类型，最后返回格式化的json数据
readPlayer()读取选手信息为后续做准备
readJson( jsonFilePath) 将比赛类型与存放数据的地址拼接形成jsonFilePath来读取Json字符串
readDraws(String type) 读取json文件提取一类比赛晋级图信息 ,因为json结构复杂，解析单个比赛信息的实现在getAODraw（)
getAODraws(type) 在readDraw()中调用，输入解析完一层的json数据来进一步解析最后返回Draws对象
getPlayerName(): 因为获取队伍中选手信息要跟选手清单有关联，由这里方法负责
String returnJson(Obj)：当所有数据都实例化为对象时，用Gson序列化为Json字符串并封装成标准的格式

public static String readJson(String jsonFilePath) throws FileNotFoundException,IOException{...}
//将数据转为json并格式化json
public static String public static String returnJson(Object a){...}(Object a){...}
//从json文件提取全部选手信息
public static void readPlayer() throws IOException{}
//从json文件提取一类比赛晋级图信息
public static void readDraws(String type) throws IOException{....}
//从json节点中提取单个晋级信息
public static AODraws getAODraw(Map<String, Object> a) throws IOException{...}
//从json节点中提取选手全名
public  static String  getPlayerName(String team_id) {....}
//获取一种比赛的晋级图并打包成格式化json数据
public static String getDraw(String type) throws IOException{...}

3.3 云服务器部署

云服务部署在阿里云服务器，利用Xshell+XFTP在ssh连接配置环境后再用宝塔面板在服务器上部署网站。

3.4 问题与解决

3.4.1 前端

晋级图的页面比较复杂，不知道怎么做出官网类似的效果，晋级选手间的连线难以完成，最后选择不要比赛场次间的连线。
每场比赛的json数据中比分数据是按每局分的，但是前端页面中的比分数据是按照选手划分的，解决方法是把每场的比分分割成两个比分的数组，然后把每场比赛的两个数组拼接在一起形成全部比赛的比分数组，在前端显示时按照奇数偶数的规律显示每个选手的比分。
每日比赛的前端页面仿照官网页面实现，但是获得的数据没有按照比赛地点分类，是一场场比赛的JSON对象，解决方法是在接受数据的时候对数据进行遍历，用map对象将每个比赛地点作为key，value是一个数组用来保存这个比赛地点的所有比赛。
vue项目打包时会出现devServerProxy失效产生跨域的问题，解决方法是和后端协商在后端响应中加上相应字段。

3.4.2 后端

在不同运行配置下，读取文件时经常会因为运行路径不同导致文件找不到。因为本次项目代码没有迁移和复用的需求，所以只要采用绝对路径的写法就绝对不会出错，最后在程序中加入分支判断，根据操作系统不同给出本地和运程的数据存放地址。
Servlet在本地运行正常，在服务器部署上后程序在访问/root/data/players.json时报FileNotFoundException异常。网络上的答案都是要么路径错误要么文件夹权限不够，我排查了一下午无果后，只能准备更换技术实现方案重新写。但在我建好新的框架时突然想到是不是因为root目录权限比较特殊，在更换存放目录后成功解决。

4. 成果展示

1.了解澳网

2.选手排名

3.晋级图

4.每日赛程

5. PSP表格

PSP	Personal Software Process Stages	预估耗时（分钟）	实际耗时（分钟）
Planning	计划	15	15
• Estimate	• 估计这个任务需要多少时间	15	15
Development	开发	2100	2995
• Discuss	• 讨论交流(框架、工具的选择)	120	120
• Analysis	• 需求分析(学习web框架)	540	480
•Deciding Code Style	•制定代码规范	10	10
•Design	•代码设计	60	120
•Coding	•编码	700	1000
•Test	•测试	150	300
•Deploying	•云服务器部署	120	240
Reporting	报告	200	350
• Reporting	• 撰写博客	120	240
• Size Measurement	• 计算工作量	20	15
• Postmortem & Process Improvement Plan	• 事后总结	60	120
	合计	2115	3010

6. 结对心得

6.1 对方评价

022000232：吴子隆同学非常可靠，在这次结对作业开始我对Web技术只知道前端三件套和PHP，遇到这么复杂的需求我以为做不完，他主动承接下任务量大的前端工作并直接写一份接口需求文档，写清楚后端接受的url格式以及需要返回json数据的字段，多亏他的文档，让我的工作和技术路线一下子就清晰了。
171909059：沈向炜同学工作效率很高，对于复杂工作任务很有信心，很困难的工作也能顺利完成，学习新技术的速度很快，对于不熟悉的技术也能很快学会并应用到开发当中，接口设计能很好的按照接口文档实现。

6.2 结队心得

022000232：

DeadLine是第一生产力。每周软件工程实践作业总是能让我学到新知识，在大一我就试过Git工具，之前一直没搞明白。在之前几次作业中因为怕麻烦，一直都是用GitCode网站上的上传按钮传文件，这次因为需要团队协作的DDL逼迫下，我搞懂了两三年都没玩明白的git。
善于使用开发工具，第一次主动使用框架进行开发加上电脑之前重装过，这次需要配置很多东西。想起来上学期安卓开发的时候绝大部分环境都可以用AndroidStudio安装的。这次就试着用IDEA的快速修复和Maven库等功能解决了很多问题，不仅下载速度比官网快而且省去了大量的安装和配置的时间。另外IDEA的版本控制功能的图像化用起来比git方便很多。
学会独立思考去解决环境问题。之前在安装某个环境或者环境跳出莫名其妙的问题的时候，我第一反应都是百度找博客，然后盲目跟着博客一步一步解决，但是由于自身机器环境不同经常会出现各种各样的错误，往往需要花很长时间去修复。在这次结对过程中，由于我实在受不了繁琐的解决方式，我索性就先去学习和整理IDEA的项目管理以及环境变量和运行路径等知识，然后不断试错尝试去了解其中的机制靠独立思考解决了问题，最后发现花的时间比盲目听从博客的建议快上很多而且更有收获感。

171909059：项目的开发和项目部署存在差异，很多问题在开发环境中不会出现而到部署环境中就会出现，这种问题比较难解决。前后端分工的工作中对接口的定义非常重要，好的接口文档可以让前后端的工作量都大大降低。

...全文