如何使用 Atlas App Services 创建搜索用户界面

为您的 Atlas 组织或项目创建 API 密钥并配置 API 访问列表。

要创建 API 密钥并配置 API 密钥的 API 访问列表，请参阅以下页面：

• 在组织中创建API密钥

  对于组织，您必须为 API 密钥分配Organization Member组织角色或更高级别的角色，并邀请组织 API 密钥加入您的项目。

• 为项目创建API密钥

  对于项目，您必须为 API 密钥分配Project Owner项目角色。

（可选）为您的 API 密钥设置以下环境变量。

1. 将private_key_value替换为您的私有 API 密钥，然后运行以下命令：

   private_key={private_key_value}

2. 将public_key_value替换为您的公共 API 密钥，然后运行以下命令：

   public_key={public_key_value}

创建 App Services 应用并复制其 ID。

1. 转到 App Services。

2. 创建应用。

3. 查找应用程序 ID。

4. 从应用程序仪表盘复制 App ID 。

（可选）为您的 App Services 应用设置环境变量。

将app_id_value替换为您的 App Services App ID并运行以下命令：

app_id={app_id_value}

克隆reactivesearch-realm-project存储库。

运行以下命令克隆 reactivesearch-realm-project 存储库：

git clone https://github.com/appbaseio/reactivesearch-realm-function.git

安装依赖项。

1. 更改工作目录：

   cd reactivesearch-realm-function

2. 运行以下命令之一以安装项目依赖项：

   yarn

   npm install

部署 ReactiveSearch API。

1. 运行以下命令之一：

   • 要在未启用基本身份验证的情况下部署 ReactiveSearch API，请运行以下命令：

     node rs-cli --private-api-key $private_key --api-key $public_key --app-id $app_id

   • 要部署启用基本身份验证的 Reactive Search API，请将my-user和my-password替换为您的用户名和密码，然后运行以下命令：

     node rs-cli --private-api-key $private_key --api-key &$public_key --app-id $app_id --app-authentication <my-user>:<my-password>

   如果部署成功，输出应类似于以下示例：

   1
    Successfully deployed webhook.
   2
   3
    Deployed webhook endpoint : https://us-east-1.aws.data.mongodb-api.com/app/application-0-iuzth/endpoint/http_endpoint_reactivesearch
   4
   5
    You can make a test request to this webhook using this curl command
   6
   7
   curl -XPOST https://us-east-1.aws.data.mongodb-api.com/app/application-1-ftcqo/endpoint/http_endpoint_reactivesearch  \
   8
           -H "Content-Type: application/json" \
   9
           -d '{
   10
                "query": [{
   11
                             "id": "search",
   12
                             "dataField": "*",
   13
                             "size": 5
   14
                }],
   15
                "mongodb": {
   16
                             "db": "'"$database"'",
   17
                             "collection": "'"$collection"'"
   18
                }
   19
   }'

2. 从输出中复制 HTTPS 端点（以前的 Webhook）URL（在上一示例中突出显示）。

3. （可选）从输出中复制 curl 命令，指定数据库和集合（在以下示例中突出显示），然后运行命令以验证 HTTPS 端点：

   1
   curl -XPOST https://us-east-1.aws.data.mongodb-api.com/app/application-1-ftcqo/endpoint/http_endpoint_reactivesearch  \
   2
           -H "Content-Type: application/json" \
   3
           -d '{
   4
                "query": [{
   5
                             "id": "search",
   6
                             "dataField": "*",
   7
                             "size": 5
   8
                }],
   9
                "mongodb": {
   10
                             "db": "'"sample_airbnb"'",
   11
                             "collection": "'"listingsAndReviews"'"
   12
                }
   13
   }'

下载搜索用户界面文件。

1. 打开终端并运行以下命令以克隆 searchbox 存储库：

   git clone https://github.com/appbaseio/searchbox.git

2. 运行以下命令创建临时目录。

   mkdir tmp

3. 复制本地 搜索用户界面目录 到临时目录：

   cp -R searchbox/packages/react-searchbox/examples/by-usecases/facet-filters tmp

编辑App.js文件。

1. 从以下目录打开App.js文件：

   /tmp/facet-filters/src

2. 将第11行的 URL 替换为您的 HTTPS 端点（以前称为 Webhook）URL 并保存文件。

构建搜索用户界面。

1. 运行以下命令以更改工作目录：

   cd ../

2. 运行以下命令之一以构建搜索用户界面应用程序：

   yarn && yarn build

   npm install && npm run build

   该命令会将搜索用户界面文件放置在/tmp/facet-filters/build目录中。

使用 Vercel 部署 React 站点。

要了解更多信息，请参阅 如何使用 Vercel 部署 React 站点。

示例：

运行以下命令并按照提示操作：

vercel

打开托管页面。

将返回的预览 URL 复制并粘贴到浏览器中。

查看 Atlas Search 查询结果。

在 Searchbox 用户界面中查看facet-filter使用案例的搜索查询结果。