这篇文章的内容主要围绕es+flask搜索小项目实现分页和高亮的示例代码怎么写进行讲述,文章内容清晰易懂,条理清晰,非常适合新手学习,值得大家去阅读。感兴趣的朋友可以跟随小编一起阅读吧。希望大家通过这篇文章有所收获!
前端:html,css,js,jQuery,bootstrap
后端:flask
搜索引擎:elasticsearch
数据源:某某之家
获取数据源并写入es
from lxml import etree
from concurrent.futures import ThreadPoolExecutor
from elasticsearch import Elasticsearch
from elasticsearch import helpers
import requests
headers = {
'user-agent': 'ua'
}
es = Elasticsearch()
if not es.indices.exists(index='car'):
es.indices.create(index='car', mappings={
'properties': {
'url': {
'type': 'text'
},
'img': {
'type': 'text'
},
'title': {
'type': 'text'
},
'desc': {
'type': 'text'
}
}
})
def task(url,page):
res = requests.get(url, headers)
text = res.text
tree = etree.HTML(text)
ul_list = tree.xpath('//ul[@class="article"]')
actions = []
for ul in ul_list:
li_list = ul.xpath('./li')
for li in li_list:
url = li.xpath('./a/@href'),
img = li.xpath('./a/div/img/@src'),
desc = li.xpath('./a/p/text()'),
title = li.xpath('./a/h4/text()')
if title:
doc = {
'_index': 'car',
'url': f'https:{url[0][0]}',
'img': img[0][0],
'desc': desc[0][0],
'title': title[0],
}
actions.append(doc)
helpers.bulk(es, actions=actions)
print(f'第{page}页完成!')
def main():
with ThreadPoolExecutor() as pool:
for i in range(1, 11):
url = f'https://www.autohome.com.cn/all/{i}/'
pool.submit(task, url=url,page=i)
if __name__ == '__main__':
main()
视图函数
from flask import Blueprint
from flask import request
from flask import render_template
from flask import jsonify
from web.ext import es
from pprint import pprint
search_bp = Blueprint('search', __name__, url_prefix='/search')
@search_bp.route('/', methods=['get', 'post'])
def search():
if request.method == 'GET':
return render_template('search.html')
elif request.method == 'POST':
content = request.values.get('content')
size = 10
current = int(request.values.get('current', '0'))
if content:
res = es.search(index='car', query={
'match': {
"title": content
}
}, highlight={
"pre_tags": "<span style='color: red'>"
,
"post_tags": "</span>"
,
"fields": {
"title": {}
}
}, size=1000)
else:
res = es.search(index='car', query={
'match_all': {}
}, size=1000)
new_res = res['hits']['hits']
total = int(res['hits']['total']['value'])
need_page = (total // size) + 1
data = {
'res': new_res[current * size:current * size + size],
'need_page': need_page,
'total': total
}
return jsonify(data)
前端
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>General Search</title>
<link rel="stylesheet" href="{{ url_for('static',filename='css/bootstrap.min.css') }}">
<script src="{{ url_for('static',filename='js/jQuery.js') }}"></script>
<script src="{{ url_for('static',filename='js/bootstrap.min.js') }}"></script>
<style>
.title{
font-size: 25px;
font-weight: 10;
}
.result{
color: red;
}
</style>
</head>
<body>
<div>
<nav class="navbar navbar-default">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#" >General Search</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
</ul>
<div class="navbar-form navbar-left">
<div class="form-group">
<input type="text" class="form-control" placeholder="" id="content" >
</div>
</div>
<button class="btn btn-primary pull-right" id="submit" >搜 索</button>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
</div>
<div class="container">
General为您找到相关结果约<span id='count' class="result">0</span>个
<hr>
</div>
<div class="container" id="tags">
</div>
<div class="text-center">
<nav aria-label="Page navigation">
<ul class="pagination" id="page">
</ul>
</nav>
</div>
<script>
function getData(current)
{
let content=$('#content').val()
let tags=$('#tags')
$('#count').text()
tags.empty()
$.ajax({
url:"",
type:'post',
data:{
'content':content,
'current':current
},
dataType:'JSON',
success:function (res){
let length=res.total
let need_page=res.need_page
$('#count').text(length)
$.each(res.res,function (index,value){
let source=value._source
let title=source.title
let highlight=value.highlight
if (highlight)
{
title=highlight.title
}
let div=`
<div>
<p><a href="${source.url}" target="_blank">
<span class="title">${title}</span>
<br>
<img src="${source.img}" alt="">
</a></p>
<p>${source.desc}</p>
<hr>
</div>
`
tags.append(div)
})
$('#page').empty()
for(let i=0;i<need_page;i++)
{
let tmp=i+1
if (current==i)
{
$('#page').append('<li class="active"><span class="changePage">'+tmp+'</span></li>')
}
else {
$('#page').append('<li><span class="changePage">'+tmp+'</span></li>')
}
}
}
})
}
$('#submit').click(function (){
getData(0)
})
$('#page').on('click','li',function (){
getData($(this).text()-1)
})
</script>
</body>
</html>
app配置
from flask import Flask
from flask_session import Session
from web.ext import db
from .search.search import search_bp
from flask_script import Manager
from flask_migrate import Migrate, MigrateCommand
def create_app():
app = Flask(__name__)
app.config.from_object('settings.DevelopmentConfig')
app.register_blueprint(search_bp)
Session(app)
db.init_app(app)
app = Manager(app)
Migrate(app, db)
app.add_command('db', MigrateCommand)
return app
感谢你的阅读,相信你对“es+flask搜索小项目实现分页和高亮的示例代码怎么写”这一问题有一定的了解,快去动手实践吧,如果想了解更多相关知识点,可以关注亿速云网站!小编会继续为大家带来更好的文章!
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。