微信小程序es高亮搜索
发布于 3 年前 作者 tangqiang 4481 次浏览 来自 分享
<l-search-bar placeholder="搜索" custom bind:linblur="search">
 
    <view name="icon"/>
  </l-search-bar>
 
 <!-- <rich-text nodes="{{item.title}}"></rich-text> -->
    <l-card type="primary" wx:for="{{search}}"
    
            image="{{item.image}}"
            title="{{item.title}}">
        <view class="content">
             <view>{{item.text}}</view>
             <view>作者:{{item.author}}</view>
        </view>
    </l-card>
js:

Page({
 
  /**
   * 页面的初始数据
   */
  data: {
    search:[]
  },
 
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
 
  },
  search(e){
    console.log(e)
    var title = e.detail.value
    var that = this
     wx.request({
      url: 'http://www.three.exam.com/api/search',
      data: {
        title:title
      },
      header: {
        token:wx.getStorageSync('token')
      },
      success (res) {
        console.log(res.data)
        that.setData({
          search:res.data.data
        })
      }
    })
  },
})
引入卡片 Card | Lin UI

json:

{
  "usingComponents": {
    "l-search-bar":"/miniprogram_npm/lin-ui/search-bar",
    "l-card":"/miniprogram_npm/lin-ui/card"
  }
}
php:

1.下载laravel8 支持的es插件 

composer require elasticsearch/elasticsearch
2.在要使用的地方引入ES

use Elasticsearch\ClientBuilder;
3.生成ES对象

$client = ClientBuilder::create()‐>setHosts('连接地址')‐>build();
具体代码:

  /**
     * 添加索引
     */
    public function create($results)
    {
        $client = ClientBuilder::create()->setHosts(['127.0.0.1:9200'])->build();
 
        if (!empty($results)){
            $data=[
                'id' => $results[0]['id'],
                'title' => $results[0]['title'],
                'image'=>$results[0]['image'],
                'author' => $results[0]['author'],
                'text'=>$results[0]['text']
            ];
        }else{
            $data=[
                'id' => 3,
                'title' => '我们的婚姻',
                'image'=>'https://img1.baidu.com/it/u=3834462090,3152406810&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=745',
                'author' => 'XXXX',
                'text'=>'把持都把持不住!'
            ];
        }
 
        //拼接数据
        $params = [
            'index' => 'article',
            'type' => '_doc',
            'id' => $data['id'],
            'body' => $data
        ];
        //存储到es中
        $response = $client->index($params);
        return $response;
    }
    /**
     * 文章展示
     */
    public function showArticle()
    {
        $data = Article::orderBy('id','desc')->get();
        return ['code'=>200,'msg'=>'展示成功','data'=>$data];
    }
    /**
     * 文章搜索
     */
    public function selectArticle(request $request)
    {
 
        $title = $request->get('title');
        $client = ClientBuilder::create()->setHosts(['127.0.0.1:9200'])->build();
        $params = [
            'index' => 'article',
            'type' => '_doc',
            'body' => [
                'query' => [
                    'match' => [
                        'title'=>[
                            'query' => $title
                        ]
                    ]
                ],
                'highlight'=>[
                    'fields'=>[
                        'title'=>[
                            'pre_tags'=>[
                                '<span style="color: red">'
                            ],
                            'post_tags'=>[
                                '</span>'
                            ]
                        ]
                    ]
                ]
            ]
        ];
 
            $results = $client->search($params);
        //如果es里有数据 走es高亮显示
        if ($results['hits']['hits']){
            foreach ($results['hits']['hits'] as $key => $item)
            {
                $results['hits']['hits'][$key]['_source']['title'] = $item['highlight']['title'][$key];
            }
            $results = array_column($results['hits']['hits'], '_source');
            return ['code'=>200,'msg'=>'es搜索成功','data'=>$results];
        }else{
            //没有数据就查询数据库然后再把数据添加到es索引中
            $where= [];
            $where[] = ['title','like',"$title"];
            $results = Article::where($where)->get()->toArray();
            //调用添加es方法
            $this->create($results);
            return ['code'=>200,'msg'=>'搜索成功','data'=>$results];
        }
    }
  /**
     * 修改
     * [@return](/user/return) array|callable
     */
    public function upArticle()
    {
        $client = ClientBuilder::create()->setHosts(['127.0.0.1:9200'])->build();
        //测试数据
        $data=[
            'id' => 3,
            'title' => '我们的婚姻',
            'image'=>'https://img1.baidu.com/it/u=3834462090,3152406810&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=745',
            'author' => 'XXXX',
            'text'=>'把持都把持不住!'
        ];
        $params = [
            'index' => 'article',
            'type' => '_doc',
            'id' => $data['id'],
            'body' => [
                'title' => $data['title'],
                'image' => $data['image'],
                'author' => $data['author'],
                'text'=> $data['text']
            ],
        ];
        $response = $client->index($params);
        return $response;
 
    }
  /**
     * 删除
     */
    public function deleteArticle()
    {
        $client = ClientBuilder::create()->setHosts(['127.0.0.1:9200'])->build();
        //测试数据
        $data=[
            'id' => 1,
            'title' => '红海行动',
            'image'=>'https://img0.baidu.com/it/u=352533610,629194150&fm=253&fmt=auto&app=138&f=JPEG?w=334&h=500',
            'author' => 'ssss',
            'text'=>'真人版吃鸡!'
        ];
        $params = [
            'index' => 'article',
            'type' => '_doc',
            'id' => $data['id'],
        ];
        $response = $client->delete($params);
        return $response;
    }
注意一定要先开起 elasticsearch 我用的es 6.5.3版本 

回到顶部