使用 Appbaseio 和 ReactiveSearch 索引用户查询

Question

我正在尝试使用 ReactiveSearch 的 DataSearch 组件和 appbase-js 为用户的查询编制索引。

所以我制作了我的 Node/Express 应用程序，用于 appbase-js 与 appbaseio 的交互。在 app.js:

...
const search = require('./routes/search');
...
app.use('/api/search', search);

那么这是我的search.js

const express = require('express');
const Appbase = require('appbase-js');

// create an appbase.io app's instance
const appbaseRef = new Appbase({
  url: "https://scalr.api.appbase.io",
  app: "index-query",
  credentials: "####-####"
});

const router = express.Router();

/* GET search. */
router.get('/test', (req, res, next) => {
  res.send('This is the SEARCH route - and it WORKS!');
});


router.post('/query', (req, res, next) => {
  appbaseRef.index({
    type: "autocomplete",
    body: value
  }).then('data', response => {
    console.log("@index success: ", response);
  }),('error', error => {
    console.log("@index error: ", error);
  });
});

module.exports = router;

然后这是我的 DataSearch 组件：

<DataSearch
   componentId="SearchSensor"
   dataField={["suggestions"]}
   className="search-bar"
   iconPosition="right"
   innerclassName={{
     list: "text-item"
   }}
   onValueSelected{
     (value) => {
      ????
      }
   } 
  />

我在另一个问题中被建议不要这样做:

onValueSelected={(value) => {
    fetch('YOUR_SERVER_URL' or 'Elasticsearch URL', { method: 'POST', body: {...} })
  }

以免暴露客户端的敏感信息

我不确定如何从我的 React 前端获取价值（用户的查询）到我的 Node/Express 后端，以便它可以被索引到 Appbaseio 上的 ES 应用程序？

Answer 1

假设您的服务器托管在 'SERVER_URL'，关键是通过 fetch 请求将数据从前端发送到服务器：

<DataSearch
  ...
  onValueSelected={(value) => {
    fetch('SERVER_URL/api/search/query', {
      method: 'POST',
      body: JSON.stringify({ value })
    }).then(() => handle response client side))
  }}
/>

然后你可以添加 body-parser middleware in express.

app.use(bodyParser.json())

在您的路线中，您可以使用来自 body 的 value 和 index 到 elasticsearch。您可以使用此处使用的 appbase-js 中的 index 方法。

router.post('/query', (req, res, next) => {
  appbaseRef.index({
    type: "autocomplete",
    body: { value: req.body.value }
  }).then('data', response => {
    console.log("@index success: ", response);
  }),('error', error => {
    console.log("@index error: ", error);
  });
});

使用 Appbaseio 和 ReactiveSearch 索引用户查询

Indexing user query with Appbaseio and ReactiveSearch

indexing

node.js

elasticsearch

reactjs

reactivesearch