이 기사에서는 Angular 및 Elasticsearch를 사용하여 레시피 검색 웹 사이트를 구축하는 것을 보여줍니다. Solr 또는 Lucene과 레슬링에 지쳤습니까? 오픈 소스, 루센 기반 스토리지 엔진 인 Elasticsearch는 2010 년 이후 더 간단한 솔루션을 제공합니다. 단순한 검색 엔진 이상입니다. 검색 속도를 우선시하는 문서 저장소입니다. 많은 응용 프로그램의 경우 전체 백엔드 역할을 할 수 있습니다.
주요 장점 :
쉽게 구할 수있는 JSON 레시피 데이터 세트 인 OpenRecipes와의 엘라스틱 검색의 JSON 호환성을 활용합니다.
는 다양한 환경과의 간단한 상호 작용을 위해 Elasticsearch의 RESTFUL API를 사용합니다 (여기에서 사용되는 JavaScript 드라이버).
는 사용자 인터페이스에 angularjs를 사용하며 효율적인 데이터 검색 및 디스플레이를 위해 Elasticsearch 백엔드와 완벽하게 통합합니다.
는 Elasticsearch 인스턴스를 보호하기위한 프록시의 필요성을 강조하여 배포 보안 문제를 해결합니다 (고유 한 사용자/권한 제어 부족).
레시피 검색 엔진 구축 :
이 자습서는 OpenRecipesearch.com과 유사한 레시피 검색 엔진을 만들어 안내합니다. OpenRecipes는 Elasticsearch의 JSON 구조와 완벽하게 정렬되는 편리한 JSON 형식을 제공합니다.
설정 : elasticsearch 다운로드 및 실행. 내장 된 RESTFUL 백엔드는 상호 작용을 단순화합니다. 이 예에서는 JavaScript 드라이버가 사용됩니다
데이터 수집 : - OpenRecipes 데이터베이스 (큰 JSON 파일)를 얻습니다. 제공된 node.js 스크립트 ()는이 데이터를 Elasticsearch에 효율적으로로드합니다. 이 스크립트는 Elasticsearch javaScript 라이브러리 ()를 사용합니다
검증 : (사용 가능한 경우)를 사용하여 데이터 가져 오기 확인 :
- 레시피 구축 UI (각도 포함) :
AngularJS는 사용자 인터페이스를 만드는 데 사용됩니다. 과정에는 다음과 같습니다
사용자 입력 : - 사용자가 검색 쿼리를 입력합니다
Query는 Elasticsearch로 전송됩니다
결과 검색 : 검색 결과가 검색됩니다
결과 렌더링 :
- 결과는 사용자에게 표시됩니다
제공된 HTML 코드는 검색 인터페이스를 구축하는 데 사용되는 각도 지침을 보여줍니다. 지시문 (
, 등), 템플릿 변수 () 및 데이터 바인딩을 포함하여 주요 각도 개념이 설명됩니다.
JavaScript 코드에는 다음이 포함됩니다
모듈 생성 : - 각도 모듈을 설정합니다
컨트롤러 () : 검색 및 페이지 매김을 포함한 UI 상호 작용을 관리합니다
Service () :
window.MyOpenRecipes = angular.module('myOpenRecipes', ['elasticsearch'], ...);
는 Elasticsearch 백엔드와의 커뮤니케이션을 처리합니다. 이 서비스는 Elasticsearch JavaScript 라이브러리와 약속 처리를위한 서비스를 사용합니다.
-
배포 참고 :
생산 배포의 경우 elasticsearch 인스턴스를 보호하십시오. Elasticsearch에는 내장 사용자/권한 관리가 부족합니다. 프록시 (예 : nginx)는 필요한 엔드 포인트에만 액세스를 제한하는 것이 좋습니다 (예 : ).
recipeCtrl
결론 :
이 튜토리얼은 Angular 및 Elasticsearch를 사용하여 기능 레시피 검색 웹 사이트를 구축하는 실용적인 가이드를 제공합니다. 전체 코드는 GitHub에서 사용할 수 있습니다 (원본 텍스트로 제공되지 않은 링크). FAQ 섹션은 페이지 매김, 쿼리 최적화, 오류 처리, 보안, 테스트, 배포, 실시간 검색, 집계, 자동 완성 및 클러스터 성능 모니터링과 관련된 일반적인 질문을 다룹니다.
위 내용은 Angular 및 Elasticsearch가있는 레시피 검색 사이트 구축의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!