#이 글은 처음에 나의 매체 출판물에 발표되었다.Here는 원본을 가리키는 링크입니다.
검색은 데이터를 처리하는 모든 모바일 응용 프로그램의 가장 중요한 기능 중의 하나이다.오늘날 모바일 응용 프로그램에서 신뢰할 수 있고 일치하는 검색이 없는 것은 거의 불가피하다.만약에 응용 프로그램이 API나 웹 서비스에서 검색한 데이터를 처리한다면 백엔드 개발자가 검색 메커니즘을 개발하고 API를 통해 검색 결과를 사용할 수 있지만 클라우드 Firestore와 같은 것을 사용하여 데이터를 저장하면 곤경에 빠진다.
Cloud Firestore에서 기본 검색을 실행할 수 있습니다. 텍스트를 처리하지 않으면 일부 필드와 값을 일치시키고 결과를 일정한 순서로 정렬해야 합니다.기본적으로 그것은 심지어 검색도 아니다.정확한 값 일치는 문서 필드에서만 찾을 수 있습니다.예를 들어 문서에 name 라는 필드가 있고 그 값이 John Doe 이면 검색 쿼리에 정확한 필드 name 와 그 값이 포함되어야 문서를 검색할 수 있습니다.검색 문자열로 John 또는 Doe 을 사용하더라도 텍스트에 대해 항상 Firestore에서 동일한지 확인하기 때문에 작동하지 않습니다.
최근에 나는 내가 개발하고 있는 응용 프로그램에 검색 기능을 추가해야만 했다. 나는 이러한 방식으로 검색 논리를 작성해야 한다. 즉, 클라우드 Firestore의 문서에 있는 여러 필드를 고려해야 한다.예를 들어, 내 모음에 다음 문서가 있는 경우Posts.

post_id: 1234
post_title: Web Development for Beginners
post_text: This is a wonderful book for those who want to learn web development from scratch.

post_id: 1235
post_title: Software Development for Beginners
post_text: ...

post_id: 1236
post_title: Programming for Beginners
post_text: ...

위의 데이터 세트에서 검색 쿼리가 문서 필드에 저장된 텍스트인 경우 Firestore에서만 검색을 수행할 수 있습니다.Firestore는 다음 질의에 대해 결과를 반환하지 않습니다.

Firestore.collection("Posts").where("post_title", "==", "Software").get()

이것은 명백히 알 수 있다.검색어software는 문서의 post_title 필드에서 완전히 일치하지 않습니다.영역을 뛰어넘는 검색이 필요할 때 문제가 극대화된다.또한 사용자가 데이터베이스와 같은 방식으로 책의 제목을 입력할 수 있기를 기대할 수 없습니다.
Algolia 를 입력합니다.

저는 Algolia 사용자입니다. 만약 당신이 Firestore를 사용한다면 개발 3개월 후에 당신은 자신이 곤경에 빠졌다는 것을 깨닫게 될 것입니다. 이것은 생명을 구하는 허수아비입니다.
약 2년 전, 나는 처음으로 한 프로젝트에서 Algolia를 사용했고, 나는 그것을 다시 사용하기로 결정했다.이것은 JSON 데이터를 처리할 수 있기 때문에 Algolia에게는 식은 죽 먹기다.따라서 응용 프로그램에서 Algolia를 통합하는 첫 번째 단계는 어떤 데이터에서 검색을 실행할지 결정하는 것이다.가능한 한 범위를 좁힌 다음 데이터를 Algolia에 추가합니다.
Algolia는 많은 유행하는 프로그래밍 언어에서 클라이언트와 서버에 사용되는 SDK를 가지고 있지만 Dart는 없습니다!하지만 우리는 이 문제를 해결할 것이다.이제 Posts 집합의 모든 문서를 읽고 Algolia의 인덱스에 추가하는 작은 NodeJS 스크립트를 만들 것입니다.Algolia 인덱스는 관련 데이터의 집합과 유사합니다.색인에는 검색을 위한 JSON 문서가 포함되어 있습니다.
Firebase의 관리 SDK를 사용하여 Firestore와 Algolia를 동기화합니다.나는 algoliasearch NodeJS 패키지를 사용하여 Algolia SDK를 사용할 것이다.나는 이 세부 사항을 뛰어넘을 것이다.

const algolia = algoliasearch("APP_ID", "API_ADMIN_KEY");
const index = algolia.initIndex("Posts"); // You can choose any name
let records = [];
let querySnapshot = await admin.firestore().collection("Posts").get();

for (let i in querySnapshot.docs) {
    let obj = querySnapshot.docs[i].data();
    obj.objectID = querySnapshot.docs[i].id;
    records.push(obj);
}

await index.saveObjects(records);
console.log("Pushed everything to Algolia"); 

내가 어떻게 Firestore 집합의 데이터를 Algolia 인덱스에 올렸는지 동영상을 볼 수 있다.
위의 코드 세션은 Posts 집합의 모든 문서만 읽고 결과 그룹에 하나씩 삽입합니다.그룹의 모든 대상은 objectID 이라는 속성을 가지고 있으며, Algolia는 이 속성으로 데이터를 인덱스해야 합니다.스크립트가 완료되면 Posts 라는 Algolia 인덱스의 모든 문서가 있습니다.

구성 섹션으로 이동하여 왼쪽에 있는 검색 가능 속성 옵션을 선택하고 post_title 및 post_text 둘 다를 검색 가능 속성 목록에 추가합니다.그러면 두 필드에서 Algolia를 검색할 수 있습니다.

이제 Algolia에 대한 데이터가 생겼고 검색을 실행하고자 하는 방식을 설정했습니다. Flatter 응용 프로그램에서 검색을 실현하는 방법을 보여 드리겠습니다.
불행하게도 Algolia에게는 공식적인 Dart/FLUTER SDK가 없지만 놀라운 패키지dart_algolia를 사용할 수 있습니다. 그것은 REST API의 포장이거나 미친 듯이 느껴집니다. REST API를 계속 사용할 수 있습니다.너의 선택은 개방적이다.

회사 명 / dart_algolia

[비공식] Algolia는 순수한dart SDK로 Algolia REST API 포장을 둘러싸고 있어 떨림이나dart 프로젝트를 쉽게 실현할 수 있다.

Flatter에 새 응용 프로그램을 만들고 의존 항목으로 dart_algolia 파일에 추가해서 pubspec.yaml 패키지를 빠르게 설치할 것입니다.파일을 저장하고 flutter packages get 명령을 실행하여 패키지를 설치합니다.

다음은 main.dart 파일에서 텍스트 필드와 단추가 있는 최소 사용자 인터페이스를 만들어서 검색을 수행합니다.이것은 완전한 build() 방법이다.

Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text("Algolia Search"),
    ),
    body: Container(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Text("Search"),
          TextField(
            decoration: InputDecoration(hintText: "Search query here..."),
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.end,
            children: <Widget>[
              FlatButton(
                color: Colors.blue,
                child: Text(
                  "Search",
                  style: TextStyle(color: Colors.white),
                ),
                onPressed: () {},
              ),
            ],
          )
        ],
      ),
    ), // This trailing comma makes auto-formatting nicer for build methods.
  );
}

다음은 그의 모습이다.

다음으로 TextEditingController 값에 접근할 수 있도록 TextField 을 빠르게 추가합니다.

TextEditingController _searchText = TextEditingController(text: "");

그리고 _searchText 컨트롤러 속성에 할당합니다.

TextField(
  controller: _searchText,
  decoration: InputDecoration(hintText: "Search query here..."),
),

마지막으로 TextField 이벤트 코드를 작성할 때가 되었다.onPressed라는 방법을 만들고 모든 검색 논리를 작성합니다.

FlatButton(
  color: Colors.blue,
  child: Text(
    "Search",
    style: TextStyle(color: Colors.white),
  ),
  onPressed: _search,
),

현재, 우리는 클래스의 맨 위에 몇 개의 변수를 추가할 것이다.

List<AlgoliaObjectSnapshot> _results = [];
bool _searching = false;

FlatButton수조는 Algolia가 되돌아오는 데이터를 저장하고 이를 사용하여 생성합니다search._results 부울 값은 검색이 완료되었는지만 나타냅니다.

_search() async {
  setState(() {
    _searching = true;
  });

  Algolia algolia = Algolia.init(
    applicationId: 'APP_ID',
    apiKey: 'SEARCH_API_KEY',
  );

  AlgoliaQuery query = algolia.instance.index('Posts');
  query = query.search(_searchText.text);

  _results = (await query.getObjects()).hits;

  setState(() {
    _searching = false;
  });
}

마지막으로 ListView 소부품 구조 함수를 사용하여 _searching 를 만듭니다.우리는 그것을 ListView 의 마지막 요소로 삼아 ListView.builder 작은 위젯에 포장하여 사용할 수 있는 모든 수직 공간을 차지하도록 할 것이다.

Expanded(
  child: _searching == true
      ? Center(
          child: Text("Searching, please wait..."),
        )
      : _results.length == 0
          ? Center(
              child: Text("No results found."),
            )
          : ListView.builder(
              itemCount: _results.length,
              itemBuilder: (BuildContext ctx, int index) {
                AlgoliaObjectSnapshot snap = _results[index];

                return ListTile(
                  leading: CircleAvatar(
                    child: Text(
                      (index + 1).toString(),
                    ),
                  ),
                  title: Text(snap.data["post_title"]),
                  subtitle: Text(snap.data["post_text"]),
                );
              },
            ),
),

모두 완성하다.코드는 좀 더 간결할 수 있지만, 우리는 잠시 그것을 소홀히 한다.테스트해 봅시다.

이것은 단지 시작일 뿐이다.Algolia는 분면 검색, 지리적 위치 기반 검색, 정렬, 정렬 등을 수행할 수 있는 강력한 기능을 제공합니다.나는 아직 시험하고 있으니, 너는 마땅히 한번 해 보아야 한다.그 밖에 당신의 경험을 마음대로 나누세요.
위에서 설명한 코드는 GitHub에서 찾을 수 있습니다.

사마르타 가바르 / 떨림 알고리즘

떨림 알고리즘

새로운 떨림 응용

입문

이 프로젝트는 떨림 응용의 출발점이다.
첫 번째 Flitter 프로젝트인 경우 다음 리소스를 참조하십시오.

Lab: Write your first Flutter app

Cookbook: Useful Flutter samples

Flitter 사용을 시작하는 방법에 대한 자세한 내용은
online documentation, 튜토리얼 제공,
예제, 모바일 개발 가이드 및 전체 API 참조.
View on GitHub
이것은 유튜브의 전체 영상입니다. 저는 플리트 응용 프로그램에서 알골리아를 사용하여 전체 텍스트 검색을 실현했습니다.
너도 나의 유튜브 채널을 구독해서 더 많은 재미있는 내용을 얻을 수 있다.
계속 인코딩, 건배.