1. 简介

常见的搜索引擎：baidu、google、bing，以及常见的一些带有搜索功能的app等。

我们自己单枪匹马实现一个常规的搜索引擎（全网搜索）显然是不可能的，但可以实现一个简单的搜索引擎来进行站内搜索的行为。

比如我们学习C++常用的cplusplus网站就是带有站内搜索功能,搜索的内容更垂直（范围小且相关性更强），数据量更小。

boost库是没有站内搜索的，我们可以自己做一个。

完成后的搜索引擎也将显示每个检索条目的：网页标题，网页内容摘录以及url。

建立搜索引擎的宏观体系

技术栈和项目环境

• 技术栈：

  • 后端：C/C++, C++11,STL,Boost,Jsoncpp,cppjieba分词库，cpp-httplib开源库。
  • 前端：html5,css,js,jQuery,Ajax

• 项目环境：Centos 7云服务器，vim/gcc(g++)/Makefile,vs2019/vs code

正排索引 and 倒排索引

正排索引：由key查询实体的过程

• 例如通过文档名找到相应的文档内容

  文档名	文档内容
  XXX公司2021年财报	2021年XXX总营收…
  XXX公司2021年产品销售情况	2021年A产品销售量…

• 例如，用户表：

  t_user(uid,name,passwd,age,gender)

  由uid查询整行的过程就是正排索引。

• 例如，网页库：

  t_web_page(url, page_content)

  由url查询整个网页的过程，也是正排索引查询。

分词：实体内容分词后，会对应一个分词后的集合list。所以简易的正排索引可以理解为 Map。(关键词具有唯一性)

• 举个例子，假设有3个网页：

  url1 -> “我爱北京”

  url2 -> “我爱宏伟的天安门”

  url3 -> “长城真宏伟啊”

  这是一个正排索引Map

  分词之后：

  url1 -> {我，爱，北京}

  url2 -> {我，爱，宏伟，天安门}

  url3 -> {长城，宏伟}

  这是一个分词后的正排索引Map

停止词：了，的，吗，啊，a，the，一般我们在分词的时候可以不考虑

倒排索引：由实体查询key的过程

• 例如，网页库：

  由查询词快速找到包含这个查询词的网页

  分词后倒排索引：

  我 -> {url1,url2}

  爱 -> {url1,url2}

  北京 -> {url1}

  宏伟 -> {url2,url3}

  长城 -> {url3}

由检索词item快速找到包含这个查询词的网页 Map 就是倒排索引。

模拟一次查找的过程：

用户输入关键词：宏伟 -> 倒排索引 -> 提取出网页{url2,url3} -> 正排索引 -> 分别提取网页内容 -> 分别构建 title + content + url 响应结果 -> 呈现用户时，根据权重划分优先级

2. 数据去标签与数据清洗模块 —— Parser

数据源直接在boost官网下载

打开云服务器，建立项目文件夹，使用rz指令将之前下载的数据报添加进入云服务器中：

使用tar指令解压：

目前只需要 boost_1_79_0/doc/html目录下的html文件，来对它建立索引。

所以创建 data/input 目录，将boost库的 doc/html/*文件放在input目录下即可。

[sjl@VM-16-6-centos boost_searcher]$ cp -rf boost_1_79_0/doc/html/* data/input/
1

数据去标签 parser.cc

新建去标签程序

[sjl@VM-16-6-centos boost_searcher]$ touch parser.cc
//原始数据  -- > 去标签之后的数据
1
2

html文件中 被 <> 括起来的就是标签，然而这对于我们执行搜索是没有价值的，需要去掉这些标签。

<td align="center"><a href="../../libs/libraries.htm">Librariesa>td>
1

处理完标签的html数据将会存放在 raw_html 目录中

[sjl@VM-16-6-centos data]$ mkdir raw_html
[sjl@VM-16-6-centos data]$ ll
total 16
drwxrwxr-x 58 sjl sjl 16384 Jul 19 16:37 input      //原始html文档
drwxrwxr-x  2 sjl sjl  4096 Jul 19 20:37 raw_html   //去标签之后的html文档
1
2
3
4
5

可以看一下data这个文件目前包含多少个html文件：

[sjl@VM-16-6-centos data]$ ls -Rl|grep -E *.html|wc -l
8172
1
2

grep : 文本搜索指令 —E 支持正则表达式

wc : 统计文件属性 -l 统计行数

目标

把每个html都去标签，然后写入同一个文件中，注意方便读取，那么我们就把每个文件都各自放在一行里，例子如下，不同的内容以 \3 分隔，不同文件以 \n 分隔：

类似：

title\3content\3url \n title\3content\3url \n title\3content\3url \n

我们知道getline函数可以直接读取一行，直接获取一个文档的全部内容title\3content\3url\3

parser.cc 的代码结构

#include 
#include 
#include 

const std::string src_path="data/input";
const std::string output="data/raw_html/raw.txt";

typedef struct DocInfo
{
    std::string title;    //文档标题
    std::string content;  //文档内容
    std::string url;      //该文档在官网中的url
}DocInfo_t;

//const & : 输入
//* : 输出
//& : 输入输出

bool EnumFile(const std::string& src_path,std::vector<std::string>* files_list);

bool ParseHtml(const std::vector<std::string>& files_list,std::vector<DocInfo_t>* results);

bool SaveHtml(const std::vector<DocInfo_t>& results,const std::string& output);

int main()
{
    //文件名列表
    std::vector<std::string> files_list;

    //第一步：递归式地把每个html文件名（带路径），存放到files_list中，方便后期对html文件的读取
    if(!EnumFile(src_path,&files_list))
    {
        std::cerr<<"enum file name error"<<std::endl;
        return 1;
    }

    //第二步：读取files_list的文件名读取每个文件的内容，并解析:title + content + url 
    std::vector<DocInfo_t> results; //files_list中所有文件 去除标签后的结果 存放于此
    if(!ParseHtml(files_list,&results))
    {
        std::cerr<<"parse html error"<<std::endl;
        return 2;
    }

    //第三步：将解析完毕的各个文件的内容,写入到 output路径 ，每个文件结束以 \3 作为每个文档的分隔符
    if(!SaveHtml(results,output))
    {
        std::cerr<<"Save html error"<<std::endl;
        return 3;
    }
    return 0;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52

EnumFile() 函数 —— 枚举筛选html文件

由于C++标准库对文件操作的支持并不完善，所以这里需要使用Boost库的filesystem模块来完成。

• boost开发库的安装

[sjl@VM-16-6-centos boost_searcher]$ sudo yum install -y boost-devel 
1

同时在parser.cc中引入头文件

#include 
1

• 代码如下

bool EnumFile(const std::string& src_path,std::vector<std::string>* files_list)
{
    namespace fs=boost::filesystem;
    fs::path root_path(src_path);

    //判断路径是否存在，如果不存在就不必往后走了 
    if(!fs::exists(root_path))
    {
        std::cerr<<src_path<<"not exists"<<std::endl;
        return false;
    }

    //定义空的迭代器，用来判断递归结束
    fs::recursive_directory_iterator end;
    for(fs::recursive_directory_iterator iter(root_path);iter!=end;iter++)
    {
        //筛选路径下的普通文件（过滤掉目录文件），html文件都是普通文件
        if(!fs::is_regular_file(*iter))
        {
            continue;
        }
        //过滤掉后缀不为".html"的文件
        if(iter->path().extension()!=".html")
        {
            continue;
        }

        //打印测试
        std::cout<<"debug: "<<iter->path().string()<<std::endl; 
  
        //当前的路径一定是以".html"为后缀而定普通网页文件
        files_list->push_back(iter->path().string());//将html文件的路径名转为字符串填入files_list中。

    }

    return true;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

Makefile文件如下(注意链接boost库和boost文件库)：

cc=g++

parser:parser.cc
	$(cc) -o $@ $^ -std=c++11 -lboost_system -lboost_filesystem


.PHONY:clean
clean:
		rm -rf parser
1
2
3
4
5
6
7
8
9

make后查看parser的链接库

我们运行下parser可执行文件（另两个函数先默认 return true），查看输出情况：

这样html的文件就被筛选出来了，共有8171个html文件。

ParseHtml() 函数 —— 解析html代码结构

经过上面函数的筛选后，我们 files_list中存放的都是html文件的路径名了。

ParseHtml()代码的整体框架如下：

函数架构

bool ParseHtml(const std::vector<std::string>& files_list,std::vector<DocInfo_t>* results)
{
    for(const std::string &file: files_list)
    {
        //1.读取文件 ReadFile
        std::string result;
        if(!ns_tool::FileTool::ReadFile(file,&result))
        {
            continue;
        }
  
        DocInfo_t doc;
        //2.解析文件，提取title
        if(!ParseTitle(result,&doc.title))
        {
            continue;
        }
  
        //3.解析文件，提取content,就是去标签
        if(!ParseContent(result,&doc.content))
        {
            continue;
        }
        //4.解析指定的文件路径，构建官网url
        if(!ParseUrl(file,&doc.url))
        {
            continue;
        }
        //done 一定是完成了解析任务，当前文档的相关结果都保存在了结构体doc中
        //将这些结构体存入results中
        results->push_back(std::move(doc));//bug：todo细节，本质会发生拷贝，效率会比较低
    }
    return true;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

解释：

该函数主要完成4件事：根据路径名依次读取文件内容，提取title，提取content，构建url。

1. 读取文件

遍历files_list中存储的文件名，从中读取文件内容到 result 中，由函数 ReadFile() 完成该功能。

该函数定义于头文件 tool.hpp的类 FileTool中。

//tool.hpp
#pragma once
#include 
#include 
#include 
namespace ns_tool
{
    class FileTool
    {
     public:
  
         //输入文件名，将文件内容读取到out中
         static bool ReadFile(const std::string& file_path,std::string *out)
         {
            std::ifstream in(file_path,std::ifstream::in);
  
            //文件打开失败检查
            if(!in.is_open())
            {
                std::cerr<<"open file: "<<file_path<<std::endl;
                return false;
            }
  
            //读取文件
            std::string line;
            while(getline(in,line))
            {
                *out+=line; 
            }//while(bool),getline的返回值istream会重载操作符bool，读到文件尾eofset被设置并返回false
   

            in.close();
            return true;
         }

    };
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

2. 提取title —— ParseTitle()

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

这里需要依赖函数 —— bool ParseTitle(const std::string& result,&doc.title)，来帮助完成这一工作，函数就定义在parse.cc中。

//解析title
static bool ParseTitle(const std::string& result,std::string* title)
{
    std::size_t begin=result.find("
    /* css设计 */
    

/* ... */
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107

JavaScript 编写实现跳转

使用原生JS成本较高（xmlhttprequest），这里使用JQuery。

在html中添加外部链接,获取JQuery库

<script src="http://code.jquery.com/jquery-2.1.1.min.js">script>
1

在html文件中插入代码：

 div>
    <script>  
        function Search(){
            // 是浏览器的一个弹出框
            // alert("hello js!");
          
            //1.提取数据 $可以理解为JQuery的别称
            let query = $(".container .search input").val();
            console.log("query = " + query);//console是浏览器的对话框，查看js的数据

            //2.发起http请求（把关键字上传给服务器）,JQuery中的ajax：一个与服务器进行数据交互的函数
            $.ajax({
                type:"GET",
                url:"/s?word="+query,
                //如果请求成功，打印出服务器返回的data（此时服务器一直在后台运行）
                success:function(data){
                    console.log(data);
                    //将结果构建为网页信息
                    BuildHtml(data);
                }
            });
        }

        function BuildHtml(data)
        {
            if(data=="" || data==null)
            {
                document.write("搜索内容不存在");
                return ;
            }
            //获取result标签
            let result_label = $(".container .result");
            //清空历史搜索数据
            result_label.empty();

            for(let elem of data)
            {
                console.log(elem.title);
                console.log(elem.url);

                let a_label=$("",{
                    text: elem.title,
                    //标签链接
                    href: elem.url,
                    //点击链接跳转新启一页 
                    target: "_blank"
                });
                let p_label=$("
",{
                    text: elem.abstract
                });
                let i_label=$("",{
                    text: elem.url,
                });
                let div_label=$("
",{
                    class:"item"
                });

                a_label.appendTo(div_label);
                p_label.appendTo(div_label);
                i_label.appendTo(div_label);
                div_label.appendTo(result_label);
              
            }
        }
    script>
body>
html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68

PARSER=parser
DUG=debug
HTTP_SERVER=http_server
cc=g++

.PHONY:all
all:$(PARSER) $(DUG) $(HTTP_SERVER)

$(PARSER):parser.cc
	$(cc) -o $@ $^ -std=c++11 -lboost_system -lboost_filesystem

$(DUG):debug.cc
	$(cc) -o $@ $^ -std=c++11 -ljsoncpp

$(HTTP_SERVER):http_server.cc
	$(cc) -o $@ $^ -std=c++11 -ljsoncpp -lpthread

.PHONY:clean
clean:
		rm -rf $(PARSER) $(DUG) $(HTTP_SERVER)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  
    <title>测试用例title>
    <meta http-equiv="refresh" content="0; URL=http://www.boost.org/doc/libs/master/doc/html/hash.html">
  head>
  <body>
    今天是一个晴天
    <a href="http://www.boost.org/doc/libs/master/doc/html/hash.html">http://www.boost.org/doc/libs/master/doc/html/hash.htmla>
  body>
html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

[sjl@VM-16-6-centos boost_searcher]$ make
g++ -o parser parser.cc -std=c++11 -lboost_system -lboost_filesystem
g++ -o debug debug.cc -std=c++11 -ljsoncpp
g++ -o http_server http_server.cc -std=c++11 -ljsoncpp -lpthread
[sjl@VM-16-6-centos boost_searcher]$ ./parser 
[sjl@VM-16-6-centos boost_searcher]$ ./http_server 
创建index单例完成...
构建索引完成....: 100%

1
2
3
4
5
6
7
8
9

//log.hpp
#pragma once

#include 
#include 
#include 

#define NORMAL  1
#define WARNING 2
#define DEBUG   3
#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;

}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

[sjl@VM-16-6-centos boost_searcher]$ nohup ./http_server &>log.txt 2>&1
1

[sjl@VM-16-6-centos boost_searcher]$ cat log.txt 
nohup: ignoring input
创建index单例完成...
[NORMAL][1659167339][创建index单例完成...][searcher.hpp : 24]
构建索引完成....: 100%
[NORMAL][1659167389][构建索引完成...][searcher.hpp : 28]
用户搜索词: vector
[NORMAL][1659168113][用户搜索词: vector][http_server.cc : 25]
用户搜索词: split
[NORMAL][1659168141][用户搜索词: split][http_server.cc : 25]
用户搜索词: filestream
[NORMAL][1659168148][用户搜索词: filestream][http_server.cc : 25]

1
2
3
4
5
6
7
8
9
10
11
12
13