Flutter’da Pusher Kullanımı

Mirkan
Mirkan
Jun 23 · 2 min read
Fotoğraf: Neven Krcmarak

Pusher nedir?

Pusher web ve mobil uygulamalarınıza kolay yoldan gerçek zamanlı veri ve fonksiyonellik sağlayabilen bir hosted service.

Şuan çalıştığım projede pusher kullanılıyor ve pusher nedir ne değildir diye bakarken sadece 10 saat önce paylaşılmış bir Flutter paketi bulmak beni çok mutlu etti. HomeXlabs’a ve Flutter topluluğuna teşekkür ederim.

Pusher Websocket Paketi

pusher-websocket-java ve pusher-websocket-swift pluginlerini saran, resmi olmayan bir Flutter paketi şimdi kuracağımız.

Pusher hesabınızı açtıktan sonra, projeniz için key ve cluster bilgilerini almanız gerekiyor. Sonrasında pubsec.yaml’a pusher_websocket_flutter paketini ekleyin.

pusher_websocket_flutter

Şimdi pusher_service.dart isimli bir dosya açıyorum. Burda Pusher’ı başlatacağız, bağlayacağız daha sonrasında bir kanala bağlanıp, gelen event’leri dinleyeceğiz.

Channel ve Event

Kanal ve event Pusher’a özgü kavramlar. Kanallar(channel) event’leri filtrelemek ve gruplamak için bir nevi namespace. Event ise uygulamanızda olan birşeyin açıklaması. İsim vererek örneklersek, public diye bir kanalınız olup create diye bir event’iniz olabilir.

PusherService class’ımda son event, son bağlantı durumu ve kanalım var

init, connect, subscribe ve unsubcribe metodlarımı yazıyorum. init metodunda key ve cluster’ı vermeyi unutmayın. Init metodu bir nevi setup, yani kurulum, bu yüzden key ve cluster bilgisini veriyoruz. Sonra bağlantıyı kurup bir kanala subscribe metodu ile abone oluyoruz.

Şimdi bu kanala gelen event’leri dinleyeceğiz. Gelen her event’teki data’yı bir StreamController’a atıp sonra burdan StreamBuilder ile dinlemeyi düşünüyorum.
PusherService class’ımda lastEvent, lastConnectionState ve channel’ın altına:

Sonrasında ise gelen event’in içindeki data’yı _inEventData isimli Sink’e ekliyorum. unBindEvent metodumda ise kanala unbind yapıp bu StreamController’ı kapatıyorum.

Yazdığım bu metodları da tek tek çalıştıracak bir metod yazıyorum. Parametre olarak kanal ve event ismi alıyor.

Şimdi data’yı anasayfamda StreamBuilder ile ekrana basabilirim. initState metodunda yazdığım firePusher metodunu çağırıyorum. StreamBuilder’da ise data yoksa dairesel süreç göstergesi gösterip, eğer bir data varsa Text widget’ı içinde direkt ekrana basıyorum. Son olarak dispose() metodunda unbind metodunu çağırıyorum.

Pusher’ın sitesinde Debug Console tabına gelip event creator’dan public kanalına create event’leri gönderiyorum.


Sorularınızı Twitter @mirkancal ve LinkedIn üzerinden yazabilirsiniz, sağlıcakla kalın.

Diğer yazılarıma da göz atabilirsiniz.
Flutter’da Temiz Routing
Flutter Web uygulamasını Peanut ile Github Pages’e Dağıtma
Flutter Uygulama Mimarisi: BLoC
Flutter’da SVG Kullanımı

Flutter İzmir

Mirkan

Written by

Mirkan

İzmir’den Flutter mühendisiyim. Stackoverflow’da Flutter sorularını cevaplamayı seviyorum.

Flutter İzmir

Flutter İzmir Topluluğu

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade