目录

一、前言

二、项目的相关背景 

⚡什么是Boost库？⚡ 

⚡什么是搜索引擎？⚡

⚡为什么要做Boost搜索引擎？⚡

二、搜索引擎的宏观原理 

三、搜索引擎技术栈和项目环境 

四、正排索引 VS 倒排索引 —— 搜索引擎的具体原理 

💢正排索引（forword index） 

💢倒排索引（inverted index） 

💢搜索引擎的具体原理 

五、编写数据去除标签和数据清洗模块 Parser 

1. 数据准备 

2. 编写parser模块 

🍍基本结构设计 

🍑细节实现

六、编写建立索引的模块 Index 

💧节点设计💧

💧基本结构设计💧 

🍇Index类的基本框架  

🥝获取正排索引（GetForwardIndex） 

🍉获取倒排拉链（GetInvertedList） 

🍈 构建索引（BuildIndex）

🍓构建正排索引（BuildForwardIndex）

🍋倒排索引的原理介绍 (重点！！)

🍒cppjieba分词工具的安装和使用介绍 

🍐引入cppjieba到项目中 

🍌构建倒排索引（BuildInvertedIndex）

七、编写搜索引擎模块 Searcher 

🔥基本结构🔥

🔥初始化服务（InitSearcher）

1. Index模块的单例设计 

2. 编写InitSearcher

🔥提供服务（Search）

         1.  对用户关键字进行分词

2.  触发分词，进行索引查找 

3.  按文档权重进行降序排序 

4.  根据排序结果构建json串 

八、编写http_server模块 

1. 引入cpp-httplib到项目中  

2. cpp-httplib的使用介绍 

3. 正式编写http_server

九、添加日志到项目中 

十、编写前端模块 

十一、项目总结

🔥项目的总体框架和功能🔥

🔥技术栈和项目环境🔥 

🔥 gitee代码地址🔥

十二、共勉 

---

一、前言

        我们平时在用浏览器搜索时，服务器给我们返回的分别是跟搜索关键字相关的一个个网站信息，网站信息分别包括网站的标题，网站内容的简述，和该网站的url。在点击标题后，会跳转到对应链接的页面。平时我们用的搜索引擎，比如说百度，谷歌等等，他们都是搜索全网的信息的，我们项目做的是一个小范围的搜索引擎，一个用 boost库 实现的 boost站内搜索。

二、项目的相关背景 

⚡什么是Boost库？⚡ 

 Boost库 是C++的准标准库， 它提供了很多C++没有的功能，可以称之为是C++的后备力量。早期的开发者多为C++标准委员会的成员，一些Boost库也被纳入了C++11中（如：哈希、智能指针）；这里大家可以去百度百科上搜索，一看便知。下面是boost的官网： 
-------------------Boost官网链接

 ⚡什么是搜索引擎？⚡

对于搜索引擎，相信大家一定不陌生，如：百度、360、搜狗等，都是我们常用的搜索引擎。但是你想自己实现出一个和百度、360、搜狗一模一样哪怕是类似的搜索引擎，是非常非常困难的。我们可以看一下这些搜索引擎在搜索关键字的时候，给我们展示了哪些信息： 

我们可以看到，基本上搜索引擎根据我们所给的关键字，搜出来的结果展示都是以，网页标题、网页内容摘要和跳转的网址组成的。但是它可能还有相应的照片、视频、广告，这些我们在设计基于Boost库的搜索引擎项目的时候，不考虑这些，它们属于扩展内容； 

⚡为什么要做Boost搜索引擎？⚡

 刚刚我们看到了Boost的官网界面，我们可以对比一下cplusplus官网，看看有什么区别

        可以看到，Boost库是没有站内搜索框的，如果我们可以对boost库做一个站内搜索，向cplusplus一样，搜索一个关键字，就能够跳转到指定的网页，并显示出来。那么这个项目还是具有一定意义的。这也就是项目的背景。

        其次，站内搜索的数据更加垂直，数据量其实更小。

二、搜索引擎的宏观原理 

刚刚我们介绍完了基于Boost库的搜索引擎的项目背景后，相信大家有了一定的了解，大致上知道了这个项目是什么意思。但是我们还需要了解一下搜索引擎的宏观原理。接下来以下面的图为例，介绍一下其宏观原理。 

原理图分析：

我们要实现出boost库的站内搜索引擎，红色虚线框内就是我们要实现的内容，总的分为客户端和服务器，详细分析如下：

1️⃣：客户端 想要获取到大学生的相关信息（呈现在网页上的样子就是：网页的标题+摘要+网址），首先我们构建的服务器就要有对应的数据存在，这些数据从何而来，我们可以进行全网的一个爬虫，将数据爬到我们的服务器的磁盘上，但是我们这个项目是不涉及任何爬虫程序的，我们可以直接将 boost库 对应版本的数据直接解压到我们对应文件里。

2️⃣：现在数据已经被我们放到了磁盘中了，接下来客户端要访问服务器，那么服务器首先要运行起来，服务器一旦运行起来，它首先要做的工作就是对磁盘中的这些数据进行去标签和数据清洗的动作，因为我们从boost库拿的数据其实就是对应文档html网页，但是我们需要的只是每个网页的标题+网页内容摘要+跳转的网址，所以才有了去标签和数据清洗（只拿我们想要的）。这样就可以直接跳过网址跳转到boost库相应文档的位置。

3️⃣：服务器完成了去标签和数据清洗之后，就需要对这些清洗后的数据建立索引（方便客户端快速查找）；

4️⃣：当服务器所以的工作都完成之后，客户端就发起http请求，通过GET方法，上传搜索关键，服务器收到了会进行解析，通过客户端发来的关键字去检索已经构建好的索引，找到了相关的html后，就会将逐个的将每个网页的标题、摘要和网址拼接起来，构建出一个新的网页，响应给客户端；至此，客户就看到了相应的内容，点击网址就可以跳转到boost库相应的文档位置。

---

三、搜索引擎技术栈和项目环境 

基于Boost库的搜索引擎项目所涉及的 技术栈 和 项目环境 如下： 

技术栈： 

• C/C++/C++11、STL、boost库、Jsoncpp、cppjieba、cpp-httplib
• html5、css、js、jQuery、Ajax

项目环境： 

• Ubuntu 20.04 云服务器
• vim/gcc/g++/Makefile
• vs2022 or vscode

相关库： 

• cppjieba： 提供分词的相关接口
• boost： 提供在当前目录下遍历所有子目录文件的迭代器
• Jsoncpp： 提供可以将格式化的数据和 json 字符串相互转换的接口
• cpp-httplib： 提供http相关接口

技术栈和项目环境，有些你可能不了解，没关系，下面的代码编写中会有介绍，但是基本的技术栈：C/C++/C++11/STL 你是要熟悉的；项目环境 ：云服务器、vim、vs这些你也是需要知道的。 

四、正排索引 VS 倒排索引 —— 搜索引擎的具体原理 

通过下面两个文档来解释一下 正排索引 和 倒排索引  

文档ID 文档内容 1 雷军买了四斤小米 2 雷军发布了小米汽车

💢正排索引（forword index） 

正排索引：就是从【文档ID】找到 【文档内容】(文档内的关键字) 

• 正排索引 是创建 倒排索引 的基础，有了正排索引之后，如何构建倒排索引呢？ -- 分词
• 分词的目的：方便建立 倒排索引 和 查找 

我们要对目标文档进行【分词】，以上面的文档1、2为例，我们来进行分词演示： 

• 文档1：雷军、买、四斤、小米、四斤小米
• 文档2：雷军、发布、小米、汽车、小米汽车

 进行分词之后，就能够方便的建立倒排索引和查找。

• 我们可以看到，在文档1、2中，其中的 “了” 子被我们省去了，这是因为像：了，呢，吗 ，a，the 等都是属于停止词，一般我们在分词的时候可以不考虑。那么什么是停止词呢？ 

停止词： 它是搜索引擎分词的一项技术，停止词就是没有意义的词。如：在一篇文章中，你可以发现有很多类似于了，呢，吗 ，a，the等（中文或英文中）都是停止词，因为频繁出现，如果我们在进行分词操作的时候，如果把这些停止词也算上，不仅会建立索引麻烦，而且会增加精确搜索的难度。 

💢倒排索引（inverted index） 

刚刚我们说 正排索引 是 创建 【倒排索引】的基础，首先是要对文档进行分词操作；

倒排索引：就是根据文档内容的分词，整理不重复的各个关键字，对应联系到文档ID的方案

关键词（具有唯一性） 文档ID 雷军 文档1 ， 文档2 买 文档1 四斤 文档1 小米 文档1， 文档2 四斤小米 文档1 发布 文档2 汽车 文档2 小米汽车 文档2

模拟一次查找的过程：

        用户输入：小米 ---> 去倒排索引中查找关键字“小米” ---> 提取出文档ID【1,2】---> 去正排索引中，根据文档ID【1,2】找到文档内容 ---> 通过 [ 标题 + 内容摘要 + 网址 ] 的形式，构建响应结果 ---> 返回给用户小米相关的网页信息。

💢搜索引擎的具体原理 

第一步： 我们需要去boost官网下载boost库，这个库里面包含boost官网的所有文档的html文件。

第二步： 我们写一个解析程序从一个个html文件的源码中提取标题、内容和url，将他们保存到硬盘的一个data.txt文件中。

第三步： 读取data.txt文件，建立正排和倒排索引，提供索引的接口来获取正排和倒排数据

第四步： 写一个html页面，提供给用户一个搜索功能。

一次访问过程： 当用户通过浏览器向服务器发送搜索信息时，服务器会根据搜索的关键字获取对应倒排数据，然后通过倒排数据找到正排ID，从而找到正排的文档内容。然后构建出网页的标题，简述（内容的一部分），url，通过json字符串响应回去，然后在用户的浏览器显示出一个个网页信息。

五、编写数据去除标签和数据清洗模块 Parser 

   在编写Parser模块的之前，我们先将数据准备好，去boost官网下载最新版本的库，解压到 Linux下，操作方法如下： 

1. 数据准备 

boost官网：Boost C++ Libraries 

进入官网后，是如下界面：  

进入之后，你可以选择最新版本的下载，不管是那个版本其实都是可以用的。 

 点击Download之后，我们选择这个进行下载： 

下载好之后，我们先在 linux下，创建一个名为 Boost_Searcher 目录，以后将会在这个目录下进行各种代码模块的编写以及存放各种数据，下面是创建过程：

接下来我们将下载好的1.85.0版本的boost库解压到Linux下，使用 rz 命令（用于文件传输），输入rz -E 命令后直接回车，找到 boost，点击打开即可，你也可以直接将压缩包拖拽到命令行中； 

效果如下： 

此时，我们使用 tar xzf boost_1_85_0.tar.gz 进行解压，解压好后，我们进行查看 

可以看到，解压好的boost，里面有这么所文件，但这么多文件并不是我们都需要的，我们需要的就是boost_1_85_0/doc/html目录下的html。为什么呢？结合下面的图： 

上面的图就是boost库的操作方法，我们可以看到右下角的两个网页的网址，他们都是在doc/html目录下的文件，都是 .html。我们只要这个就可以了。后期通过地址进行拼接，达到跳转，就能来到这个网页。 

---

我们进入到Linux下的 doc/html 目录，看看里面有哪些东西： 

可以看到，里面除了 html为后缀的文件外，还有一些目录，但是我们只需要html文件，所以我们要进行数据清洗。只拿html文件。

---

我们了解了大概的情况之后，我们来将我们所需要的数据源 拷贝到 data目录下的intput目录下： 

2. 编写parser模块 

🍍基本结构设计 

这里我是在 vscode 下进行代码编写的，但是需要连接一下云服务器，与 Linux进行同步。 你也可以选择 vim。

基本框架主要完成的工作如下：

• 将 data/input/ 所有后缀为 html 的文件筛选出来  ---- 清洗数据
• 然后对筛选好的html文件进行解析（去标签），拆分出标题、内容、网址  ---- 去标签
• 最后将去标签后的所有html文件的标题、内容、网址按照 \\3 作为分割符，每个文件再按照 \\n 进行区分。写入到 data/raw_html/raw.txt 下

---

 什么是清洗数据呢？ 

• 我们进入到Linux下的 doc/html 目录，看看里面有哪些东西：  

可以看到，里面除了 html为后缀的文件外，还有一些目录，但是我们只需要html文件，所以我们要进行数据清洗。只拿html文件。 

 最后，我们在 data目录 下的 raw_html目录下 创建有一个 raw.txt文件，用来存储干净的数据文档 

---

 什么是去标签呢？  

• 对数据清洗之后，拿到的全都是 html 文件，此时还需要对 html 文件进行去标签处理，我们这里随便看一个html文件： 
•  我们呢，进入 input 这个目录下，随便打开一个 .html 的文件

  :  html的标签，这个标签对我们进行搜索是没有价值的，需要去掉这些标签，一般标签都是成对出现的！但是也有单独出现的，我们也是不需要的。

我们的目标： 把每个文档都去标签，然后写入到同一个文件中！每个文档内容不需要任何\\n！文档和文档之间用 \\3 进行区分。

类似：XXXXXXXXXXXXXXX\\3YYYYYYYYYYYYYYYYYY\\3ZZZZZZZZZZZZZZZZZZZZ\\3
但是这种方案 不太美观，全都在一行，所以我们采用一下方案

采用下面的方案：

• 写入文件中，一定要考虑下一次在读取的时候，也要方便操作!
• 类似：title\\3content\\3url \\n  title\\3content\\3url \\n  title\\3content\\3url \\n ...
• 方便我们getline(ifsream, line)，直接获取文档的全部内容：title\\3content\\3url

---

 接下来 我们根据上面分析的 基本结构设计 来写出一个 parser 模块的框架

• 在  Boost_Searcher 目录下创建 parser.cpp 文件开始编写框架

•  parser.cpp 框架如下：

#include #include #include // 首先我们肯定会读取文件，所以先将文件的路径名 罗列出来// 将 数据源的路径 和 清理后干净文档的路径 定义好const std::string src_path = \"data/input\"; // 数据源的路径const std::string output = \"data/raw_html/raw.txt\"; // 清理后干净文档的路径//DocInfo --- 文件信息结构体typedef struct DocInfo{ std::string title; //文档的标题 std::string content; //文档的内容 std::string url; //该文档在官网当中的url}DocInfo_t;// 命名规则// const & ---> 输入// * ---> 输出// & ---> 输入输出//把每个html文件名带路径，保存到files_list中bool EnumFile(const std::string &src_path, std::vector *files_list); //按照files_list读取每个文件的内容，并进行解析bool ParseHtml(const std::vector &files_list, std::vector *results); //把解析完毕的各个文件的内容写入到outputbool SaveHtml(const std::vector &results, const std::string &output);int main(){ std::vector files_list; // 将所有的 html文件名保存在 files_list 中 // 第一步：递归式的把每个html文件名带路径，保存到files_list中，方便后期进行一个一个的文件读取 // 从 src_path 这个路径中提取 html文件，将提取出来的文件存放在 string 类型的 files_list 中 if(!EnumFile(src_path, &files_list)) //EnumFile--枚举文件 { std::cerr << \"enum file name error! \" << std::endl; return 1; } return 0; // 第二步：从 files_list 文件中读取每个.html的内容，并进行解析 std::vector results; // 从 file_list 中进行解析，将解析出来的内容存放在 DocInfo 类型的 results 中 if(!ParseHtml(files_list, &results))//ParseHtml--解析html { std::cerr << \"parse html error! \" << std::endl; return 2; } // 第三部：把解析完毕的各个文件的内容写入到output，按照 \\3 作为每个文档的分隔符 // 将 results 解析好的内容，直接放入 output 路径下 if(!SaveHtml(results, output))//SaveHtml--保存html { std::cerr << \"save html error! \" << std::endl; return 3; } return 0;}

🍑细节实现

主要实现：枚举文件、解析html文件、保存html文件三个工作。

这三个工作完成是需要我们使用boost库当中的方法的，我们需要安装一下boost的开发库：

命令：sudo apt install -y libboost-all-dev

• 下图就是我们接下来编写代码需要用到的 boost库 当中的 filesystem方法。  

 枚举文件 

//在原有的基础上添加这个头文件#include  //把每个html文件名带路径，保存到files_list中bool EnumFile(const std::string &src_path, std::vector *files_list){ // 简化作用域的书写 namespace fs = boost::filesystem; fs::path root_path(src_path); // 定义一个path对象，枚举文件就从这个路径下开始 // 判断路径是否存在 if(!fs::exists(root_path)) { std::cerr << src_path << \" not exists\" <path().extension() != \".html\") { continue; } //std::cout << \"debug: \" <path().string() <push_back(iter->path().string()); // 将所有带路径的html保存在files_list中，方便后续进行文本分析 } return true;}

• 代码编写到这里我们就可以进行测试了，使用上述代码中注释掉的代码进行测试，首先编写Makefile： 

• 注意：boost库 并不是C++语言的标准库，我们需要指明我们需要链接那个库 
• 链接： -lboost_system -lboost_filesystem

cpp=g++parser:parser.cpp$(cpp) -o $@ $^ -lboost_system -lboost_filesystem -std=c++11.PHONY:cleanclean:rm -f parser

• make 后查看 parser的链接库 

•  接下来就可以 make，然后运行: 

• 测试成功后，将测试代码注释掉哦！
• 运行测试成功，继续编写下一个模块 

---

经过上面函数的筛选后，我们 files_list中存放的都是 html文件的路径名了，可以进行html 的文件解析了

解析html文件

1. 读取刚刚枚举好的文件
2. 解析html文件中的title
3. 解析html文件中的content
4. 解析html文件中的路径，构建url

• ParseHtml()解析函数代码的整体框架如下：  

• 函数架构 

bool ParseHtml(const std::vector &files_list, std::vector *results){ for(const std::string &file : files_list) { // 1.读取文件，Read() std::string result; if(!ns_util::FileUtil::ReadFile(file, &result)) { continue; } // 2.解析指定的文件，提取title DocInfo_t doc; if(!ParseTitle(result, &doc.title)) { continue; } // 3.解析指定的文件，提取content if(!ParseContent(result, &doc.content)) { continue; } // 4.解析指定的文件路径，构建url if(!ParseUrl(file, &doc.url)) { continue; } // 到这里，一定是完成了解析任务，当前文档的相关结果都保存在了doc里面 results->push_back(std::move(doc)); // 本质会发生拷贝，效率肯能会比较低，这里我们使用move后的左值变成了右值，去调用push_back的右值引用版本 } return true; }

解释：该函数主要完成 4件事：

①根据路径名依次读取文件内容，②提取title，③提取content，④构建url。

---

读取文件

• 遍历 files_list 中存储的文件名，从中读取文件内容到 result 中，由函数 ReadFile() 完成该功能。该函数定义于头文件 util.hpp 的类 FileUtil中。

#pragma once#include #include #include #include  namespace ns_util{ class FileUtil { public: //输入文件名，将文件内容读取到out中 static bool ReadFile(const std::string &file_path, std::string *out) { // 读取 file_path（一个.html文件） 中的内容 -- 打开文件 std::ifstream in(file_path, std::ios::in); //文件打开失败检查 if(!in.is_open()) { std::cerr << \"open file \" << file_path << \" error\" << std::endl; return false; } //读取文件内容 std::string line; //while(bool),getline的返回值istream会重载操作符bool，读到文件尾eofset被设置并返回false //如何理解getline读取到文件结束呢？？getline的返回值是一个&，while(bool), 本质是因为重载了强制类型转化 while(std::getline(in, line)) // 每循环一次，读取的是文件的一行内容 { *out += line; // 将文件内容保存在 *out 里面 } in.close(); // 关掉文件 return true; } };}

---

提取title —— ParseTitle()

• 随意打开一个html文件，可以看到我们要提取的title部分是被title标签包围起来的部分。如下所示： 

• 上图显示标题的时候，是以 构成的，我们只需要find（的左尖括号，最后截取子串； 
• 这里需要依赖函数 —— bool ParseTitle(const std::string& file,&doc.title)，来帮助完成这一工作，函数就定义在 parse.cpp 中。 

//解析titlestatic bool ParseTitle(const std::string& file,std::string* title){ // 查找  位置 std::size_t end = file.find(\"\"); if(end == std::string::npos) { return false; } // 计算中间的距离，截取中间的内容 begin += std::string(\" 
欢迎来到我的世界

#include \"cpp-httplib/httplib.h\" const std::string root_path = \"./wwwroot\"; int main() { //创建一个Server对象，本质就是搭建服务端 httplib::Server svr; //访问首页 svr.set_base_dir(root_path.c_str()); // 这里注册用于处理 get 请求的函数，当收到对应的get请求时（请求hi时），程序会执行对应的函数（也就是lambda表达式） svr.Get(\"/hi\", [](const httplib::Request& req, httplib::Response& rsp){ //设置 get \"hi\" 请求返回的内容  rsp.set_content(\"hello world！\", \"text/plain; charset=utf-8\"); }); // 绑定端口（8080），启动监听（0.0.0.0表示监听任意端口） svr.listen(\"0.0.0.0\", 8080); return 0; }

 再次通过浏览器进行访问： 

3. 正式编写http_server

#include \"cpp-httplib/httplib.h\" #include \"searcher.hpp\" const std::string input = \"data/raw_html/raw.txt\"; const std::string root_path = \"./wwwroot\"; int main() { ns_searcher::Searcher search; search.InitSearcher(input); //创建一个Server对象，本质就是搭建服务端 httplib::Server svr; //访问首页 svr.set_base_dir(root_path.c_str()); // 这里注册用于处理 get 请求的函数，当收到对应的get请求时（请求s时），程序会执行对应的函数（也就是lambda表达式） svr.Get(\"/s\", [&search](const httplib::Request &req, httplib::Response &rsp){ //has_param：这个函数用来检测用户的请求中是否有搜索关键字，参数中的word就是给用户关键字取的名字（类似word=split） if(!req.has_param(\"word\")){  rsp.set_content(\"必须要有搜索关键字!\", \"text/plain; charset=utf-8\");  return; }  //获取用户输入的关键字 std::string word = req.get_param_value(\"word\"); std::cout << \"用户在搜索：\" << word << std::endl; //根据关键字，构建json串 std::string json_string; search.Search(word, &json_string); //设置 get \"s\" 请求返回的内容，返回的是根据关键字，构建json串内容 rsp.set_content(json_string, \"application/json\");  }); std::cout << \"服务器启动成功......\" << std::endl; // 绑定端口（8080），启动监听（0.0.0.0表示监听任意端口） svr.listen(\"0.0.0.0\", 8080);return 0; }

此时我们编译运行我们的代码，先执行parser进行数据清洗，然后执行http_server，搭建服务，创建单例，构建索引，发生请求（根据用户输入的关键字，进行查找索引，构建json串），最后响应给用户

此时服务器启动成功，索引也建立完毕 

此时，我们在浏览器进行访问（服务器IP:8080/s） 

此时，我们在浏览器进行访问（服务器IP:8080/s?word=split）  

最终，在浏览器上就显示出来了，到这里我们的后端内容大致上算是完成了，最后添加一个日志就可以了，如果你对前端不感兴趣，到这里就可以了。可以把日志功能的添加看一看 

九、添加日志到项目中 

我们创建一个log.hpp的头文件，需要添加日志的地方：index模块，searcher模块、http_server模块。代码如下：  

#pragma once #include  #include  #include  #define NORMAL 1 //正常的  #define WARNING 2 //错误的 #define DEBUG 3 //bug #define FATAL 4 //致命的 #define LOG(LEVEL, MESSAGE) log(#LEVEL, MESSAGE, __FILE__, __LINE__) void log(std::string level, std::string message, std::string file, int line) { std::cout << \"[\" << level << \"]\" << \"[\" << time(nullptr) << \"]\" << \"[\" << message << \"]\" << \"[\" << file << \" : \" << line << \"]\" << std::endl; } /*简单说明： 我们用宏来实现日志功能，其中LEVEL表明的是等级（有四种）， 这里的#LEVEL的作用是：把一个宏参数变成对应的字符串（直接替换）C语言中的预定义符号： __FILE__：进行编译的源文件 __LINE__：文件的当前行号补充几个： __DATE__：文件被编译的日期 __TIME__：文件被编译的时间 __FUNCTION__：进行编译的函数*/

•  假设在如下示例代码：

int main() { LOG(NORMAL, \"This is a normal log message\"); LOG(WARNING, \"This is a warning log message\"); LOG(DEBUG, \"This is a debug log message\"); LOG(FATAL, \"This is a fatal log message\"); return 0;}

• 编译并运行这段代码后，输出会类似于： 

[NORMAL][1691585012][This is a normal log message][main.cpp : 2][WARNING][1691585012][This is a warning log message][main.cpp : 3][DEBUG][1691585012][This is a debug log message][main.cpp : 4][FATAL][1691585012][This is a fatal log message][main.cpp : 5]

• 所以我们可以将日志添加到有输出入口的地方，方便监视我们的代码那里出现了问题。 

日志系统的作用

1. 调试和错误追踪：记录程序执行过程中的各种状态和错误信息，方便定位和修复问题。
2. 运行监控：监控程序的运行状态，了解程序的执行流程和重要事件。
3. 审计和分析：分析日志记录，了解用户行为和系统性能，进行数据挖掘和改进。

 十、编写前端模块 

  前端模块，我做详细的解释，代码中都有注释，直接上代码 

         /*去掉网页中的所有内外边距，可以了解html的盒子模型*/ * { margin: 0; /* 设置外边距 */ padding: 0; /* 设置内边距 */ } /* 将我们的body内的内容100%和html的呈现吻合 */ html, body { height: 100%; } /* 以点开头的称为类选择器.container */ .container { /* 设置div的宽度 */ width: 800px; /* 通过设置外边距达到居中对其的目的 */ margin: 0px auto; /* 设置外边距的上边距，保持元素和网页的上部距离 */ margin-top: 15px; } /* 复合选择器，选中container下的search */ .container .search { /* 宽度与父标签保持一致 */ width: 100%; /* 高度设置52px */ height: 50px; } /* 选中input标签,直接设置标签的属性，先要选中，标签选择器 */ /* input在进行高度设置的时候，没有考虑边框的问题 */ .container .search input { /* 设置left浮动 */ float: left; width: 600px; height: 50px; /* 设置边框属性，依次是边框的宽度、样式、颜色 */ border: 2px solid #CCC; /* 去掉input输入框的右边框 */ border-right: none; /* 设置内内边距，默认文字不要和左侧边框紧挨着 */ padding-left: 10px; /* 设置input内部的字体的颜色和样式 */ color: #CCC; color: #CCC; font-size: 17px; } .container .search button { /* 设置left浮动 */ float: left; width: 150px; height: 54px; /* 设置button的背景颜色 #4e6ef2*/ background-color: #4e6ef2; color: #FFF; /* 设置字体的大小 */ font-size: 19px; font-family: Georgia, \'Times New Roman\', Times, serif \'Times New Roman\', Times, serif; } .container .result { width: 100%; } .container .result .item { margin-top: 15px; } .container .result .item a { /* 设置为块级元素，单独占一行 */ display: block; text-decoration: none; /* 设置a标签中的文字字体大小 */ font-size: 22px; /* 设置字体的颜色 */ color: #4e6ef2; } .container .result .item a:hover { /* 设置鼠标放在a之上的动态效果 */ text-decoration: underline; } .container .result .item p { margin-top: 5px; font-size: 16px; font-family: \'Lucida Sans\', \'Lucida Sans Regular\', \'Lucida Grande\', \'Lucida Sans Unicode\', Geneva, Verdana, sans-serif; } .container .result .item i { /* 设置为块级元素，单独占一行 */ display: block; /* 取消斜体风格 */font-style: normal; color: green; }   
 
  搜索一下 
 
 <!-- 
 这是标题 
这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要
 https://hao.360.com/?hj=llq7a 
 
 这是标题 
这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要
 https://hao.360.com/?hj=llq7a 
 
 这是标题 
这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要
 https://hao.360.com/?hj=llq7a 
 
 这是标题 
这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要
 https://hao.360.com/?hj=llq7a 
 
 这是标题 
这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要
 https://hao.360.com/?hj=llq7a 
 
 这是标题 
这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要
 https://hao.360.com/?hj=llq7a 
 --> 
 
  function Search() { // 是浏览器的一个弹出窗 // 1.提取数据,$可以理解为就是JQuery的别称 let query = $(\".container .search input\").val(); console.log(\"query = \" + query); //console是浏览器对话框，可以用来进行查看js数据 // 2.发起http请求，ajax属于一个和后端进行数据交互的函数 $.ajax({ type: \"GET\", url: \"/s?word=\" + query, success: function (data) {  console.log(data);  BuildHtml(data); } }); } function BuildHtml(data) { // 获取html中的result标签 let result_lable = $(\".container .result\"); // 清空历史搜索结果 result_lable.empty(); for (let elem of data) { console.log(elem.title); console.log(elem.url); let a_lable = $(\"\", {  text: elem.title,  href: elem.url,  // 跳转到新的页面  target: \"_blank\" }); let p_lable = $(\"
\", {  text: elem.desc }); let i_lable = $(\"
\", {  text: elem.url }); let div_lable = $(\"
\", {  class: \"item\" }); a_lable.appendTo(div_lable); p_lable.appendTo(div_lable); i_lable.appendTo(div_lable); div_lable.appendTo(result_lable); } }  

 由于不太美观（不太熟悉前端😁）所以用gpt调整了一个代码出来，让我们的界面更加美观（这个界面都可以使用，大家自行选择）

       * { margin: 0; padding: 0; box-sizing: border-box; } html, body { height: 100%; background: url(\'https://images.unsplash.com/photo-1517430816045-df4b7de6d0e6\') no-repeat center center fixed; background-size: cover; font-family: Arial, sans-serif; } .container { width: 90%; max-width: 800px; margin: 50px auto; padding: 20px; background-color: rgba(255, 255, 255, 0.9); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); border-radius: 8px; } h1 { margin-bottom: 20px; font-size: 36px; color: #4e6ef2; text-align: center; } .search { display: flex; justify-content: center; position: relative; } .search input { flex: 1; height: 50px; border: 2px solid #ccc; padding-left: 10px; font-size: 17px; border-radius: 25px 0 0 25px; transition: border-color 0.3s; } .search input:focus { border-color: #4e6ef2; outline: none; } .search button { width: 160px; height: 50px; background-color: #4e6ef2; color: #fff; font-size: 19px; cursor: pointer; transition: background-color 0.3s; border: none; border-radius: 0 25px 25px 0; } .search button:hover { background-color: #3b5ec2; } .clear-btn { position: absolute; right: 170px; top: 50%; transform: translateY(-50%); cursor: pointer; font-size: 18px; display: none; color: #ccc; } .result { width: 100%; margin-top: 20px; } .result .item { margin-top: 15px; padding: 15px; background-color: #fff; border: 1px solid #ddd; border-radius: 5px; transition: box-shadow 0.3s; text-align: left; } .result .item:hover { box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); } .result .item a { display: block; text-decoration: none; font-size: 22px; color: #4e6ef2; margin-bottom: 5px; } .result .item a:hover { text-decoration: underline; } .result .item p { font-size: 16px; color: #333; margin-bottom: 5px; } .result .item i { display: block; font-style: normal; color: green; } .loader { border: 4px solid #f3f3f3; border-top: 4px solid #4e6ef2; border-radius: 50%; width: 40px; height: 40px; animation: spin 2s linear infinite; display: none; margin: 20px auto; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .error-message { color: red; text-align: center; margin-top: 20px; } .pagination { margin-top: 20px; display: flex; justify-content: center; } .pagination button { background-color: #4e6ef2; color: #fff; border: none; border-radius: 5px; padding: 10px 15px; margin: 0 5px; cursor: pointer; transition: background-color 0.3s; } .pagination button:hover { background-color: #3b5ec2; } .pagination button:disabled { background-color: #ccc; cursor: not-allowed; } .previous-searches { margin-top: 20px; } .previous-searches h2 { font-size: 20px; color: #4e6ef2; text-align: center; margin-bottom: 10px; } .previous-searches ul { list-style-type: none; text-align: center; } .previous-searches ul li { display: inline-block; margin: 5px 10px; padding: 5px 10px; background-color: #4e6ef2; color: #fff; border-radius: 5px; cursor: pointer; transition: background-color 0.3s; } .previous-searches ul li:hover { background-color: #3b5ec2; }  
 
Boost库搜索引擎
 
  × 搜索一下 
 
 
 
 
 
 
之前的搜索
 
 
 
  let currentPage = 1; const resultsPerPage = 8; let allResults = []; let previousSearches = JSON.parse(localStorage.getItem(\'previousSearches\')) || []; $(document).ready(function () { $(\"#searchInput\").on(\"input\", function () { if ($(this).val()) {  $(\"#clearBtn\").show(); } else {  $(\"#clearBtn\").hide(); } }); $(\"#clearBtn\").on(\"click\", function () { $(\"#searchInput\").val(\'\'); $(this).hide(); }); displayPreviousSearches(); }); function Search() { const query = $(\"#searchInput\").val().trim(); if (!query) { alert(\"请输入搜索关键字！\"); return; } if (!previousSearches.includes(query)) { if (previousSearches.length >= 5) {  previousSearches.shift(); } previousSearches.push(query); localStorage.setItem(\'previousSearches\', JSON.stringify(previousSearches)); } $(\"#loader\").show(); $(\"#errorMessage\").text(\'\'); $.ajax({ type: \"GET\", url: \"/s?word=\" + query, success: function (data) {  $(\"#loader\").hide();  allResults = data;  currentPage = 1;  displayResults(); }, error: function () {  $(\"#loader\").hide();  $(\"#errorMessage\").text(\'搜索失败，请稍后重试。\'); } }); } function displayResults() { const resultContainer = $(\"#resultContainer\"); const paginationContainer = $(\"#paginationContainer\"); resultContainer.empty(); paginationContainer.empty(); const totalResults = allResults.length; const totalPages = Math.ceil(totalResults / resultsPerPage); if (totalResults === 0) { $(\"#errorMessage\").text(\'没有搜索到相关的内容。\'); return; } const start = (currentPage - 1) * resultsPerPage; const end = Math.min(start + resultsPerPage, totalResults); const currentResults = allResults.slice(start, end); currentResults.forEach(elem => { const item = $(`  
 ${elem.title} 
${elem.desc}
 ${elem.url}  
 `); resultContainer.append(item); }); displayPagination(totalPages); displayPreviousSearches(); } function displayPagination(totalPages) { const paginationContainer = $(\"#paginationContainer\"); if (currentPage > 1) { const prevButton = $(\'上一页\'); prevButton.on(\'click\', function () {  currentPage--;  displayResults(); }); paginationContainer.append(prevButton); } let startPage, endPage; if (totalPages <= 5) { startPage = 1; endPage = totalPages; } else { if (currentPage = totalPages) {  startPage = totalPages - 4;  endPage = totalPages; } else {  startPage = currentPage - 2;  endPage = currentPage + 2; } } for (let i = startPage; i <= endPage; i++) { const button = $(`${i}`); if (i === currentPage) {  button.prop(\'disabled\', true); } button.on(\'click\', function () {  currentPage = i;  displayResults(); }); paginationContainer.append(button); } if (currentPage < totalPages) { const nextButton = $(\'下一页\'); nextButton.on(\'click\', function () {  currentPage++;  displayResults(); }); paginationContainer.append(nextButton); } } function displayPreviousSearches() { const previousSearchList = $(\"#previousSearchList\"); previousSearchList.empty(); previousSearches.forEach(search => { const item = $(`
${search}
`); item.on(\'click\', function () {  $(\"#searchInput\").val(search);  Search(); }); previousSearchList.append(item); }); } 

十一、项目总结

🔥项目的总体框架和功能🔥

功能：实现boost文档站内搜索引擎，通过输入查询内容，将与查询内容有关文档的网页按该词的权值降序显示出来，包括标题、内容摘要和网页url，通过点击标题可直接跳转boost库网页进行文档阅读。

框架：

🔥技术栈和项目环境🔥 

技术栈：

c/c++、c++11、STL、准标准库boost、Jsoncpp、cppjieba、cpp-httplib 

项目环境：

Linux Ubuntu云服务器、vim/gcc(g++)/Makefile、vscode 

🔥 gitee代码地址🔥

https://gitee.com/xing-aosheng/linux/tree/master/Boost_Searcher

 这里针对项目的扩展进行一下叙述：

1. 建立整站搜索

• 我们搜索的内容是在boost库下的doc目录下的html文档，你可以将这个库建立搜索，也可以将所有的版本，但是成本是很高的，对单个版本的整站搜索还是可以完成的，取决于你服务器的配置。

 2. 设计一个在线更新的方案，信号，爬虫，完成整个服务器的设计

• 我们在获取数据源的时候，是我们手动下载的，你可以学习一下爬虫，写个简单的爬虫程序。采用信号的方式去定期的爬取。

3. 不使用组件，而是自己设计一下对应的各种方案

• 我们在编写http_server的时候，是使用的组件，你可以自己设计一个简单的；

4. 在我们的搜索引擎中，添加竞价排名

• 我们在给用户反馈是，提供的是json串，显示到网页上，有title、content和url；就可以在构建json串时，你加上你的博客链接（将博客权重变高了，就能够显示在第一个）

5. 热次统计，智能显示搜索关键词（字典树，优先级队列）

6. 设置登陆注册，引入对mysql的使用

十二、共勉 

       以下就是我对 【C++综合项目】--基于Boost库的搜索引擎的理解，如果有不懂和发现问题的小伙伴，请在评论区说出来哦，同时我还会继续更新对 【C++】的综合项目 ，请持续关注我哦！！！