【EnglishPal代码重构】

优化功能：点击“上一篇”“下一篇”按钮时使用Ajax更新页面，而不是每次刷新页面。

一、原执行过程

超链接调用视图函数

1.web层 userpage_get.html

<a id="next_btn" class="btn btn-success" href="/{{ username }}/reset" role="button"> 下一篇 Next Article </a>
<a id="pre_btn" class="btn btn-success" href="/{{ username }}/back" role="button"> 上一篇 Previous Article </a>

2.service层 user_service.py

视图函数修改session，重定向调用userpage(username)方法。

重定向调用userpage方法,获得文章数据，传变量到模板中，然后在render_template中通过关键词参数的方式传递过去，渲染模板页面。

···
···

3.加载前端模板页面并渲染，userpage_get.html

文章内容通过{{模板变量}}显示

二、重构(第一阶段)

1.超链接->引入javasript，调用函数（userpage_get.html）

点击“下一篇”或“上一篇”按钮时，不再使用超链接调用视图函数，而是调用load_next_article()和load_pre_article()函数，利用Ajax传输数据（文章内容），动态更新模板数据。
userpage_get.html

2.(user_service.py)视图函数直接调用Activity.py中的get_today_article函数，获得数据，封装成json格式，传递回模板页面

3.成功返回data，动态更新页面(userpage_get.html)

三、重构（第二阶段）：解决按钮何时隐藏，何时显示问题

1.每次动态更新页面后检查是否存在上一篇，如果当前是第一篇浏览的文章，不存在上一篇文章时，隐藏按钮；不存在下一篇包含当前没有适合用户水平的文章或文章已经阅读完两种情况，以result_of_generate_article的值区分。

2.第一次访问页面时，“上一篇”按钮虽然存在但点击无效，不影响。

在视图函数新增代码段，当前是第一篇文章时，不实现后续功能，无响应。

四、代码审查

存在重复代码块，代码冗余

优化：将重复代码块封装成函数