Flutter ile TCP Socket Haberleşme

emrearik
Flutter Students Club
4 min readMar 23, 2022

Herkese selamlar, bu yazımızda Flutter’de TCP Socket kullanarak haberleşme uygulaması yazacağız.

Öncelikle socket nedir ve nerelerde kullanılır, bununla başlayalım.

Socket Nedir ?

Socket anlık haberleşme sağlayarak veri alışverişi yapmamızı sağlayan yapıdır. Server ve Client türünde iki çeşit yapı bulunur. Burada Server genellikle verileri alan kısım, Client ise verileri gönderen kısımdır. Ancak serverden de clientlere veri aktarılabilir. Server içerisinde bir ip adresi ve port tahsis edilir. Server kendini dinlemeye açar ve clientlerden gelen verileri kendisinde gösterir. Socket programlamada veriler çok küçük bir gecikmeyle iletilir

Socket Nerelerde Kullanılır ?

Socketler genellikle hızlı alışveriş yapılması gereken yapılarda kullanılır. Örneğin mesajlaşma uygulaması, multiplayer uygulamaları ve Realtime DB’ler gibi pek çok alanda kullanılır.

Proje Özeti

Projeye başlamadan önce ben yapmak istediğim yapıyı sizlere anlatayım.

Burada master phone olarak bahsedilen server bulunmakta. Phone’lerden gelen verileri serverde dinleyip ekrana bastırmak istiyorum. Bunun için TCP Socket yapısını kullandım. Öncelikle bir server sayfası oluşturdum ve burada Socket serveri başlatmak için gerekli kodları yazdım. Client’ler için de client sayfası oluşturdum.Özet olarak Client sayfasından gelen veriyi TCP Socket haberleşmesi ile alarak server sayfasında gösteriyorum. Bu haberleşme sırasında çok küçük bir kayıp olduğu için veriler neredeyse eş zamanlı olarak geliyor.

Şimdi server_page dart kodlarını inceleyelim.

Öncelikle burada serverSocket isimli serverimizi oluşturmak için gerekli socket değişkenini tanımladım. clientSocket ile de serverimize bağlanan clientlerin bilgilerini ve verilerini okuyabiliyoruz. Port olarak 9000. portu seçtim. localIP kısmını şimdilik boş bıraktım. IP adresimizi bulmak için de network_info kütüphanesini kurdum. Sonrasında gelen mesajları tutmak için de boş bir liste hazırladım.

Build methodu içerisinde sırayla gidelim. Burada öncelikle cihazın adresini almak için getIPAdress() fonksiyonunu kullandım. Bu fonksiyon network_info kütüphanesini kullanarak şuanki cihazımızın ağdaki IP adresini tespit ediyor. setState içerisinde de IP adresimi localIP değişkenine atadım. Bu kısmın ayrıntılı açıklamasını daha sonra yapacağım :)

Şimdi startServer() fonksiyonuna geçelim. Bu fonksiyon içerisinde serveri başlatmak için ServerSocket.bind() komutunu kullandım. İlk parametre InternetAdress.anyIPv4 ile IPv4 kullanan tüm bağdaştırıcıların IP adresini dinleyebiliyoruz. Sonrasında portu da parametre olarak vererek serveri aktif ettim.
ServerSocket.listen() komutuyla da serveri dinliyoruz.

handleClient fonksiyonuna geçelim. Burada aslında TCP Server ile Clientlerimiz el sıkışma işlemini gerçekleştiriyor. Socket içerisine yeni bir client bağlandığında server aktif dinlemede olduğu için clienti tespit ediyor ve client bilgilerini ekrana bastırıyor.
clientSocket.listen() ile de clientten gelen veriyi String.fromCharCodes(data).trim() ile öncelikle filtreden geçirip Stringe çevirdim. Sonrasında ben ekrana bastırmak için MessageItem isimli bir class oluşturdum. Bu class içerisinde iki tane değişken bulunmakta. Birinci değişken owner, ikinci değişken content. Gelen verinin sahibini ve içeriğini bu class sayesinde tespit ediyorum. Şimdi gelen veriyi string olarak almıştım. SetState kullanarak MessageItem listesine veriyi insert komutuyla ekliyorum.onError ve onDone kısımları için de gerekli düzenlemeleri yapabilirsiniz. Ben şimdilik yapmadım :)

Son olarak da serveri kapatmak için stopServer() fonksiyonundan bahsedeyim. Burada serverSocket.close() komutuyla socketimi kapattım, serverSocket değişkenini null yaptım.

Arayüz kısmını da build metodu içerisinde tasarlayarak server sayfasının kodlamasını sonlandırdım.

Client page sayfasına geçelim.

Öncelikle bir ayrıma dikkat edelim. Server sayfasında InternetAdress.anyIPv4 ile bağdaştırıcıdaki tüm IP adreslerini dinleyebiliyorduk. Client kısmında ise Serverin Local IP’sine bağlanacağız. Yani az önce üstte bahsettiğim IP adresi alma komutunu burada kullanıyoruz. Örneğin Serverimizin Local IP Adresi 10.0.3.15 olsun. Biz client kısmında bağlanacak adrese 10.0.3.15:9000 yazmalıyız ki servere bağlanabilelim. Buradaki 9000 port numarasıdır.

Bu sayfada da aslında benzer şeyleri yaptım. Burada server sayfasından farklı, kullanıcıdan bağlanmak istediğimiz serverin ip adresini text form ile aldım ve connectToServer() fonksiyonu içerisinde servere bağlandım.

Diğer kısımlar server sayfasıyla çok benzer. Kodları inceleyerek anlayabilirsiniz. Ben gerçek bir cihazla kodları çalıştırdım aktif olarak çalışıyor. Emülatör’de bazen çalışıyor, bazen çalışmıyor. Problemi tam olarak anlayamadım. Genymotion kullanıyorum :)

Clienti test amaçlı bir de python kodu yazdım. Bu kod client görevi görmekte olup yazdığımız texti servere göndermektedir.

O kodu da buradan inceleyebilirsiniz.

Sonuç:

Bir sonraki yazımda görüşmek dileğiyle. Herkese iyi kodlamalar :)

Kaynaklar:

--

--