İçindekiler
Web uygulamaları değişiyor ve gelişiyor, bu da kullanıcıların ihtiyaçlarını ağ üzerinde ilk bağlantı protokolünün oluşturulduğu zamandan farklı kılıyor. Sonuç olarak protokol HTTP yıllar içinde gelişti ancak henüz bağlantı gibi gerçek zamanlı bir düzeye ulaşmadı TCP iki takım arasında.Bu sınırlamalar, geliştiricilere ve kullanıcılara zarar vermek yerine, yalnızca bir iletim sistemini gerçek zamanlı olarak taklit etmemize değil, aynı zamanda HTTP neredeyse doğal olarak yapın.
Web yuvasıBurası Web yuvası, yalnızca en modern tarayıcılar tarafından desteklenen, HTTP'yi tüm kısıtlamalarından çıkarmamıza ve böylece başlıklar aracılığıyla etkili bir şekilde iletişim kurabilmemize olanak tanıyan nispeten yeni bir protokol. ELDE ETMEK.
Web yuvası Hala aktif bir olgunlaşma döneminde, bu yüzden onu yeni çözümlerde bulamamamız çok olası, neyse ki Node.js alt düzey araçlar oluşturmak için yaratıcılığımıza güvenmek zorunda kalmadan bunları kullanmamıza olanak tanıyan bazı araçlarımız zaten var.
GereksinimlerBu gelişmiş bir öğreticidir, bu nedenle önce işlevsel bir kuruluma ihtiyacımız olacak. Node.js Sistemimizde, araştırmaya devam etmeden önce bu öğreticiye bir göz atabiliriz, ayrıca kullanacağımız kitaplıkları kurabilmek için yönetici izinlerine ihtiyacımız olacak. kavramlarına aşina olmalıyız. JavaScript Örneğin geri çağırmak ve anonim işlevler. Sonunda şöyle bir metin düzenleyicimiz olmalı Yüce metin bu, örneklerde bulunan farklı kodları yazmamızı sağlar.
Kullanmamıza izin veren bir uygulama oluşturmaya başlamak için Web yuvaları Önce küçük bir yapı inşa etmeliyiz, bu çok basit ama gerekli, bu yapı şunlardan oluşacak:
1- Projemizin dosyalarını depolayacağımız bir klasör.
2- adlı bir dosya server.js, bu dosya adından da anlaşılacağı gibi, gerçek zamanlı olarak bağlantıyı kuracağımız sunucu olacaktır. Web yuvaları.
3- adlı bir dosya müşteri.html, bu dosya tarayıcı aracılığıyla sunucumuzla iletişim kurmak için bir arayüz olacaktır, ilgili bilgileri gönderip alabilmemiz için aynısının olması gerekir.
Yapımızı tanımladığımız için artık birkaç satır kod almaya başlayabiliriz, bunun için harici bir kütüphane kurarak başlamalıyız. ws çevremizde, çünkü söz konusu protokolü kullanmamıza izin verecek olan budur. Bu kütüphaneyi kurmak için konsolumuzu açmamız yeterli Node.js, dosyalarımızın olacağı klasörde bulunuyoruz ve aşağıdaki komutu yerleştiriyoruz:
npm kurulum wsÇalıştırdığımızda, komut konsolumuzda aşağıdaki sonucu görebiliriz:
Kütüphaneyi kurduktan sonra çalışmalarımıza devam edebiliriz, şimdi dosyamızda server.js Aşağıdaki kodu yazmalıyız, önce nelerden oluştuğunu görelim, sonra açıklayacağız:
var WSServer = gerektirir ('ws').Sunucu, wss = new WSServer ({port: 8085}); wss.on ('bağlantı', işlev (soket) {socket.on ('mesaj', işlev (msg) {console.log ('Alınan:', msg, '\ n', 'IP'den:', soket . upgradeReq.connection.remoteAddress); if (msg === 'Merhaba') {socket.send ('Evet çalışıyor!');}}); socket.on ('kapat', işlev (kod, açıklama) {konsol .log ('Çevrimdışı:' + kod + '-' + açıklama);});});Yaptığımız ilk şey kütüphaneye ihtiyaç duymak ws yeni yüklediğimiz ve hemen aynı talimatta sınıfınızı arayın sunucu, ardından bağlantı noktasında çalışan bir sunucu oluşturacağımız bir örnek oluşturuyoruz 8085Bu port, erişimimiz olan her şey olabilir.Bu durumda, şu anda bu test ortamında bulunan diğer servislerle çakışma olmaması için 8085 kullanılır.
Örneğimizi tanımladığımız için şimdi yöntemi uygulayacağız.üzerinde () bağlantı olayı için, ardından geri çağırmak ondan denilen bir nesneyi geçiyoruz priz, bununla müşteriden mesajları alacağız ve bir rutin yazdık, eğer kelimeyi alırsak "Merhaba" sunucu bir mesaj döndürecek ve biz de komut konsolunda bir şeyler yazdıracağız. Son olarak bağlantıyı kapatırsak konsolda sadece bir mesajımız olacak.
Sunucumuza sahip olduğumuzda, müşterimizi oluşturmanın zamanı geldi, bunun için dosyada müşteri.html html etiketlerini yerleştireceğimiz bir yapı tanımlayacağız ve JavaScript sunucumuza bir bağlantı olarak işlev görecektir. Bakalım dosyamız nasıl görünüyor:
Websockets İstemcisi GönderParça HTML oldukça basit, bir metin türü girişimiz ve bir gönder butonumuz var. div Kullanıcıya göstermek için sunucudan bilgiyi kimin alacağı çıktı olarak adlandırılır. İlginç olan şey, yaptığımız ilk şeyin şu tipte bir nesne yaratmak olduğu etikette geliyor. WebSocket ve onu bulmanız gereken rotayı belirtiyoruz, bizim durumumuzda yerel ana bilgisayar: 8085 ve böylece ne yaptığımızı görebiliriz server.js. Daha sonra gönderme, metin ve çıktı öğelerimizi kullanabileceğimiz değişkenlere bağlarız.
O zaman yaptığımız şey, sunucudan alabileceğimiz yöntemlerin her birini tanımlamak, böylece her bir şey gönderdiğimizde, yöntem sayesinde çıktımıza kaydedilecek. göndermek (). Kullandığımız diğer yöntem ise onmesaj () bu, yalnızca sunucumuz yanıt verirse etkinleştirilir ve sonucu HTML'mize ekleriz.
Sonunda yöntemleri kullanıyoruz kapalı () Y hata ()ile bağlantı kurulduğunda ilki bize bir mesaj verir. Web yuvası durdurulur veya kapatılır ve ikincisi herhangi bir hata oluşması durumunda bizi bilgilendirir. Bununla sadece konsolumuzdaki sunucuyu başlatmamız ve örneğimizi çalıştırmamız gerekiyor, bunun için aşağıdaki komutu kullanıyoruz:
düğüm sunucusu.jsBu, sunucuyu başlatacak, ancak kodumuzun işlevselliğini doğrulamak için, istemci.html dosyamızı tercih ettiğimiz tarayıcımızda çalıştırmalı ve metin kutusuna bir şeyler yazıp gönder düğmesine basmalıyız, bu, sunucu ile iletişim oluşturacaktır. ağ yuvası ve yanıtı konsoldan görebiliriz:
Görüntüde, komut konsolunun alınan mesajı nasıl yazdırdığını görebiliriz, hatta verileri aldığı yerden IP adresini kaydeder, dosyamızda programladığımız şey buydu. server.js"Merhaba" kelimesini alırsak, aynı resimde tarayıcı penceresinde gördüğümüz gibi bir yanıt mesajı göndereceğimizi de belirtmiştik. Şimdi tarayıcıyı yenilersek bağlantı koptu, bu da uygulamamız tarafından kaydedildi, bakalım:
Son olarak konsolumuzdaki bağlantıyı kapatırsak CTRL + C Sunucuyu durdurmak için tarayıcımız hata işleyiciyi çalıştırır ve orada yeni bir mesaj göreceğiz:
Gözlemciysek, önemli bir şey fark etmiş olabiliriz, yanıt almak için hiçbir zaman tarayıcıyı yenilemek veya istekte bulunmak zorunda kalmadık. Ajax, her şey doğrudan çift yönlü oldu WebSockets, buna gerçek zamanlı denir.
Gösterdiğimiz, var olan en ilkel ve manuel yollardan biridir, ancak iş akışının nasıl olduğunu bilmek bizim için işe yarar, ancak üretim ortamlarına hazır gerçek işlevsellik kütüphane ile sağlanır. soket.io, bu, öğreticide yaptığımızla aynı şeyi yapar, ancak geliştirici tarafından yapılan hatalara çok daha az ve daha az eğilimlidir, bu da uygulamanın teknik kısmına çok fazla değil, yalnızca uygulamanın mantığına odaklanmamızı sağlar.
Kurulum için soket.io sadece bir tane yapmalıyız npm socket.io'yu kurun ve bununla birlikte depodan, geliştirmemize başlamamıza izin verecek olan kütüphanenin en son kararlı sürümünü indireceğiz.
Bununla birlikte önemli bir adım attığımız bu öğreticiyi bitirdik. Node.js nasıl kullanılacağını bilerek Web yuvaları, bu teknoloji, web üzerinde hiç düşünülmemiş uygulamalar oluşturmamıza yardımcı olduğu için her geçen gün daha önemli hale geliyor. Ayrıca, yalnızca uygulama geliştirerek neler başarabileceğimizin potansiyelini anlamanın bir yolu olduğundan, protokol hakkında kendimizi belgelememiz de önemlidir.