使用Angular和Elasticsearch构建食谱搜索网站
>本文展示了使用Angular和Elasticsearch构建食谱搜索网站。 厌倦了与Solr或Lucene搏斗? Elasticsearch是一种开源的,位于Lucene的存储引擎,自2010年以来提供了更简单的解决方案。它不仅仅是搜索引擎。这是一个文件存储,优先考虑搜索速度。对于许多应用程序,它可以用作整个后端。
键优点:
- >利用Elasticsearch与OpenRecipes的JSON兼容性,这是一个随时可用的JSON食谱数据集。
- >利用Elasticsearch的Restful API与各种环境进行直接互动(此处使用的JavaScript驱动程序)。 使用用户界面的AngularJS,与Elasticsearch后端无缝集成以进行有效的数据检索和显示。
- >通过强调要保护Elasticsearch实例的代理的需求(缺乏固有的用户/权限控制)。
- 构建食谱搜索引擎:
该教程通过创建类似于OpenRecipesearch.com的食谱搜索引擎为您引导您。 OpenRecipes提供了一种方便的JSON格式,与Elasticsearch的JSON结构完全一致。
设置:- >下载并运行Elasticsearch。它的内置静坐后端简化了互动。 在此示例中使用JavaScript驱动程序。
- > 数据摄入: 获取OpenRecipes数据库(一个大JSON文件)。提供的node.js脚本(
- )有效地将此数据加载到elasticsearch中。 该脚本使用Elasticsearch JavaScript库()。>
load_recipes.js
npm install elasticsearch
验证: >使用 - 验证数据导入的数据
curl
构建食谱搜索UI(带有角度):curl -XPOST http://localhost:9200/recipes/recipe/_search -d '{"query": {"match": {"_all": "cake"}}}'
> angularJS用于创建用户界面。 该过程涉及:
> 用户输入:
- 该查询被发送到elasticsearch。
- 结果检索:搜索结果。 >
- 结果渲染:>结果显示给用户。 >
- 提供的HTML代码展示用于构建搜索接口的角指令。 解释了关键的角度概念,包括指令(, 等),模板变量(
- )和数据绑定。
JavaScript代码包括:
-
>模块创建:
window.MyOpenRecipes = angular.module('myOpenRecipes', ['elasticsearch'], ...);
设置Angular模块。 -
>控制器(
recipeCtrl
):>管理UI相互作用,包括搜索和分页。 >
-
>服务(
recipeService
):处理与Elasticsearch后端的通信。 此服务使用Elasticsearch JavaScript库和$q
服务进行保证处理。
>部署注意:
)。> >用于生产部署,请保护您的Elasticsearch实例。 Elasticsearch缺乏内置的用户/权限管理;建议使用代理(例如nginx)来限制仅访问必要的端点(例如, /recipes/recipe/_search
结论:本教程提供了使用Angular和Elasticsearch构建功能食谱搜索网站的实用指南。 完整的代码可在GitHub上找到(原始文本中未提供链接)。 常见问题解答部分解决了有关分页,查询优化,错误处理,安全性,测试,部署,实时搜索,聚合,自动完成和集群性能监视的常见问题。
-
>模块创建:
以上是使用Angular和Elasticsearch构建食谱搜索网站的详细内容。更多信息请关注PHP中文网其他相关文章!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

热门话题

本文讨论了在浏览器中优化JavaScript性能的策略,重点是减少执行时间并最大程度地减少对页面负载速度的影响。

本文讨论了使用浏览器开发人员工具的有效JavaScript调试,专注于设置断点,使用控制台和分析性能。

本文说明了如何使用源地图通过将其映射回原始代码来调试JAVASCRIPT。它讨论了启用源地图,设置断点以及使用Chrome DevTools和WebPack之类的工具。

本文探讨了Java收藏框架的有效使用。 它强调根据数据结构,性能需求和线程安全选择适当的收集(列表,设置,地图,队列)。 通过高效优化收集用法

掌握了入门级TypeScript教程后,您应该能够在支持TypeScript的IDE中编写自己的代码,并将其编译成JavaScript。本教程将深入探讨TypeScript中各种数据类型。 JavaScript拥有七种数据类型:Null、Undefined、Boolean、Number、String、Symbol(ES6引入)和Object。TypeScript在此基础上定义了更多类型,本教程将详细介绍所有这些类型。 Null数据类型 与JavaScript一样,TypeScript中的null

本教程将介绍如何使用 Chart.js 创建饼图、环形图和气泡图。此前,我们已学习了 Chart.js 的四种图表类型:折线图和条形图(教程二),以及雷达图和极地区域图(教程三)。 创建饼图和环形图 饼图和环形图非常适合展示某个整体被划分为不同部分的比例。例如,可以使用饼图展示野生动物园中雄狮、雌狮和幼狮的百分比,或不同候选人在选举中获得的投票百分比。 饼图仅适用于比较单个参数或数据集。需要注意的是,饼图无法绘制值为零的实体,因为饼图中扇形的角度取决于数据点的数值大小。这意味着任何占比为零的实体
