5 Ağu 2018

chatbot – “Her eve her siteye chatbot” tek satır code yazmadan

Author: strongsoul | Filed under: Teknik

“Her eve her siteye bot” sloganı ile günümüzün trendi olan chatbot akımına kapılabilmek için kullanışlı bir ürün olan botpress ile nasıl chatbot yapabilirizi ele alacağım. öncelikle react ve nodejs botpress’in ana teknolojileri olduğundan bunların bilinmesi anlaşılması açısından önem arz etmektedir. Kaynak kodlara bakmak için ben visual studio code u kullanmaktayım tavsiye ederim beleş ve güzel bir editördür.

Fakat şunu da belirtmek isterim ki anlattığım adımlar için nerdeyse suya sabuna dokunmadan bir üretim sağlayacağınızdır tek satır code yazmadan bir chatbot üretip dinamik bir akış işletebileceksiniz, güzel değil mi ? 🙂

Elimizdeki ürün botpress, botpress; bir site botu üreticisi ve bu bota ait gereken modüllerin geliştiricisi. Modülleri yapay zeka entegrasyoncusu, akış diyagramcısı, içerik yöneticisi vb.. gibi modüller, ne lazım abime diyen bir ürün yani. Sitemde bot olsun botumda akıllı olsun diyorsak bu ürün her eve lazım cinsten.

Botpress kurulumu için neler gerekli ? sadece npm.
Öncelikle npm’i yani node package manageri kurmalıyız. Benim önerim nvm dir, node version manager ile bu kurulumu sağlamaktır.
(linux için burayı ; linuxNVM, windows için windowsNVM burayı inceleyebilirsiniz, vakit olursa bir yazı da nvm için olur belki)

Npmi kurduktan sonra, “npm install -g botpress” komutu ile botpressi npm ile hızlı bir şekilde sistemimize kurabilmekteyiz.

Botpress paketleri yüklendikten sonra; botpress –version yada bp –version yazarak kurulumu kontrol edebiliriz. Olumlu bir yüklemeye sahip isek benimguzelbotum adında bir klasör açıp içinde botpress init yazmamız yeterli olacaktır.

örneğin linux shell için şu şekildedir;
mkdir benimguzelbotum
cd benimguzelbotum
botpress init
npm install

kurulum sağladıktan sonra klasör içinde iken npm start yazar isek default port 3000 den botumuz ayağa kalkacaktır, erişime ise http://localhost:3000/s/chat urlini herhangi bir browser a girerek sağlayabiliriz.

bp init aslında bize bir template sağlamaktadır. Bu komut ile botpress modülleri üzerinden chatbot yapımı için gerekli içerikleri sağlayacak yapıyı botpress bize sunmaktadır. komut sonrasında basic olarak işleme aldığını ve template ürettiğini çıkardığı mesajdan da anlayabiliriz. Burada şunu da ifade etmek gerekir ki; botpress x cidden kullanışlı bir yapıya bürünmüştür daha önceki sürümlerden daha profesyonel bir yapıya adım atılmıştır.

Şimdi code yapısını bir gözden geçirip ardından flow design ile hello worldümüze bir kaç cümle yapılandıralım.

öncelikle kod yapısına giriş yapacak olursak eski sürümlerini inceleyenleriniz oldu ise bazı farklılıklar olduğunu gözlemleyecektir.

Dosyalarımız içerisinde index.js içeriğini açacak olursak botun görselliğini ayarlayabildiğimiz aşağıdaki satırları görüceğiz.

const webchat = {
botName: ‘Basic’,
botAvatarUrl: null, // You can provide a URL here
botConvoTitle: ‘Botpress Basic 1 Webchat Bot’,
botConvoDescription: “Hello, I’m a Botpress 1 bot!”,
backgroundColor: ‘#ffffff’,
textColorOnBackground: ‘#666666’,
foregroundColor: ‘#000000’,
textColorOnForeground: ‘#ffffff’
}

Bu satırlardan istediğimiz confu yaparak botun renk avatar isim arkaplan gibi içeriklerini değiştirebiliriz.

Bizim burada flow ile beraber akışı işlemede yöneleceğimiz nokta bp.hear olacaktır fakat şunu tekrar belirteyim ki bu sadece code yapısını başlangıç seviyesinde anlamanız içindir ve yapma gereksinimiz yoktur zira ilerleyen adımlarda göreceğiniz gibi içeriği güncellemek yada akışa müdahale etmek için code a ihtiyacımız yok.

Uyarımızı yaptığımıza göre code yapısına geri dönersek; bp.hear({ –> bu satır önemini ifade etmek adına method içerisindeki bp.dialogEngine başına comment koyup tekrar restart ederseniz yani bp hearı

bp.hear({ type: /bp_dialog_timeout|text|message|quick_reply/i }, (event, next) => {
//bp.dialogEngine.processMessage(event.sessionId || event.user.id, event).then()
})

bu şekle çevirirseniz flow designerın işlem yapamadığını gözlemlemiş olursunuz. bp hear bp objesinin veri akışının genel olarak sağlandığı yerdir methodda result fonksiyonunun event objesi üzerinden event.texti yazdıracak olursanız chat ekranında yazdığınız metnin geldiğini gözlemlemiş olursunuz.

Şimdilik burayı bir kenara bırakalım browserın url kısmına;
http://localhost:3000/flows/main yazalım. Karşımıza akış diyagram editörü çıkacaktır. Basic içerikteki tüm karşılamalarımızın buradan olduğunu gözlemleyebiliriz.

Burada chatbot ile konuşmamız da isim girme kısmından sonra forget my name dersek bizden aldığı ismi sıfırlayan bir kod parçası mevcuttur, görebilmek için chatbota “forget my name” yazalım ve sonucu gözlemleyelim.

Peki bu şekilde akışa bir interrupt ta biz ekleyip bazı cümleleri intent dediğimiz iş parçacıklarına düşürsek? güzel olur bence peki nasıl yaparız ?

Mesela “chp, akp, erdoğan, tayyip yada kılıçdaroğlu” ile ilgili bir metin yazıldığında bu sitede politika konuşulmaz diye botumuz cevap versin.

öncelikle akış tasarımında yukarılara çıktığınızda aşağıdaki imaj da gördüğünüz gibi bir artı sembolü var işte ona basarak işleme başlayalım 🙂

 

yeni bir node ekleyelim


bu gelen node un üzerine iki kere tıklayalım
açılan pencerede node un adı üzerine gelip adını “politika” yapalım sonra altındaki artıya basalım ve “add new action” penceresini açalım burada say something seçili iken sağdaki klasör sembolüne basalım açılan pencereden text i seçip “bu sitede politika konuşulmaz” yazalım. Son hali şu şekilde olacak;


sonra flowa geri dönelim.

main flowdaki boş bir yere iki kere clickleyelim karşımıza flow properties çıkacaktır.

trasitions sekmesine geçerek + simgesine clickleyelim gelen pencerede artık yeni bir expression tanımı yapacağız ve bu tanıma uyan intent imizi seçeceğiz burada aslında intentimiz eklediğimiz politika isimli node umuz olacak.

tanımlamalarımızı şu şekilde yapıyoruz
expression : event.nlu.intent.is(‘politika’)
to node : politika

create buttonu ile tanımlamamızı üretip ana flowa geri dönüyoruz.

şimdi bir expression ve expression sonucunda yapılacak işi betimlemiş olduk fakat expressionın gerçekleşeceği yakalama kelimelerini daha yapılandırmadık bu iş için çeşitli yolları olsada ben bu işi botpress üzerinden yapılandıracağım.

browserımızda http://localhost:3000/modules/nlu adresini açıyoruz açılan pencerede


create new intent
e tıklıyoruz, isim olarak politika yazıp üretimi sağlıyoruz. Bu adımla beraber bir politika intentimiz oldu fakat hala yakalayacağı kulağını kabarttığında dinleyeceği kelimeleri bilmiyor bunun için hemen sağındaki intents/politika kısmına girişlerimizi sağlıyoruz ve sağ tarafdaki save buttonuna clickledikten sonra sol tarafda kırmızı yazı ile çıkan “Model is out of sync” yazısının altındaki “sync” buttona tıklıyoruz. Tanımlamalarımızın son hali ise şu şekilde ;

hepsi bu kadar şimdi botumuza dönüp akp, chp vb gibi tanımladığımız kelimelerden birini dile getirdiğimiz anda cevabımız bu sitede politika konuşulmaz olacaktır.

Yeni bir makalede görüşmek üzere 🙂

Yorum Bırakın