太仓苏州网站建设,工业智能科技网站设计,怎么做健康咨询网站,通辽网站制作高亮
首先介绍一下什么是搜索的关键词达到高亮的效果#xff0c;如图所示 当在百度里面搜索elasticsearch的时候#xff0c;可以看到出现的搜索结果里面elasticsearch这个关键词明显与其他的条文不一样#xff0c;用红颜色凸显了“高亮效果”。当我们想要在自己的项目里面…高亮
首先介绍一下什么是搜索的关键词达到高亮的效果如图所示 当在百度里面搜索elasticsearch的时候可以看到出现的搜索结果里面elasticsearch这个关键词明显与其他的条文不一样用红颜色凸显了“高亮效果”。当我们想要在自己的项目里面也实现相同的高亮效果可以借助ES来帮助我们实现。
通过ES实现高亮效果
现在有一个场景输入相关的面试题题目返回的结果中题目出现高亮效果类似这样的效果 那么后端的逻辑应该怎么写呢只说明核心逻辑
首先在查询ES的时候就设置好相应的高亮属性 private EsSearchRequest createSearchListQuery(SubjectInfoES req){EsSearchRequest esSearchRequest new EsSearchRequest();BoolQueryBuilder boolQueryBuilder new BoolQueryBuilder();//构造查询条件-根据题目名字查询MatchQueryBuilder matchNameQueryBuilder QueryBuilders.matchQuery(EsSubjectFields.SUBJECT_NAME,req.getSubjectName());boolQueryBuilder.should(matchNameQueryBuilder);//设置高亮matchNameQueryBuilder.boost(2);//其他的代码逻辑...//设置高亮HighlightBuilder highlightBuilder new HighlightBuilder().field().requireFieldMatch(false);highlightBuilder.preTags(span style \color:red\);highlightBuilder.postTags(/span);//设置高亮和条件esSearchRequest.setHighlightBuilder(highlightBuilder);esSearchRequest.setBoolQueryBuilder(boolQueryBuilder);//其他的代码逻辑...return esSearchRequest;}这里通过 HighlightBuilder highlightBuilder new HighlightBuilder().field().requireFieldMatch(false); 构造了一个ES的高亮器 在这里field() 表示要对所有字段进行高亮处理 requireFieldMatch(false) 表示不需要确切字段匹配即如果任何字段中包含查询的关键字都会被高亮显示 如果设置为requireFieldMatch(true)的话 即查询出来的字段中要完全包含查询的关键字才会被高亮处理 highlightBuilder.preTags(span style \color:red\);highlightBuilder.postTags(/span);这两段代码的意思是要实现高亮的字段在返回给前端的时候会被span style \color:red\和/span囊括起来举个例子span style \color:red\ elasticsearch倒排索引为什么快 /span。 //设置高亮和条件esSearchRequest.setHighlightBuilder(highlightBuilder);esSearchRequest.setBoolQueryBuilder(boolQueryBuilder);这两段代码的作用是设置搜索关键词实现高亮和实现高亮的关键词是哪些关键词
在设置好高亮的相关条件以后就得从ES中查询相关的数据了并且处理相关的数据 public PageResultSubjectInfoES querySubjectList(SubjectInfoES req) {PageResultSubjectInfoES pageResult new PageResult();//设置相关条件EsSearchRequest esSearchRequest createSearchListQuery(req);//搜索SearchResponse searchResponse EsRestClient.searchWithTermQuery(getEsIndexInfo(),esSearchRequest);//获取Elasticsearch搜索响应中包含的搜索结果SearchHits searchHits searchResponse.getHits();SearchHit[] hits searchHits.getHits();//遍历响应结果for (SearchHit hit : hits) {//将ES返回的结果映射到返回的实体中的代码....//开始处理高亮//高亮的字段MapString, HighlightField highlightFields hit.getHighlightFields();//处理name的高亮字段HighlightField nameHighlightField highlightFields.get(EsSubjectFields.SUBJECT_NAME);if (ObjectUtils.isNotEmpty(nameHighlightField)){Text[] fragments nameHighlightField.fragments();StringBuilder stringBuilder new StringBuilder();for (Text fragment : fragments){stringBuilder.append(fragment.string());}result.setSubjectName(stringBuilder.toString());}//处理内容中的高亮字段HighlightField answerHighlightField highlightFields.get(EsSubjectFields.SUBJECT_ANSWER);if (ObjectUtils.isNotEmpty(answerHighlightField)){Text[] fragments answerHighlightField.fragments();StringBuilder stringBuilder new StringBuilder();for (Text fragment : fragments){stringBuilder.append(fragment.string());}result.setSubjectAnswer(stringBuilder.toString());}//将ES返回的结果映射到返回的实体中的代码....}//其他的代码逻辑return pageResult;}这段代码展现了如何处理高亮核心代码实际上是这一段 //高亮的字段MapString, HighlightField highlightFields hit.getHighlightFields();//处理name的高亮字段HighlightField nameHighlightField highlightFields.get(EsSubjectFields.SUBJECT_NAME);if (ObjectUtils.isNotEmpty(nameHighlightField)){Text[] fragments nameHighlightField.fragments();StringBuilder stringBuilder new StringBuilder();for (Text fragment : fragments){stringBuilder.append(fragment.string());}result.setSubjectName(stringBuilder.toString());}首先调用hit.getHighlightFields()方法返回一个包含文档中高亮字段的映射,然后从高亮字段映射中获取名为 “SUBJECT_NAME” 的高亮字段也就是题目名字从高亮字段中提取相关的文本片段fragments() 方法返回一个 Text 对象数组每个 Text 对象表示高亮字段中的一个文本片段。
这里解释一下
现在假设用户搜索了关键词 “Elasticsearch”而搜索结果中包含了一篇文章的标题和摘要其中标题和摘要分别是两个字段。搜索结果如下
标题Introduction to Elasticsearch
如果我们对标题和摘要字段都进行了高亮处理那么可能会得到以下的高亮结果
高亮标题Introduction to span stylebackground-color: yellow; Elastic /spansearch
这个时候fragment段落的内容是Introduction to span stylebackground-color: yellow; Elastic /spansearch
最后将每个高亮的文本拼接成一个完整的字符串并存储在结果对象的相应属性中交给前端进行相应的处理前端可以使用 HTML 和 CSS 来展示高亮文本通常会将匹配的关键词用特殊样式标记例如使用 标签添加背景颜色以使用户能够直观地看到匹配的部分最后实现高亮效果。