修复快速点击下一页按钮点击频率过快时页面跳转到未知名页面

Reviewed-on: http://121.4.94.30:3000/mrlan/EnglishPal/pulls/88

app/Article.py

@@ -1,4 +1,3 @@
-# -*- coding: UTF-8 -*-
 from WordFreq import WordFreq
 from wordfreqCMD import youdao_link, sort_in_descending_order
 from UseSqlite import InsertQuery, RecordQuery
@@ -8,7 +7,7 @@ import random, glob
 import hashlib
 from datetime import datetime
 from flask import Flask, request, redirect, render_template, url_for, session, abort, flash, get_flashed_messages
-from difficulty import get_difficulty_level, text_difficulty_level, user_difficulty_level
+from difficulty import get_difficulty_level_for_user, text_difficulty_level, user_difficulty_level
 
 
 path_prefix = '/var/www/wordfreq/wordfreq/'
@@ -33,17 +32,20 @@ def get_article_body(s):
     return '\n'.join(lst)
 
 
-def get_today_article(user_word_list, existing_articles):
+def get_today_article(user_word_list, visited_articles):
     rq = RecordQuery(path_prefix + 'static/wordfreqapp.db')
-    if existing_articles is None:
-        existing_articles = {
+    if visited_articles is None:
+        visited_articles = {
             "index" : 0,  # 为 article_ids 的索引
             "article_ids": []  # 之前显示文章的id列表，越后越新
         }
-    if existing_articles["index"] > len(existing_articles["article_ids"])-1:
+    if visited_articles["index"] > len(visited_articles["article_ids"])-1:  # 生成新的文章，因此查找所有的文章
         rq.instructions("SELECT * FROM article")
-    else:
-        rq.instructions('SELECT * FROM article WHERE article_id=%d' % (existing_articles["article_ids"][existing_articles["index"]]))
+    else:  # 生成阅读过的文章，因此查询指定 article_id 的文章
+        if visited_articles["article_ids"][visited_articles["index"]] == 'null':  # 可能因为直接刷新页面导致直接去查询了'null'，因此当刷新的页面的时候，需要直接进行“上一篇”操作
+            visited_articles["index"] -= 1
+            visited_articles["article_ids"].pop()
+        rq.instructions('SELECT * FROM article WHERE article_id=%d' % (visited_articles["article_ids"][visited_articles["index"]]))
     rq.do()
     result = rq.get_results()
     random.shuffle(result)
@@ -51,28 +53,36 @@ def get_today_article(user_word_list, existing_articles):
     # Choose article according to reader's level
     d1 = load_freq_history(path_prefix + 'static/frequency/frequency.p')
     d2 = load_freq_history(path_prefix + 'static/words_and_tests.p')
-    d3 = get_difficulty_level(d1, d2)
+    d3 = get_difficulty_level_for_user(d1, d2)
 
     d = None
+    result_of_generate_article = "not found"
     d_user = load_freq_history(user_word_list)
     user_level = user_difficulty_level(d_user, d3)  # more consideration as user's behaviour is dynamic. Time factor should be considered.
     text_level = 0
-    if existing_articles["index"] > len(existing_articles["article_ids"])-1:  # 下一篇
-        flag_get_article = False
+    if visited_articles["index"] > len(visited_articles["article_ids"])-1:  # 生成新的文章
+        amount_of_visited_articles = len(visited_articles["article_ids"])
+        amount_of_existing_articles = result.__len__()
+        if amount_of_visited_articles == amount_of_existing_articles:  # 如果当前阅读过的文章的数量 == 存在的文章的数量，即所有的书本都阅读过了
+            result_of_generate_article = "had read all articles"
+        else:
+            for k in range(3):  # 最多尝试3次
                 for reading in result:
                     text_level = text_difficulty_level(reading['text'], d3)
-            factor = random.gauss(0.8,
-                                  0.1)  # a number drawn from Gaussian distribution with a mean of 0.8 and a stand deviation of 1
-            if reading['article_id'] not in existing_articles["article_ids"] and within_range(text_level, user_level, (8.0 - user_level) * factor):  # 新的文章之前没有出现过且符合一定范围的水平
+                    factor = random.gauss(0.8, 0.1)  # a number drawn from Gaussian distribution with a mean of 0.8 and a stand deviation of 1
+                    if reading['article_id'] not in visited_articles["article_ids"] and within_range(text_level, user_level, (8.0 - user_level) * factor):  # 新的文章之前没有出现过且符合一定范围的水平
                         d = reading
-                existing_articles["article_ids"].append(d['article_id'])  # 列表添加新的文章id；下面进行
-                flag_get_article = True
+                        visited_articles["article_ids"].append(d['article_id'])  # 列表添加新的文章id；下面进行
+                        result_of_generate_article = "found"
                         break
-        if not flag_get_article:
-            existing_articles["index"] -= 1
-    else:  # 上一篇
+                if result_of_generate_article == "found":  # 用于成功找到文章后及时退出外层循环
+                    break
+        if result_of_generate_article != "found":  # 阅读完所有文章，或者循环3次没有找到适合的文章，则放入空（“null”）
+            visited_articles["article_ids"].append('null')
+    else:  # 生成已经阅读过的文章
         d = random.choice(result)
         text_level = text_difficulty_level(d['text'], d3)
+        result_of_generate_article = "found"
 
     today_article = None
     if d:
@@ -87,7 +97,7 @@ def get_today_article(user_word_list, existing_articles):
             "answer": get_answer_part(d['question'])
         }
 
-    return existing_articles, today_article
+    return visited_articles, today_article, result_of_generate_article
 
 
 def load_freq_history(path):

app/Login.py

@@ -1,9 +1,20 @@
-# -*- coding: UTF-8 -*-
 import hashlib
 import string
 from datetime import datetime, timedelta
 from UseSqlite import InsertQuery, RecordQuery
 
+def md5(s):
+    '''
+    MD5摘要
+    :param str: 字符串
+    :return: 经MD5以后的字符串
+    '''
+    h = hashlib.md5(s.encode(encoding='utf-8'))
+    return h.hexdigest()
+
+# import model.user after the defination of md5(s) to avoid circular import
+from model.user import get_user_by_username, insert_user, update_password_by_username
+
 path_prefix = '/var/www/wordfreq/wordfreq/'
 path_prefix = './'  # comment this line in deployment
 
@@ -13,13 +24,9 @@ def verify_pass(newpass,oldpass):
 
 
 def verify_user(username, password):
-    rq = RecordQuery(path_prefix + 'static/wordfreqapp.db')
-    password = md5(username + password)
-    rq.instructions_with_parameters("SELECT * FROM user WHERE name=:username AND password=:password", dict(
-        username=username, password=password))  # the named style https://docs.python.org/3/library/sqlite3.html
-    rq.do_with_parameters()
-    result = rq.get_results()
-    return result != []
+    user = get_user_by_username(username)
+    encoded_password = md5(username + password)
+    return user is not None and user.password == encoded_password
 
 
 def add_user(username, password):
@@ -27,19 +34,12 @@ def add_user(username, password):
     expiry_date = (datetime.now() + timedelta(days=30)).strftime('%Y%m%d') # will expire after 30 days
     # 将用户名和密码一起加密，以免暴露不同用户的相同密码
     password = md5(username + password)
-    rq = InsertQuery(path_prefix + 'static/wordfreqapp.db')
-    rq.instructions_with_parameters("INSERT INTO user VALUES (:username, :password, :start_date, :expiry_date)", dict(
-        username=username, password=password, start_date=start_date, expiry_date=expiry_date))
-    rq.do_with_parameters()
+    insert_user(username=username, password=password, start_date=start_date, expiry_date=expiry_date)
 
 
 def check_username_availability(username):
-    rq = RecordQuery(path_prefix + 'static/wordfreqapp.db')
-    rq.instructions_with_parameters(
-        "SELECT * FROM user WHERE name=:username", dict(username=username))
-    rq.do_with_parameters()
-    result = rq.get_results()
-    return result == []
+    existed_user = get_user_by_username(username)
+    return existed_user is None
 
 
 def change_password(username, old_password, new_password):
@@ -55,35 +55,16 @@ def change_password(username, old_password, new_password):
     # 将用户名和密码一起加密，以免暴露不同用户的相同密码
     if verify_pass(new_password,old_password): #新旧密码一致
         return False
-    password = md5(username + new_password)
-    rq = InsertQuery(path_prefix + 'static/wordfreqapp.db')
-    rq.instructions_with_parameters("UPDATE user SET password=:password WHERE name=:username", dict(
-        password=password, username=username))
-    rq.do_with_parameters()
+    update_password_by_username(username, new_password)
     return True
 
 
 def get_expiry_date(username):
-    rq = RecordQuery(path_prefix + 'static/wordfreqapp.db')
-    rq.instructions_with_parameters(
-        "SELECT expiry_date FROM user WHERE name=:username", dict(username=username))
-    rq.do_with_parameters()
-    result = rq.get_results()
-    if len(result) > 0:
-        return result[0]['expiry_date']
-    else:
+    user = get_user_by_username(username)
+    if user is None:
         return '20191024'
-
-
-def md5(s):
-    '''
-    MD5摘要
-    :param str: 字符串
-    :return: 经MD5以后的字符串
-    '''
-    h = hashlib.md5(s.encode(encoding='utf-8'))
-    return h.hexdigest()
-
+    else:
+        return user.expiry_date
 
 class UserName:
     def __init__(self, username):

app/Yaml.py

@@ -1,4 +1,3 @@
-# -*- coding: UTF-8 -*-
 '''
 Yaml.py
 配置文件包括:

app/account_service.py

@@ -37,7 +37,7 @@ def signup():
                 session[username] = username
                 session['username'] = username
                 session['expiry_date'] = get_expiry_date(username)
-                session['existing_articles'] = None
+                session['visited_articles'] = None
                 return jsonify({'status': '2'})
             else:
                 return jsonify({'status': '1'})
@@ -66,7 +66,7 @@ def login():
             session['username'] = username
             user_expiry_date = get_expiry_date(username)
             session['expiry_date'] = user_expiry_date
-            session['existing_articles'] = None
+            session['visited_articles'] = None
             return jsonify({'status': '1'})
         else:
             return jsonify({'status': '0'})

app/admin_service.py

@@ -91,10 +91,7 @@ def article():
         question = data.get("question", "")
         level = data.get("level", "4")
         if content:
-            try:  # check level
             if level not in ['1', '2', '3', '4']:
-                    raise ValueError
-            except ValueError:
                 return "Level must be between 1 and 4."
             add_article(content, source, level, question)
             _update_context()

app/difficulty.py

@@ -1,4 +1,3 @@
-# -*- coding: UTF-8 -*-
 ###########################################################################
 # Copyright 2019 (C) Hui Lan <hui.lan@cantab.net>
 # Written permission must be obtained from the author for commercial uses.
@@ -9,6 +8,7 @@
 import pickle
 import math
 from wordfreqCMD import remove_punctuation, freq, sort_in_descending_order, sort_in_ascending_order
+import snowballstemmer
 
 
 def load_record(pickle_fname):
@@ -18,40 +18,50 @@ def load_record(pickle_fname):
     return d
 
 
-def difficulty_level_from_frequency(word, d):
-    level = 1
-    if not word in d:
-        return level
+def convert_test_type_to_difficulty_level(d):
+    """
+    对原本的单词库中的单词进行难度评级
+    :param d: 存储了单词库pickle文件中的单词的字典
+    :return:
+    """
+    result = {}
+    L = list(d.keys())  # in d, we have test types (e.g., CET4,CET6,BBC) for each word
 
-    if 'what' in d:
-        ratio = (d['what']+1)/(d[word]+1) # what is a frequent word
-        level = math.log( max(ratio, 1), 2)
+    for k in L:
+        if 'CET4' in d[k]:
+            result[k] = 4  # CET4 word has level 4
+        elif 'OXFORD3000' in d[k]:
+            result[k] = 5
+        elif 'CET6' in d[k] or 'GRADUATE' in d[k]:
+            result[k] = 6
+        elif 'OXFORD5000' in d[k] or 'IELTS' in d[k]:
+            result[k] = 7
+        elif 'BBC' in d[k]:
+            result[k] = 8
 
-    level = min(level, 8) 
-    return level
+    return result  # {'apple': 4, ...}
 
 
-def get_difficulty_level(d1, d2):
-    d = {}
-    L = list(d1.keys())  # in d1, we have freuqence for each word
-    L2 = list(d2.keys()) # in d2, we have test types (e.g., CET4,CET6,BBC) for each word
-    L.extend(L2)
-    L3 = list(set(L)) # L3 contains all words
-    for k in L3:
-        if k in d2:
-            if 'CET4' in d2[k]:
-                d[k] = 4 # CET4 word has level 4
-            elif 'CET6' in d2[k]:
-                d[k] = 6
-            elif 'BBC' in d2[k]:
-                d[k] = 8
-                if k in d1: # BBC could contain easy words that are not in CET4 or CET6.  So 4 is not reasonable.  Recompute difficulty level.
-                    d[k] = min(difficulty_level_from_frequency(k, d1), d[k])
-        elif k in d1:
-            d[k] = difficulty_level_from_frequency(k, d1)
-
-    return d
+def get_difficulty_level_for_user(d1, d2):
+    """
+    d2 来自于词库的35511个已标记单词
+    d1 用户不会的词
+    在d2的后面添加单词，没有新建一个新的字典
+    """
+    # TODO: convert_test_type_to_difficulty_level() should not be called every time.  Each word's difficulty level should be pre-computed.
+    d2 = convert_test_type_to_difficulty_level(d2)  # 根据d2的标记评级{'apple': 4, 'abandon': 4, ...}
+    stemmer = snowballstemmer.stemmer('english')
 
+    for k in d1:  # 用户的词
+        if k in d2:  # 如果用户的词以原型的形式存在于词库d2中
+            continue  # 无需评级，跳过
+        else:
+            stem = stemmer.stemWord(k)
+            if stem in d2:  # 如果用户的词的词根存在于词库d2的词根库中
+                d2[k] = d2[stem]  # 按照词根进行评级
+            else:
+                d2[k] = 3  # 如果k的词根都不在，那么就当认为是3级
+    return d2
 
 
 def revert_dict(d):
@@ -63,9 +73,10 @@ def revert_dict(d):
     for k in d:
         if type(d[k]) is list:  # d[k] is a list of dates.
             lst = d[k]
-        elif type(d[k]) is int: # for backward compatibility.  d was sth like {'word':1}.  The value d[k] is not a list of dates, but a number representing how frequent this word had been added to the new word book. 
+        elif type(d[
+                      k]) is int:  # for backward compatibility.  d was sth like {'word':1}.  The value d[k] is not a list of dates, but a number representing how frequent this word had been added to the new word book.
             freq = d[k]
-            lst = freq*['2021082019'] # why choose this date?  No particular reasons.  I fix the bug in this date.
+            lst = freq * ['2021082019']  # why choose this date?  No particular reasons.  I fix the bug in this date.
 
         for time_info in lst:
             date = time_info[:10]  # until hour
@@ -80,7 +91,8 @@ def user_difficulty_level(d_user, d):
     d_user2 = revert_dict(d_user)  # key is date, and value is a list of words added in that date
     count = 0
     geometric = 1
-    for date in sorted(d_user2.keys(), reverse=True): # most recently added words are more important while determining user's level
+    for date in sorted(d_user2.keys(),
+                       reverse=True):  # most recently added words are more important while determining user's level
         lst = d_user2[date]  # a list of words
         lst2 = []  # a list of tuples, (word, difficulty level)
         for word in lst:
@@ -88,17 +100,17 @@ def user_difficulty_level(d_user, d):
                 lst2.append((word, d[word]))
 
         lst3 = sort_in_ascending_order(lst2)  # easiest tuple first
-        #print(lst3)
+        # print(lst3)
         for t in lst3:
             word = t[0]
             hard = t[1]
-            #print('WORD %s HARD %4.2f' % (word, hard))
+            # print('WORD %s HARD %4.2f' % (word, hard))
             geometric = geometric * (hard)
             count += 1
             if count >= 10:
-                return geometric**(1/count)
+                return geometric ** (1 / count)
 
-    return geometric**(1/max(count,1))
+    return geometric ** (1 / max(count, 1))
 
 
 def text_difficulty_level(s, d):
@@ -106,13 +118,14 @@ def text_difficulty_level(s, d):
     L = freq(s)
 
     lst = []  # a list of tuples, each tuple being (word, difficulty level)
+    stop_words = {'the':1, 'and':1, 'of':1, 'to':1, 'what':1, 'in':1, 'there':1, 'when':1, 'them':1, 'would':1, 'will':1, 'out':1, 'his':1, 'mr':1, 'that':1, 'up':1, 'more':1, 'your':1, 'it':1, 'now':1, 'very':1, 'then':1, 'could':1, 'he':1, 'any':1, 'some':1, 'with':1, 'into':1, 'you':1, 'our':1, 'man':1, 'other':1, 'time':1, 'was':1, 'than':1, 'know':1, 'about':1, 'only':1, 'like':1, 'how':1, 'see':1, 'is':1, 'before':1, 'such':1, 'little':1, 'two':1, 'its':1, 'as':1, 'these':1, 'may':1, 'much':1, 'down':1, 'for':1, 'well':1, 'should':1, 'those':1, 'after':1, 'same':1, 'must':1, 'say':1, 'first':1, 'again':1, 'us':1, 'great':1, 'where':1, 'being':1, 'come':1, 'over':1, 'good':1, 'himself':1, 'am':1, 'never':1, 'on':1, 'old':1, 'here':1, 'way':1, 'at':1, 'go':1, 'upon':1, 'have':1, 'had':1, 'without':1, 'my':1, 'day':1, 'be':1, 'but':1, 'though':1, 'from':1, 'not':1, 'too':1, 'another':1, 'this':1, 'even':1, 'still':1, 'her':1, 'yet':1, 'under':1, 'by':1, 'let':1, 'just':1, 'all':1, 'because':1, 'we':1, 'always':1, 'off':1, 'yes':1, 'so':1, 'while':1, 'why':1, 'which':1, 'me':1, 'are':1, 'or':1, 'no':1, 'if':1, 'an':1, 'also':1, 'thus':1, 'who':1, 'cannot':1, 'she':1, 'whether':1} # ignore these words while computing the artile's difficulty level
     for x in L:
         word = x[0]
-        if word in d:
+        if word not in stop_words and word in d:
             lst.append((word, d[word]))
 
     lst2 = sort_in_descending_order(lst)  # most difficult words on top
-    #print(lst2)
+    # print(lst2)
     count = 0
     geometric = 1
     for t in lst2:
@@ -121,23 +134,19 @@ def text_difficulty_level(s, d):
         geometric = geometric * (hard)
         count += 1
         if count >= 20:  # we look for n most difficult words
-            return geometric**(1/count)
-        
-    return geometric**(1/max(count,1))
+            return geometric ** (1 / count)
 
+    return geometric ** (1 / max(count, 1))
 
 
 if __name__ == '__main__':
-
-
     d1 = load_record('frequency.p')
-    #print(d1)
+    # print(d1)
 
     d2 = load_record('words_and_tests.p')
-    #print(d2)
+    # print(d2)
 
-
-    d3 = get_difficulty_level(d1, d2)
+    d3 = get_difficulty_level_for_user(d1, d2)
 
     s = '''
 South Lawn
@@ -198,7 +207,6 @@ Amidst the aftermath of this shocking referendum vote, there is great uncertaint
 
 '''
 
-
     s = '''
 British Prime Minister Boris Johnson walks towards a voting station during the Brexit referendum in Britain, June 23, 2016. (Photo: EPA-EFE)
 
@@ -219,7 +227,6 @@ The prime minister was forced to ask for an extension to Britain's EU departure
 Johnson has repeatedly pledged to finalize the first stage, a transition deal, of Britain's EU divorce battle by Oct. 31. A second stage will involve negotiating its future relationship with the EU on trade, security and other salient issues.
 '''
 
-
     s = '''
 Thank you very much. We have a Cabinet meeting. We’ll have a few questions after grace. And, if you would, Ben, please do the honors.
 
@@ -234,17 +241,11 @@ We need — for our farmers, our manufacturers, for, frankly, unions and non-uni
 
 '''
 
-
-
-
-    #f = open('bbc-fulltext/bbc/entertainment/001.txt')
+    # f = open('bbc-fulltext/bbc/entertainment/001.txt')
     f = open('wordlist.txt')
     s = f.read()
     f.close()
 
-
-
-    
     print(text_difficulty_level(s, d3))
 
 

app/model/user.py

@@ -1,5 +1,6 @@
 from model import *
 from Login import md5
+from pony import orm
 
 def get_users():
     with db_session:
@@ -11,6 +12,11 @@ def get_user_by_username(username):
         if user:
             return user.first()
 
+def insert_user(username, password, start_date, expiry_date):
+    with db_session:
+        user = User(name=username, password=password, start_date=start_date, expiry_date=expiry_date)
+        orm.commit()
+
 def update_password_by_username(username, password="123456"):
     with db_session:
         user = User.select(name=username)

app/pickle_idea2.py

@@ -68,7 +68,7 @@ def save_frequency_to_pickle(d, pickle_fname):
     d2 = {}
     for k in d:
         if not k in exclusion_lst and not k.isnumeric() and not len(k) < 2:
-            d2[k] = list(sorted(d[k])) # This code sorts the values of the dictionary 'd' associated with the key 'k' and assigns the resulting sorted list to the key 'k' in the dictionary 'd2'. However, it does not remove duplicates from the original list, which means that it keeps track of all counts even when the same value is clicked multiple times in a row.
+            d2[k] = list(sorted(d[k])) # 原先这里是d2[k] = list(sorted(set(d[k])))
     pickle.dump(d2, f)
     f.close()
 

app/static/config.yml

@@ -1,16 +1,17 @@
 # 全局引入的css文件地址
 css:
   item:
-    - static/css/bootstrap.css
+    - ../static/css/bootstrap.css
 
 # 全局引入的js文件地址
 js:
   head: # 在页面加载之前加载
-    - static/js/jquery.js
-    - static/js/word_operation.js
+    - ../static/js/jquery.js
+    - ../static/js/read.js
+    - ../static/js/word_operation.js
   bottom: # 在页面加载完之后加载
-    - static/js/fillword.js
-    - static/js/highlight.js
+    - ../static/js/fillword.js
+    - ../static/js/highlight.js
 
 # 高亮样式，目前仅支持修改颜色
 highlight:

app/static/js/fillword.js

@@ -1,9 +1,5 @@
 let isRead = true;
 let isChoose = true;
-let reader = window.speechSynthesis; // 全局定义朗读者，以便朗读和暂停
-let current_position = 0; // 朗读文本的当前位置
-let original_position = 0; // 朗读文本的初始位置
-let to_speak = ""; // 朗读的初始内容
 
 function getWord() {
     return window.getSelection ? window.getSelection() : document.selection.createRange().text;
@@ -11,7 +7,7 @@ function getWord() {
 
 function fillInWord() {
     let word = getWord();
-    if (isRead) read(word);
+    if (isRead) Reader.read(word, inputSlider.value);
     if (!isChoose) return;
     const element = document.getElementById("selected-words");
     element.value = element.value + " " + word;
@@ -19,50 +15,17 @@ function fillInWord() {
 
 document.getElementById("text-content").addEventListener("click", fillInWord, false);
 
-function makeUtterance(str, rate) {
-    let msg = new SpeechSynthesisUtterance(str);
-    msg.rate = rate;
-    msg.lang = "en-US"; // TODO: add language options menu
-    msg.onboundary = ev => {
-        if (ev.name == "word") {
-            current_position = ev.charIndex;
-        }
-    }
-    return msg;
-}
-
-const sliderValue = document.getElementById("rangeValue"); // 显示值
-const inputSlider = document.getElementById("rangeComponent"); // 滑块元素
+const sliderValue = document.getElementById("rangeValue");
+const inputSlider = document.getElementById("rangeComponent");
 inputSlider.oninput = () => {
-    let value = inputSlider.value; // 获取滑块的值
+    let value = inputSlider.value;
     sliderValue.textContent = value + '×';
-    if (!reader.speaking) return;
-    reader.cancel();
-    let msg = makeUtterance(to_speak.substring(original_position + current_position), value);
-    original_position = original_position + current_position;
-    current_position = 0;
-    reader.speak(msg);
 };
 
-function read(s) {
-    to_speak = s.toString();
-    original_position = 0;
-    current_position = 0;
-    let msg = makeUtterance(to_speak, inputSlider.value);
-    reader.speak(msg);
-}
-
 function onReadClick() {
     isRead = !isRead;
-    if (!isRead) {
-        reader.cancel();
-    }
 }
 
 function onChooseClick() {
     isChoose = !isChoose;
 }
-
-function stopRead() {
-    reader.cancel();
-}

app/static/js/highlight.js

@@ -38,8 +38,18 @@ function highLight() {
         list[i] = list[i].replace('|', "");
         list[i] = list[i].replace('?', "");
         if (list[i] !== "" && "<mark>".indexOf(list[i]) === -1 && "</mark>".indexOf(list[i]) === -1) {
-	    //将文章中所有出现该单词word的地方改为：" <mark>" + word + "<mark> "。 正则表达式RegExp()中，"\\s"代表单词前后必须要有空格，以防止只对单词中的部分字符高亮的情况出现。
-            articleContent = articleContent.replace(new RegExp("\\s"+list[i]+"\\s", "g"), " <mark>" + list[i] + "</mark> ");
+           //将文章中所有出现该单词word的地方改为："<mark>" + word + "<mark>"。 正则表达式RegExp()中，"\\b"代表单词边界匹配。
+
+            //修改代码
+            let articleContent_fb = articleContent;  //文章副本
+            while(articleContent_fb.toLowerCase().indexOf(list[i].toLowerCase()) !== -1 && list[i]!=""){
+                //找到副本中和list[i]匹配的第一个单词(第一种匹配情况),并赋值给list[i]。
+                const index = articleContent_fb.toLowerCase().indexOf(list[i].toLowerCase());
+                list[i] = articleContent_fb.substring(index, index + list[i].length);
+
+                articleContent_fb = articleContent_fb.substring(index + list[i].length);    // 使用副本中list[i]之后的子串替换掉副本
+                articleContent = articleContent.replace(new RegExp("\\b"+list[i]+"\\b","g"),"<mark>" + list[i] + "</mark>");
+            }
         }
     }
     document.getElementById("article").innerHTML = articleContent;

app/static/js/read.js

@@ -0,0 +1,35 @@
+var Reader = (function() {
+    let reader = window.speechSynthesis;
+    let current_position = 0;
+    let original_position = 0;
+    let to_speak = "";
+
+    function makeUtterance(str, rate) {
+        let msg = new SpeechSynthesisUtterance(str);
+        msg.rate = rate;
+        msg.lang = "en-US";
+        msg.onboundary = ev => {
+            if (ev.name == "word") {
+                current_position = ev.charIndex;
+            }
+        }
+        return msg;
+    }
+
+    function read(s, rate) {
+        to_speak = s.toString();
+        original_position = 0;
+        current_position = 0;
+        let msg = makeUtterance(to_speak, rate);
+        reader.speak(msg);
+    }
+
+    function stopRead() {
+        reader.cancel();
+    }
+
+    return {
+        read: read,
+        stopRead: stopRead
+    };
+})();

app/static/js/word_operation.js

@@ -62,6 +62,13 @@ function delete_word(theWord) {
     });
 }
 
+function read_word(theWord) {
+    let to_speak = $("#word_" + theWord).text();
+    original_position = 0;
+    current_position = 0;
+    Reader.read(to_speak, inputSlider.value);
+}
+
 /* 
  * interface Word {
  *   word: string,
@@ -95,6 +102,7 @@ function wordTemplate(word) {
         <a class="btn btn-success" onclick="familiar('${word.word}')" role="button">熟悉</a>
         <a class="btn btn-warning" onclick="unfamiliar('${word.word}')" role="button">不熟悉</a>
         <a class="btn btn-danger" onclick="delete_word('${word.word}')" role="button">删除</a>
+        <a class="btn btn-info" onclick="read_word('${word.word}')" role="button">朗读</a>
     </p>`;
 }
 

app/templates/admin_index.html

@@ -30,7 +30,7 @@
             <div class="collapse navbar-collapse" id="navbarNav">
                 <ul class="navbar-nav">
                     <li class="nav-item">
-                        <a class="nav-link" href="/{{ username }}">返回 {{ username }}</a>
+                        <a class="nav-link" href="/{{ username }}/userpage">返回 {{ username }}</a>
                     </li>
                 </ul>
             </div>

app/templates/admin_manage_user.html

@@ -68,9 +68,9 @@
 <script>
     // 密码生成器
     function generatePassword(length) {
-        var charset = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$%^&*()_+~`|}{[]\:;?><,./-=";
-        var password = "";
-        for (var i = 0; i < length; i++) {
+        const charset = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$%^*()_+~`|}{[]\:;?,./-=";
+        let password = "";
+        for (let i = 0; i < length; i++) {
             password += charset.charAt(Math.floor(Math.random() * charset.length));
         }
         return password;

app/templates/login.html

@@ -22,7 +22,7 @@
                     alert('无法通过验证。');
                     window.location.href = "/login";
                 } else if (response.status === '1') {
-                    window.location.href = "/"+username;
+                    window.location.href = "/"+username+"/userpage";
                 }
             }
         )

app/templates/mainpage_get.html

@@ -23,7 +23,7 @@
     <div class="container-fluid">
         <p><b><font size="+3" color="red">English Pal - Learn English smartly!</font></b></p>
         {% if session['logged_in'] %}
-            <a href="/{{ session['username'] }}">{{ session['username'] }}</a>
+            <a href="/{{ session['username'] }}/userpage">{{ session['username'] }}</a>
             {% if session['username'] == admin_name %}
             <a href="/admin">管理</a></p>
             {% endif %}

app/templates/reset.html

@@ -45,7 +45,7 @@
         <input type="password" placeholder="新密码" class="new-password" name="new-password" id="new-password"/>
         <input type="password" placeholder="确认新密码" class="re-new-password" name="re-new-password" id="re-new-password"/>
         <button id="submit" class="btn" onclick="reset()">提交</button>
-        <button class="btn" onclick="window.location.href='/{{ username }}'">放弃修改</button>
+        <button class="btn" onclick="window.location.href='/{{ username }}/userpage'">放弃修改</button>
 
     </div>
 {% endblock %}

app/templates/signup.html

@@ -35,7 +35,7 @@ You're logged in already! <a href="/logout">Logout</a>.
                     } else if (response.status === '2') {
                         let f = confirm("恭喜，你已成功注册，你的用户名是"+username+'.\n点击“确认”开始使用，或点击“取消”返回首页');
                         if (f) {
-                            window.location.href = '/'+username;
+                            window.location.href = '/'+username+'/userpage';
                         } else {
                             window.location.href = '/';
                         }

app/templates/userpage_get.html

@@ -5,6 +5,8 @@
     <meta name="viewport"
           content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=3.0, user-scalable=yes"/>
     <meta name="format-detection" content="telephone=no"/>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css" rel="stylesheet">
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.bundle.min.js"></script>
 
     {{ yml['header'] | safe }}
     {% if yml['css']['item'] %}
@@ -26,64 +28,111 @@
         }
 
         @keyframes shakes {
-            10%, 90% { transform: translate3d(-1px, 0, 0); }
-            20%, 50% { transform: translate3d(+2px, 0, 0); }
-            30%, 70% { transform: translate3d(-4px, 0, 0); }
-            40%, 60% { transform: translate3d(+4px, 0, 0); }
-            50% { transform: translate3d(-4px, 0, 0); }
+            10%, 90% {
+                transform: translate3d(-1px, 0, 0);
             }
+            20%, 50% {
+                transform: translate3d(+2px, 0, 0);
+            }
+            30%, 70% {
+                transform: translate3d(-4px, 0, 0);
+            }
+            40%, 60% {
+                transform: translate3d(+4px, 0, 0);
+            }
+            50% {
+                transform: translate3d(-4px, 0, 0);
+            }
+        }
+
+        .lead {
+            font-size: 22px;
+            font-family: Helvetica, sans-serif;
+            white-space: pre-wrap;
+        }
+
+        .arrow {
+            padding: 0;
+            font-size: 20px;
+            line-height: 21px;
+            display: inline-block;
+        }
+
+        .arrow:hover {
+            cursor: pointer;
+        }
+
     </style>
 </head>
 <body>
 <div class="container-fluid">
     <p><b>English Pal for <font id="username" color="red">{{ username }}</font></b>
+
         {% if username ==  admin_name %}
             <a class="btn btn-secondary" href="/admin" role="button" onclick="stopRead()">管理</a>
         {% endif %}
-        <a class="btn btn-secondary" href="/logout" role="button" onclick="stopRead()">退出</a>
+        <a id="quit" class="btn btn-secondary" href="/logout" role="button" onclick="stopRead()">退出</a>
         <a class="btn btn-secondary" href="/reset" role="button" onclick="stopRead()">重设密码</a>
-    </p>
-{#    {% for message in flashed_messages %}#} {# 根据user_service.userpage,取消了参数flashed_messages，因此注释了这段代码 #}
-{#        <div class="alert alert-warning" role="alert">Congratulations! {{ message }}</div>#}
-{#    {% endfor %}#}
 
-    <a class="btn btn-success" href="/{{ username }}/reset" role="button"> 下一篇 Next Article </a>
-    {% if session.get('existing_articles') != None and session.get('existing_articles')["index"] !=0 %}
-        <a class="btn btn-success" href="/{{ username }}/back" role="button"> 上一篇 Previous Article </a>
-    {% endif %}
+    </p>
+    {% for message in get_flashed_messages() %}
+        <div class="alert alert-warning alert-dismissible fade show" role="alert">
+            {{ message }}
+            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+        </div>
+    {% endfor %}
+
+    <button class="arrow" id="load_next_article" onclick="load_next_article();Reader.stopRead()"
+            title="下一篇 Next Article">⇨
+    </button>
+    <button class="arrow" id="load_pre_article" onclick="load_pre_article();Reader.stopRead()" style="display: none"
+            title="上一篇 Previous Article">⇦
+    </button>
 
     <p><b>阅读文章并回答问题</b></p>
     <div id="text-content">
-        {% if today_article %}
-            <div class="alert alert-success" role="alert">According to your word list, your level is <span class="badge bg-success">{{ today_article["user_level"] }}</span>  and we have chosen an article with a difficulty level of <span class="badge bg-success">{{ today_article["text_level"] }}</span> for you.</div>
-                <p class="text-muted">Article added on: {{ today_article["date"] }}</p><br/>
-            <div class="p-3 mb-2 bg-light text-dark"><br/>
-            <p class="display-5">{{ today_article["article_title"] }}</p><br/>
-            <p class="lead"><font id="article" size=2>{{ today_article["article_body"] }}</font></p><br/>
-            <p><small class="text-muted">{{ today_article['source'] }}</small></p><br/>
-            <p><b>{{ today_article['question'] }}</b></p><br/>
+        <div id="found">
+            <div class="alert alert-success" role="alert">According to your word list, your level is <span
+                    class="text-decoration-underline" id="user_level">{{ today_article["user_level"] }}</span> and we
+                have chosen an article with a difficulty level of <span class="text-decoration-underline"
+                                                                        id="text_level">{{ today_article["text_level"] }}</span>
+                for you.
+            </div>
+            <p class="text-muted" id="date">Article added on: {{ today_article["date"] }}</p><br/>
+            <div class="p-3 mb-2 bg-light text-dark" style="margin: 0 0.5%;"><br/>
+                <p class="display-6" id="article_title">{{ today_article["article_title"] }}</p><br/>
+                <p class="lead"><font id="article">{{ today_article["article_body"] }}</font></p><br/>
+                <div>
+                    <p><small class="text-muted" id="source">{{ today_article['source'] }}</small></p><br/>
+                </div>
+
+                <p><b id="question">{{ today_article['question'] }}</b></p><br/>
                 <script type="text/javascript">
                     function toggle_visibility(id) { {# https://css-tricks.com/snippets/javascript/showhide-element/#}
                         const e = document.getElementById(id);
-                        if(e.style.display === 'block')
+                        if (e.style.display === 'block')
                             e.style.display = 'none';
                         else
                             e.style.display = 'block';
                     }
                 </script>
                 <button onclick="toggle_visibility('answer');">ANSWER</button>
-                <div id="answer" style="display:none;">{{ today_article['answer'] }}</div><br/>
+                <div id="answer" style="display:none;">{{ today_article['answer'] }}</div>
+                <br/>
             </div>
-        {% else %}
-            <div class="alert alert-success" role="alert">
-                <p class="text-muted"><span class="badge bg-success">Notes:</span><br>No article is currently available for you. You can try again a few times or mark new words in the passage to improve your level.</p>
         </div>
-        {% endif %}
+        <div class="alert alert-success" role="alert" id="not_found" style="display:none;">
+            <p class="text-muted"><span class="badge bg-success">Notes:</span><br>No article is currently available for
+                you. You can try again a few times or mark new words in the passage to improve your level.</p>
+        </div>
+        <div class="alert alert-success" role="alert" id="read_all" style="display:none;">
+            <p class="text-muted"><span class="badge bg-success">Notes:</span><br>You've read all the articles.</p>
+        </div>
     </div>
 
-    <input type="checkbox" onclick="toggleHighlighting()" checked/>生词高亮
-    <input type="checkbox" onclick="onReadClick()" checked/>大声朗读
-    <input type="checkbox" onclick="onChooseClick()" checked/>划词入库
+    <input type="checkbox" id="highlightCheckbox" onclick="toggleHighlighting()"/>生词高亮
+    <input type="checkbox" id="readCheckbox" onclick="onReadClick()"/>大声朗读
+    <input type="checkbox" id="chooseCheckbox" onclick="onChooseClick()"/>划词入库
     <div class="range">
         <div class="field">
             <div class="sliderValue">
@@ -93,10 +142,10 @@
         </div>
     </div>
     <p><b>收集生词吧</b> （可以在正文中划词，也可以复制黏贴）</p>
-    <form method="post" action="/{{ username }}">
+    <form method="post" action="/{{ username }}/userpage">
         <textarea name="content" id="selected-words" rows="10" cols="120"></textarea><br/>
-        <input type="submit" value="把生词加入我的生词库"/>
-        <input type="reset" value="清除"/>
+        <button class="btn btn-primary btn-lg" type="submit" onclick="Reader.stopRead()">把生词加入我的生词库</button>
+        <button class="btn btn-primary btn-lg" type="reset" onclick="clearSelectedWords()">清除</button>
     </form>
     {% if session.get['thisWord'] %}
         <script type="text/javascript">
@@ -124,13 +173,15 @@
                 {% set freq = x[1] %}
                 {% if session.get('thisWord') == x[0] and session.get('time') == 1 %}
                 {% endif %}
-                <p id='p_{{ word }}' class="new-word" >
-                    <a id="word_{{ word }}"  class="btn btn-light" href='http://youdao.com/w/eng/{{ word }}/#keyfrom=dict2.index'
+                <p id='p_{{ word }}' class="new-word">
+                    <a id="word_{{ word }}" class="btn btn-light"
+                       href='http://youdao.com/w/eng/{{ word }}/#keyfrom=dict2.index'
                        role="button">{{ word }}</a>
                     ( <a id="freq_{{ word }}" title="{{ word }}">{{ freq }}</a> )
                     <a class="btn btn-success" onclick="familiar('{{ word }}')" role="button">熟悉</a>
                     <a class="btn btn-warning" onclick="unfamiliar('{{ word }}')" role="button">不熟悉</a>
                     <a class="btn btn-danger" onclick="delete_word('{{ word }}')" role="button">删除</a>
+                    <a class="btn btn-info" onclick="read_word('{{ word }}')" role="button">朗读</a>
                 </p>
             {% endfor %}
         </div>
@@ -143,6 +194,134 @@
         <script src="{{ js }}"></script>
     {% endfor %}
 {% endif %}
+<script type="text/javascript">
+    window.onload = function () { // 页面加载时执行
+        const settings = {
+            // initialize settings from localStorage
+            highlightChecked: localStorage.getItem('highlightChecked') !== 'false', // localStorage stores strings, default to true. same below
+            readChecked: localStorage.getItem('readChecked') !== 'false',
+            chooseChecked: localStorage.getItem('chooseChecked') !== 'false',
+            rangeValue: localStorage.getItem('rangeValue') || '1',
+            selectedWords: localStorage.getItem('selectedWords') || ''
+        };
+
+        const elements = {
+            highlightCheckbox: document.querySelector('#highlightCheckbox'),
+            readCheckbox: document.querySelector('#readCheckbox'),
+            chooseCheckbox: document.querySelector('#chooseCheckbox'),
+            rangeComponent: document.querySelector('#rangeComponent'),
+            rangeValueDisplay: document.querySelector('#rangeValue'),
+            selectedWordsInput: document.querySelector('#selected-words')
+        };
+        // 应用设置到页面元素
+        elements.highlightCheckbox.checked = settings.highlightChecked;
+        elements.readCheckbox.checked = settings.readChecked;
+        elements.chooseCheckbox.checked = settings.chooseChecked;
+        elements.rangeComponent.value = settings.rangeValue;
+        elements.rangeValueDisplay.textContent = `${settings.rangeValue}x`;
+        elements.selectedWordsInput.value = settings.selectedWords;
+
+        // 刷新页面或进入页面时判断，若不是首篇文章，则上一篇按钮可见
+        if (sessionStorage.getItem('pre_page_button') !== 'display' && sessionStorage.getItem('pre_page_button')) {
+            $('#load_pre_article').show();
+        }
+
+        // 事件监听器
+        elements.selectedWordsInput.addEventListener('input', () => {
+            localStorage.setItem('selectedWords', elements.selectedWordsInput.value);
+        });
+
+        elements.rangeComponent.addEventListener('input', () => {
+            const rangeValue = elements.rangeComponent.value;
+            elements.rangeValueDisplay.textContent = `${rangeValue}x`;
+            localStorage.setItem('rangeValue', rangeValue);
+        });
+    };
+
+    function clearSelectedWords() {
+        localStorage.removeItem('selectedWords');
+        document.querySelector('#selected-words').value = '';
+    }
+
+
+    function load_next_article() {
+        $("#load_next_article").prop("disabled", true)
+        $.ajax({
+            url: '/get_next_article/{{username}}',
+            dataType: 'json',
+            success: function (data) {
+                // 更新页面内容
+                if (data['today_article']) {
+                    update(data['today_article']);
+                    check_pre(data['visited_articles']);
+                    check_next(data['result_of_generate_article']);
+                }
+            }, complete: function (xhr, status) {
+                $("#load_next_article").prop("disabled", false)
+            }
+        });
+    }
+
+    function load_pre_article() {
+        $.ajax({
+            url: '/get_pre_article/{{username}}',
+            dataType: 'json',
+            success: function (data) {
+                // 更新页面内容
+                if (data['today_article']) {
+                    update(data['today_article']);
+                    check_pre(data['visited_articles']);
+                }
+            }
+        });
+    }
+
+    function update(today_article) {
+        $('#user_level').html(today_article['user_level']);
+        $('#text_level').html(today_article["text_level"]);
+        $('#date').html('Article added on: ' + today_article["date"]);
+        $('#article_title').html(today_article["article_title"]);
+        $('#article').html(today_article["article_body"]);
+        $('#source').html(today_article['source']);
+        $('#question').html(today_article["question"]);
+        $('#answer').html(today_article["answer"]);
+        document.querySelector('#text_level').classList.add('mark'); // highlight text difficult level for 2 seconds
+        setTimeout(() => {
+            document.querySelector('#text_level').classList.remove('mark');
+        }, 2000);
+        document.querySelector('#user_level').classList.add('mark'); // do the same thing for user difficulty level
+        setTimeout(() => {
+            document.querySelector('#user_level').classList.remove('mark');
+        }, 2000);
+    }
+
+    <!-- 检查是否存在上一篇或下一篇，不存在则对应按钮隐藏-->
+    function check_pre(visited_articles) {
+        if ((visited_articles == '') || (visited_articles['index'] <= 0)) {
+            $('#load_pre_article').hide();
+            sessionStorage.setItem('pre_page_button', 'display')
+        } else {
+            $('#load_pre_article').show();
+            sessionStorage.setItem('pre_page_button', 'show')
+        }
+    }
+
+    function check_next(result_of_generate_article) {
+        if (result_of_generate_article == "found") {
+            $('#found').show();
+            $('#not_found').hide();
+            $('#read_all').hide();
+        } else if (result_of_generate_article == "not found") {
+            $('#found').hide();
+            $('#not_found').show();
+            $('#read_all').hide();
+        } else {
+            $('#found').hide();
+            $('#not_found').hide();
+            $('#read_all').show();
+        }
+    }
+</script>
 </body>
 <style>
     mark {

app/test/test_next_article.py

@@ -0,0 +1,85 @@
+''' Contributed by Lin Junhong et al. 2023-06.'''
+
+from selenium import webdriver
+from selenium.webdriver.common.desired_capabilities import DesiredCapabilities
+
+from selenium.webdriver.support.ui import WebDriverWait
+from selenium.webdriver.support import expected_conditions as EC
+from selenium.common.exceptions import UnexpectedAlertPresentException, NoAlertPresentException
+import random, time
+import string
+
+# 初始化webdriver
+# driver = webdriver.Remote('http://localhost:4444/wd/hub', DesiredCapabilities.CHROME)
+# driver.implicitly_wait(10)
+driver = webdriver.Chrome("C:\\Users\\12993\AppData\Local\Programs\Python\Python38\\chromedriver.exe")
+
+
+def test_next_article():
+    try:
+        driver.get("http://118.25.96.118:90")
+        assert 'English Pal -' in driver.page_source
+        # login
+        elem = driver.find_element_by_link_text('登录')
+        elem.click()
+
+        uname = 'abcdefg'
+        password = 'abcdefg'
+        elem = driver.find_element_by_id('username')
+        elem.send_keys(uname)
+
+        elem = driver.find_element_by_id('password')
+        elem.send_keys(password)
+        elem = driver.find_element_by_xpath('/html/body/div/button')  # 找到登录按钮
+        elem.click()
+
+        time.sleep(0.5)
+        assert 'EnglishPal Study Room for ' + uname in driver.title
+        for i in range(50):
+            time.sleep(0.1)
+            # 找到固定按钮
+            elem = driver.find_element_by_xpath('//*[@id="load_next_article"]')
+            elem.click()
+    except Exception as e:
+        print(e)
+
+
+def test_local_next_article():
+    try:
+        driver.get("http://127.0.0.1:5000")
+        assert 'English Pal -' in driver.page_source
+        # login
+        elem = driver.find_element_by_link_text('注册')
+        elem.click()
+
+        uname = 'abcdefg'
+        password = 'abcdefg'
+        elem = driver.find_element_by_id('username')
+        elem.send_keys(uname)
+
+        elem = driver.find_element_by_id('password')
+        elem.send_keys(password)
+
+        elem = driver.find_element_by_id('password2')
+        elem.send_keys(password)
+
+        time.sleep(0.5)
+
+        elem = driver.find_element_by_class_name('btn')  # 找到提交按钮
+        elem.click()
+        time.sleep(0.5)
+        try:
+            WebDriverWait(driver, 1).until(EC.alert_is_present())
+            driver.switch_to.alert.accept()
+        except (UnexpectedAlertPresentException, NoAlertPresentException):
+            pass
+
+        time.sleep(0.5)
+        assert 'EnglishPal Study Room for ' + uname in driver.title
+        for i in range(50):
+            time.sleep(0.1)
+            # 找到固定按钮
+            elem = driver.find_element_by_xpath('//*[@id="load_next_article"]')
+            elem.click()
+    except Exception as e:
+        print(e)

app/user_service.py

@@ -21,36 +21,46 @@ userService = Blueprint("user_bp", __name__)
 path_prefix = '/var/www/wordfreq/wordfreq/'
 path_prefix = './'  # comment this line in deployment
 
-
-@userService.route("/<username>/reset", methods=['GET', 'POST'])
-def user_reset(username):
-    '''
-    用户界面
-    :param username: 用户名
-    :return: 返回页面内容
-    '''
+@userService.route("/get_next_article/<username>",methods=['GET','POST'])
+def get_next_article(username):
+    user_freq_record = path_prefix + 'static/frequency/' + 'frequency_%s.pickle' % (username)
+    session['old_articleID'] = session.get('articleID')
     if request.method == 'GET':
-        existing_articles = session.get("existing_articles")
-        existing_articles["index"] += 1
-        session["existing_articles"] = existing_articles
-        return redirect(url_for('user_bp.userpage', username=username))
+        visited_articles = session.get("visited_articles")
+        if visited_articles['article_ids'][-1] == "null":  # 如果当前还是“null”，则将“null”pop出来,无需index+=1
+            visited_articles['article_ids'].pop()
+        else:  # 当前不为“null”，直接 index+=1
+            visited_articles["index"] += 1
+        session["visited_articles"] = visited_articles
+        visited_articles, today_article, result_of_generate_article = get_today_article(user_freq_record, session.get('visited_articles'))
+        data = {
+            'visited_articles': visited_articles,
+            'today_article': today_article,
+            'result_of_generate_article': result_of_generate_article
+        }
     else:
         return 'Under construction'
+    return json.dumps(data)
 
-@userService.route("/<username>/back", methods=['GET'])
-def user_back(username):
-    '''
-    用户界面
-    :param username: 用户名
-    :return: 返回页面内容
-    '''
+@userService.route("/get_pre_article/<username>",methods=['GET'])
+def get_pre_article(username):
+    user_freq_record = path_prefix + 'static/frequency/' + 'frequency_%s.pickle' % (username)
     if request.method == 'GET':
-        existing_articles = session.get("existing_articles")
-        existing_articles["index"] -= 1
-        session["existing_articles"] = existing_articles
-        return redirect(url_for('user_bp.userpage', username=username))
-
-
+        visited_articles = session.get("visited_articles")
+        if(visited_articles["index"]==0):
+            data=''
+        else:
+            visited_articles["index"] -= 1  # 上一篇，index-=1
+            if visited_articles['article_ids'][-1] == "null":  # 如果当前还是“null”，则将“null”pop出来
+                visited_articles['article_ids'].pop()
+            session["visited_articles"] = visited_articles
+            visited_articles, today_article, result_of_generate_article = get_today_article(user_freq_record, session.get('visited_articles'))
+            data = {
+                'visited_articles': visited_articles,
+                'today_article': today_article,
+                'result_of_generate_article':result_of_generate_article
+            }
+        return json.dumps(data)
 
 @userService.route("/<username>/<word>/unfamiliar", methods=['GET', 'POST'])
 def unfamiliar(username, word):
@@ -97,7 +107,7 @@ def deleteword(username, word):
     return "success"
 
 
-@userService.route("/<username>", methods=['GET', 'POST'])
+@userService.route("/<username>/userpage", methods=['GET', 'POST'])
 def userpage(username):
     '''
     用户界面
@@ -134,8 +144,8 @@ def userpage(username):
         words = ''
         for x in lst3:
             words += x[0] + ' '
-        existing_articles, today_article = get_today_article(user_freq_record, session.get('existing_articles'))
-        session['existing_articles'] = existing_articles
+        visited_articles, today_article, result_of_generate_article = get_today_article(user_freq_record, session.get('visited_articles'))
+        session['visited_articles'] = visited_articles
         # 通过 today_article，加载前端的显示页面
         return render_template('userpage_get.html',
                                admin_name=ADMIN_NAME,
@@ -143,15 +153,12 @@ def userpage(username):
                                session=session,
                                # flashed_messages=get_flashed_messages(), 仅有删除单词的时候使用到flash，而删除单词是异步执行，这里的信息提示是同步执行，所以就没有存在的必要了
                                today_article=today_article,
+                               result_of_generate_article=result_of_generate_article,
                                d_len=len(d),
                                lst3=lst3,
                                yml=Yaml.yml,
                                words=words)
 
-
-
-
-
 @userService.route("/<username>/mark", methods=['GET', 'POST'])
 def user_mark_word(username):
     '''

app/wordfreqCMD.py

@@ -1,4 +1,3 @@
-# -*- coding: UTF-8 -*-
 ###########################################################################
 # Copyright 2019 (C) Hui Lan <hui.lan@cantab.net>
 # Written permission must be obtained from the author for commercial uses.
@@ -40,7 +39,7 @@ def file2str(fname):#文件转字符
 
 
 def remove_punctuation(s): # 这里是s是形参 (parameter)。函数被调用时才给s赋值。
-    special_characters = '\_©~<=>+-/[]*&$%^@.,?!:;#()"“”—‘’{}|' # 把里面的字符都去掉
+    special_characters = '\_©~<=>+/[]*&$%^@.,?!:;#()"“”—‘’{}|' # 把里面的字符都去掉
     for c in special_characters:
         s = s.replace(c, ' ') # 防止出现把 apple,apple 移掉逗号后变成 appleapple 情况
     s = s.replace('--', ' ')

requirements.txt

@@ -1,4 +1,8 @@
-Flask==1.1.2
+Flask==2.0.3
 selenium==3.141.0
 PyYAML~=6.0
 pony==0.7.16
+snowballstemmer==2.2.0
+Werkzeug==2.2.2
+
+pytest~=8.1.1