[项目][boost搜刮引擎#4] cpp-httplib使用 | log.hpp | 前端 | 测试及总结 ...

用多少眼泪才能让你相信  金牌会员 | 2024-10-27 01:52:56 | 显示全部楼层 | 阅读模式
打印 上一主题 下一主题
楼主

主题 861|帖子 861|积分 2585

目录
编写http_server模块
1. 引入cpp-httplib到项目中
2. cpp-httplib的使用先容
3. 正式编写http_server
九、添加日记到项目中
十、编写前端模块
十一. 详解传 gitee
十二、项目总结
项目标扩展
写在前面
项目 gitee 已经上传啦
（还是决定将学校和个人的 gitee 区分开来，所以之后写博客的代码就用这个 gitee 号了(｡･∀･)
  1. https://gitee.com/linxi-lalala
复制代码
接着上一篇文章，下面继续讲解网络库的使用~
编写http_server模块

1. 引入cpp-httplib到项目中

安装cpp-httplib 安装的是v0.7.15版本：
下载链接：cpp-httplib 下载地址


我们将cpp-httplib放到项目中的test目录下，并解压 unzip 好


建立软毗连到我们的项目路径下：


注意：要使用 cpp-httplib ，我们的 gcc 的版本必须时 7 以上哦


至此，我们就可以在我们的项目中使用了。
2. cpp-httplib的使用先容

创建一个http_server.cpp的文件，编写测试代码：
  1. #include "cpp-httplib/httplib.h"   
  2.       
  3. int main()   
  4. {   
  5.     //创建一个Server对象，本质就是搭建服务端
  6.     httplib::Server svr;
  8.     // 这里注册用于处理 get 请求的函数，当收到对应的get请求时（请求hi时），程序会执行对应的函数（也就是lambda表达式）
  9.     svr.Get("/hi", [](const httplib::Request& req, httplib::Response& rsp){
  10.             //设置 get "hi" 请求返回的内容   
  11.             rsp.set_content("hello world！", "text/plain; charset=utf-8");                                                                                                            
  12.           });   
  13.     // 绑定端口（8080），启动监听（0.0.0.0表示监听任意端口）
  14.     svr.listen("0.0.0.0", 8080);  
  15.   
  16.     return 0;   
  17. }
复制代码
对应的Makefile：
  1. PARSER=parser
  2. DUG=debug
  3. HTTP_SERVER=http_server
  4. cpp=g++
  6. .PHONY:all
  7. all:$(PARSER) $(DUG) $(HTTP_SERVER)
  9. $(PARSER):parser.cpp
  10.         $(cpp) -o $@ $^ -lboost_system -lboost_filesystem -std=c++11
  11. $(DUG):debug.cpp
  12.         $(cpp) -o $@ $^ -std=c++11 -ljsoncpp
  13. $(HTTP_SERVER):http_server.cpp
  14.         $(cpp) -o $@ $^ -std=c++11 -ljsoncpp -lpthread
  15. .PHONY:clean
  16. clean:
  17.         rm -f $(DUG) $(PARSER) $(HTTP_SERVER)
复制代码
我们直接编译运行 http_server


打开浏览器，访问我们这个端口（如服务器IP:3877/hi）,效果如下：


但是当我们访问服务器IP:3877时，却找不到对应的网页，


像我们访问百度时，www.baidu.com，百度会给一个首页，所以在我们的项目目录下呢，也需要一个首页。 （在项目路径下创建一个wwwroot目录，目录中包含一个index.html文件）


编写我们的首页，并修改我们的 http_server.cpp：
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <title>boost搜索引擎</title>
  8. </head>
  9. <body>
  10.     <h1>欢迎来到我的世界</h1>
  11. </body>
  12. </html>
复制代码
  1. #include "cpp-httplib/httplib.h"
  3. const std::string root_path = "./wwwroot";
  5. int main()   
  6. {   
  7.     //创建一个Server对象，本质就是搭建服务端
  8.     httplib::Server svr;
  10.     //访问首页
  11.     svr.set_base_dir(root_path.c_str());
  13.     // 这里注册用于处理 get 请求的函数，当收到对应的get请求时（请求hi时），程序会执行对应的函数（也就是lambda表达式）
  14.     svr.Get("/hi", [](const httplib::Request& req, httplib::Response& rsp){
  15.             //设置 get "hi" 请求返回的内容   
  16.             rsp.set_content("hello world！", "text/plain; charset=utf-8");                                                                                                            
  17.           });   
  18.     // 绑定端口（8080），启动监听（0.0.0.0表示监听任意端口）
  19.     svr.listen("0.0.0.0", 8080);  
  20.   
  21.     return 0;   
  22. }
复制代码
再次通过浏览器进行访问：


3. 正式编写http_server

  1. #include "cpp-httplib/httplib.h"   
  2. #include "searcher.hpp"   
  3.    
  4. const std::string input = "data/raw_html/raw.txt";   
  5. const std::string root_path = "./wwwroot";   
  6.    
  7. int main()   
  8. {   
  9.     ns_searcher::Searcher search;   
  10.     search.InitSearcher(input);
  11.    
  12.     //创建一个Server对象，本质就是搭建服务端
  13.     httplib::Server svr;   
  15.     //访问首页
  16.     svr.set_base_dir(root_path.c_str());
  17.   
  18.      // 这里注册用于处理 get 请求的函数，当收到对应的get请求时（请求s时），程序会执行对应的函数（也就是lambda表达式）
  19.     svr.Get("/s", [&search](const httplib::Request &req, httplib::Response &rsp){
  20.             //has_param：这个函数用来检测用户的请求中是否有搜索关键字，参数中的word就是给用户关键字取的名字（类似word=split）   
  21.             if(!req.has_param("word")){   
  22.                 rsp.set_content("必须要有搜索关键字!", "text/plain; charset=utf-8");   
  23.                 return;   
  24.             }   
  26.             //获取用户输入的关键字
  27.             std::string word = req.get_param_value("word");   
  28.             std::cout << "用户在搜索：" << word << std::endl;   
  29.             
  30.             //根据关键字，构建json串
  31.             std::string json_string;   
  32.             search.Search(word, &json_string);
  34.             //设置 get "s" 请求返回的内容，返回的是根据关键字，构建json串内容
  35.             rsp.set_content(json_string, "application/json");      
  36.             });   
  38.     std::cout << "服务器启动成功......" << std::endl;
  40.     // 绑定端口（8080），启动监听（0.0.0.0表示监听任意端口）
  41.     svr.listen("0.0.0.0", 3877);                                                                                                                                                      
  42.     return 0;   
  43. }
复制代码


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


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


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


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


最终，在浏览器上就表现出来了，到这里我们的后端内容大抵上算是完成了，最后添加一个日记就可以了，如果你对前端不感爱好，到这里就可以了。可以把日记功能的添加看一看
九、添加日记到项目中

我们创建一个log.hpp的头文件，需要添加日记的地方：index模块，searcher模块、http_server模块。代码如下：
  1. #pragma once     
  2. #include <iostream>   
  3. #include <string>   
  4. #include <ctime>   
  5.    
  6. #define NORMAL 1   //正常的                                                                                                                                                                     
  7. #define WARNING 2  //错误的     
  8. #define DEBUG 3    //bug   
  9. #define FATAL 4    //致命的   
  10.    
  11. #define LOG(LEVEL, MESSAGE) log(#LEVEL, MESSAGE, __FILE__, __LINE__)        
  12.    
  13. void log(std::string level, std::string message, std::string file, int line)   
  14. {   
  15.     // 打印日志信息
  16.     std::cout << "[" << level << "]"
  17.               << "[" << time(nullptr) << "]"
  18.               << "[" << message << "]"
  19.               << "[" << file << " : " << line << "]"
  20.               << std::endl;
  21. }
复制代码
简单阐明：
我们用宏来实现日记功能，其中LEVEL表明的是品级（有四种），
这里的#LEVEL的作用是：把一个宏参数变成对应的字符串（直接替换）
C语言中的预定义符号：


  • __FILE__：进行编译的源文件
  • __LINE__：文件的当前行号
补充几个：


  • __DATE__：文件被编译的日期
  • __TIME__：文件被编译的时间
  • __FUNCTION__：进行编译的函数
假设在如下示例代码：
  1. int main() {
  2.     LOG(NORMAL, "This is a normal log message");
  3.     LOG(WARNING, "This is a warning log message");
  4.     LOG(DEBUG, "This is a debug log message");
  5.     LOG(FATAL, "This is a fatal log message");
  6.     return 0;
  7. }
复制代码
编译并运行这段代码后，输出会类似于：


所以我们可以将日记添加到有输收支口的地方，方便监视我们的代码那里出现了题目。
   日记体系的作用
  

  • 调试和错误追踪：记录步伐执行过程中的各种状态和错误信息，方便定位和修复题目。
  • 运行监控：监控步伐的运行状态，了解步伐的执行流程和紧张事件。
  • 审计和分析：分析日记记录，了解用户举动和体系性能，进行数据挖掘和改进。
十、编写前端模块

前端模块，我做详细的表明，代码中都有表明，直接上代码
  1. <!DOCTYPE html>                                                                                                                                                                                                                                                     
  2. <html lang="en">
  4. <head>
  5.     <meta charset="UTF-8">
  6.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
  9.     <title>boost 搜索引擎</title>
  10.     <style>
  11.         /*去掉网页中的所有内外边距，可以了解html的盒子模型*/
  12.         * {
  13.             margin: 0;
  14.             /* 设置外边距 */
  15.             padding: 0;
  16.             /* 设置内边距 */
  17.         }
  19.         /* 将我们的body内的内容100%和html的呈现吻合 */
  20.         html,
  21.         body {
  22.             height: 100%;
  23.         }
  25.         /* 以点开头的称为类选择器.container */
  26.         .container {
  27.             /* 设置div的宽度 */
  28.             width: 800px;
  29.             /* 通过设置外边距达到居中对其的目的 */
  30.             margin: 0px auto;
  31.             /* 设置外边距的上边距，保持元素和网页的上部距离 */
  32.             margin-top: 15px;
  33.         }
  35.         /* 复合选择器，选中container下的search */
  36.         .container .search {
  37.             /* 宽度与父标签保持一致 */
  38.             width: 100%;
  39.             /* 高度设置52px */
  40.             height: 50px;
  41.         }
  43.         /* 选中input标签,直接设置标签的属性，先要选中，标签选择器 */
  44.         /* input在进行高度设置的时候，没有考虑边框的问题 */
  45.         .container .search input {
  46.             /* 设置left浮动 */
  47.             float: left;
  48.             width: 600px;
  49.             height: 50px;
  50.             /* 设置边框属性，依次是边框的宽度、样式、颜色 */
  51.             border: 2px solid #CCC;
  52.             /* 去掉input输入框的右边框 */
  53.             border-right: none;
  54.             /* 设置内内边距，默认文字不要和左侧边框紧挨着 */
  55.             padding-left: 10px;
  56.             /* 设置input内部的字体的颜色和样式 */
  57.             color: #CCC;
  58.             color: #CCC;
  59.             font-size: 17px;
  60.         }
  62.         .container .search button {
  63.             /* 设置left浮动 */
  64.             float: left;
  65.             width: 150px;
  66.             height: 54px;
  67.             /* 设置button的背景颜色 #4e6ef2*/
  68.             background-color: #4e6ef2;
  69.             color: #FFF;
  70.             /* 设置字体的大小 */
  71.             font-size: 19px;
  72.             font-family: Georgia, 'Times New Roman', Times, serif 'Times New Roman', Times, serif;
  73.         }
  75.         .container .result {
  76.             width: 100%;
  77.         }
  79.         .container .result .item {
  80.             margin-top: 15px;
  81.         }
  83.         .container .result .item a {
  84.             /* 设置为块级元素，单独占一行 */
  85.             display: block;
  86.             text-decoration: none;
  87.             /* 设置a标签中的文字字体大小 */
  88.             font-size: 22px;
  89.             /* 设置字体的颜色 */
  90.             color: #4e6ef2;
  91.         }
  93.         .container .result .item a:hover {
  94.             /* 设置鼠标放在a之上的动态效果 */
  95.             text-decoration: underline;
  96.         }
  98.         .container .result .item p {
  99.             margin-top: 5px;
  100.             font-size: 16px;
  101.             font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  102.         }
  104.         .container .result .item i {
  105.             /* 设置为块级元素，单独占一行 */
  106.             display: block;
  107.             /* 取消斜体风格 */                                                                                                                                                                                                                                      
  108.             font-style: normal;
  109.             color: green;
  110.         }
  111.     </style>
  112. </head>
  114. <body>
  115.     <div class="container">
  116.         <div class="search">
  117.             <input type="text" value="输入搜索关键字...">
  118.             <button onclick="Search()">搜索一下</button>
  119.         </div>
  120.         <div class="result">
  121.             <!-- <div class="item">
  122.                 <a href="#">这是标题</a>
  123.                 <p>这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要</p>
  124.                 <i>https://hao.360.com/?hj=llq7a</i>
  125.             </div>
  126.             <div class="item">
  127.                 <a href="#">这是标题</a>
  128.                 <p>这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要</p>
  129.                 <i>https://hao.360.com/?hj=llq7a</i>
  130.             </div>
  131.             <div class="item">
  132.                 <a href="#">这是标题</a>
  133.                 <p>这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要</p>
  134.                 <i>https://hao.360.com/?hj=llq7a</i>
  135.             </div>
  136.             <div class="item">
  137.                 <a href="#">这是标题</a>
  138.                 <p>这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要</p>
  139.                 <i>https://hao.360.com/?hj=llq7a</i>
  140.             </div>
  141.             <div class="item">
  142.                 <a href="#">这是标题</a>
  143.                 <p>这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要</p>
  144.                 <i>https://hao.360.com/?hj=llq7a</i>
  145.             </div>
  146.             <div class="item">
  147.                 <a href="#">这是标题</a>
  148.                 <p>这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要这是摘要</p>
  149.                 <i>https://hao.360.com/?hj=llq7a</i>
  150.             </div> -->
  151.         </div>
  152.     </div>
  153.     <script>
  154.         function Search() {
  155.             // 是浏览器的一个弹出窗
  156.             // 1.提取数据,$可以理解为就是JQuery的别称
  157.             let query = $(".container .search input").val();
  158.             console.log("query = " + query); //console是浏览器对话框，可以用来进行查看js数据
  160.             // 2.发起http请求，ajax属于一个和后端进行数据交互的函数
  161.             $.ajax({
  162.                 type: "GET",
  163.                 url: "/s?word=" + query,
  164.                 success: function (data) {
  165.                     console.log(data);
  166.                     BuildHtml(data);
  167.                 }
  168.             });
  169.         }
  170.         function BuildHtml(data) {
  171.             // 获取html中的result标签
  172.             let result_lable = $(".container .result");
  173.             // 清空历史搜索结果
  174.             result_lable.empty();
  176.             for (let elem of data) {
  177.                 console.log(elem.title);
  178.                 console.log(elem.url);
  179.                 let a_lable = $("<a>", {
  180.                     text: elem.title,
  181.                     href: elem.url,
  182.                     // 跳转到新的页面
  183.                     target: "_blank"
  184.                 });
  185.                 let p_lable = $("<p>", {
  186.                     text: elem.desc
  187.                 });
  188.                 let i_lable = $("<p>", {
  189.                     text: elem.url
  190.                 });
  191.                 let div_lable = $("<div>", {
  192.                     class: "item"
  193.                 });
  194.                 a_lable.appendTo(div_lable);
  195.                 p_lable.appendTo(div_lable);
  196.                 i_lable.appendTo(div_lable);
  197.                 div_lable.appendTo(result_lable);
  198.             }
  199.         }                                                                                                                                                                                                                                                           
  200.     </script>
  201. </body>
  203. </html>
复制代码
最终演示：




  • 将我们的项目部署到Linux上： nohup ./http_server > log/log.txt 2>&1 &
  • 一些日记信息就会保存到log/log.txt中
十一. 详解传 gitee

在 Ubuntu 上向 Gitee（码云）上传代码，通常需要通过 Git 进行。下面是详细步骤：

  • 安装 Git：
    如果你还没有安装 Git，可以通过以下下令来安装：
  1. sudo apt-get update
  2. sudo apt-get install git
复制代码

  • 配置 Git：
    初次使用 Git 时，需要设置你的用户名和邮箱地址。这将用于提交信息。
  1. git config --global user.name "你的用户名"
  2. git config --global user.email "你的邮箱@example.com"
复制代码

  • 创建 Gitee 仓库：
    登录到 Gitee 并创建一个新的仓库。记下仓库的 URL。
  • 初始化本地仓库（如果你还没有一个本地 Git 仓库）：




    • 打开终端并导航到你的项目目录。
    • 初始化一个新的 Git 仓库：

  1. git init
复制代码




    • 添加远程仓库链接（替换 your-repo-url 为你的 Gitee 仓库 URL）：

  1. git remote add origin your-repo-url
复制代码

  • 添加文件到仓库：


  • 将所有文件添加到暂存区：
  1. git add .
复制代码




    • 或者你可以选择性地添加特定文件：

  1. git add 文件名
复制代码

  • 提交更改：


  • 提交文件到本地仓库，并附上提交信息：
  1. git commit -m "初始提交或描述本次提交的内容"
复制代码

  • 推送到 Gitee：


  • 推送你的本地分支到 Gitee 仓库的主分支（通常是 master 或 main）：
  1. git push -u origin master
复制代码




    • 如果你的默认分支是 main 而不是 master，请相应地调整下令

  1. git push -u origin main
复制代码

  • 验证：


  • 打开 Gitee 网站上的仓库页面，确认文件已经成功上传。

如果你在推送过程中遇到权限题目，确保你在 Gitee 上正确设置了 SSH 密钥或使用了正确的 HTTPS 凭证。


  • 如果使用的是 HTTPS 方式，可能需要输入 Gitee 的用户名和密码或者使用个人访问令牌。
  • 如果是 SSH 方式，则需要生成 SSH 密钥对并将公钥添加到 Gitee 账户中。

   1.题目
  git add .报错warning: adding embedded git repository: carreport hint: You‘ve added another git...
  

缘故原由：
使用 git add . 时，出现上述错误。是由于在当前 git 仓库中同时包含有另一个git仓库。如当前仓库目录下的子文件夹内又是一个仓库。
解决：
删除子文件夹的.git文件， 重新add commit push
   2.出错：
! [rejected] master -> master (fetch first) error: failed to push some refs to ' 。。。'
  

出现这个题目是由于github中的README.md文件不在本地代码目录中，可以通过如下下令进行代码归并
git pull --rebase origin master
十二、项目总结

项目标扩展

1. 建立整站搜刮


  • 我们搜刮的内容是在boost库下的doc目录下的html文档，你可以将这个库建立搜刮，也可以将所有的版本，但是本钱是很高的，对单个版本的整站搜刮还是可以完成的，取决于你服务器的配置。
2. 计划一个在线更新的方案，信号，爬虫，完成整个服务器的计划


  • 我们在获取数据源的时候，是我们手动下载的，你可以学习一下爬虫，写个简单的爬虫步伐。采用信号的方式去定期的爬取。
3. 不使用组件，而是本身计划一下对应的各种方案


  • 我们在编写http_server的时候，是使用的组件，你可以本身计划一个简单的；
4. 在我们的搜刮引擎中，添加竞价排名


  • 我们在给用户反馈是，提供的是json串，表现到网页上，有title、content和url；就可以在构建json串时，你加上你的博客链接（将博客权重变高了，就可以或许表现在第一个）
5. 热次统计，智能表现搜刮关键词（字典树，优先级队列）
6. 设置登陆注册，引入对mysql的使用

以上就是对于C++项目--基于Boost库的搜刮引擎 的理解，完结撒花~
后续还会继续更新一些项目 ，有爱好的小同伴欢迎大家订阅【项目】专栏~

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。

本帖子中包含更多资源

您需要 登录 才可以下载或查看，没有账号？立即注册

x
回复

使用道具 举报

0 个回复

倒序浏览
返回列表

快速回复

高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

用多少眼泪才能让你相信

金牌会员
这个人很懒什么都没写!

楼主热帖

标签云

挺好的 服务器
微信订阅号
微信服务号
微信客服
小程序
H5
关于我们 商务合作 网站地图
©Copyright 2022-2024 杭州祥升科技有限公司 版权所有 浙ICP备20004199号
快速回复 返回顶部 返回列表