1-Web sitesine arama eklemeye genel bakış

Makale
05/13/2021
Okumak için 2 dakika

Bu öğretici, bir kitap kataloğunda arama yapmak için bir Web sitesi oluşturur ve Web sitesini bir Azure statik Web uygulamasına dağıtır.

Uygulama kullanılabilir:

Örnek ne yapar?

Bu örnek Web sitesi 10.000 kitapları kataloğuna erişim sağlar. Kullanıcı, arama çubuğuna metin girerek katalogda arama yapabilir. Kullanıcı metin girdiğinde, Web sitesi, metni tamamlamaya yönelik arama dizini önerme özelliğini kullanır. Sorgu tamamlandığında, kitap listesi ayrıntıların bir bölümüyle birlikte görüntülenir. Kullanıcı, kitabın arama dizininde depolanan tüm ayrıntıları görmek için bir kitabı seçebilir.

Arama deneyimi şunları içerir:

Arama – uygulama için arama işlevi sağlar.
Öner: Kullanıcı arama çubuğuna yazarken öneriler sağlar.
Belge arama – Ayrıntılar sayfasının tüm içeriğini almak için KIMLIĞE göre bir belge arar.

Örnek nasıl düzenlenir?

Örnek şunları içerir:

Uygulama	Amaç	GitHub Depo Konum
İstemci	Arama ile kitapları göstermek için uygulama (sunu katmanı) tepki verir. Azure Işlevi uygulamasını çağırır.	/Search-website/src
Sunucu	Azure Işlevi uygulaması (iş katmanı)-JavaScript SDK kullanarak Azure Bilişsel Arama API 'sini çağırır	/Search-website/API
Toplu ekleme	Dizini oluşturmak ve belgeye belge eklemek için JavaScript dosyası.	/Search-website/bulk-INSERT

Geliştirme ortamınızı kurma

Yerel geliştirme ortamınız için aşağıdakileri yükler.

Node.js 12 veya 14
- Yerel bilgisayarınızda yüklü Node.js farklı bir sürümüne sahipseniz, düğüm sürüm Yöneticisi 'ni (NVM) veya bir Docker kapsayıcısını kullanmayı düşünün.
Git
Visual Studio Code ve aşağıdaki uzantılar
İsteğe bağlı:
- Bu öğretici Azure Function API 'sini yerel olarak çalıştırmaz, ancak yerel olarak çalıştırmayı düşünüyorsanız, aşağıdaki Bash komutuyla Azure-Functions-Core-Tools ' u genel olarak yüklemeniz gerekir:
```
npm install -g azure-functions-core-tools
```

Git ile arama örneğini çatalla ve kopyalama

Örnek deponun kullanılması, statik Web uygulamasını dağıtmak için kritik öneme sahiptir. Web Apps, kendi GitHub çatalınızın konumunu temel alarak derleme eylemlerini ve dağıtım içeriğini belirlenir. Statik Web uygulamasındaki kod yürütme, Azure statik Web Apps, kendi oluşturduğunuz örnekteki koddan okurken uzak bir uygulamadır.

GitHub 'da örnek depoyuçatalla.

GitHub hesabınızla Web tarayıcınızda çatal işlemini doldurun. Bu öğretici, Azure statik Web uygulamasına Dağıtım kapsamında çatalınızı kullanır.
Bash terminalinde, örnek uygulamayı yerel bilgisayarınıza indirin.

YOUR-GITHUB-ALIASGitHub diğer adınızla değiştirin.
```
git clone https://github.com/YOUR-GITHUB-ALIAS/azure-search-javascript-samples
```
Visual Studio Code, kopyalanmış deponun yerel klasörünüzü açın. Kalan görevler, belirtilmediği takdirde Visual Studio Code tarafından gerçekleştirilir.

Azure kaynaklarınız için bir kaynak grubu oluşturma

Visual Studio Code, etkinlik çubuğunuaçın ve Azure simgesini seçin.
Yan çubukta, alanı altında Azure aboneliğinize sağ tıklayın Resource Groups ve kaynak grubu oluştur' u seçin.
Gibi bir kaynak grubu adı girin cognitive-search-website-tutorial .
Size yakın bir konum seçin.
Bilişsel Arama ve statik Web uygulaması kaynaklarını oluşturduğunuzda, Öğreticinin ilerleyen kısımlarında bu kaynak grubunu kullanın.

Kaynak grubu oluşturmak, kaynakları yönetmek için bir mantıksal birim sağlar, bunları kullanmayı bitirdiğinizde bunları silme de dahil.