{"id":1130,"date":"2021-02-08T16:26:47","date_gmt":"2021-02-08T13:26:47","guid":{"rendered":"https:\/\/www.etemkeskin.com\/?p=1130"},"modified":"2021-02-08T20:50:16","modified_gmt":"2021-02-08T17:50:16","slug":"djangoda-websocket-kullanarak-gercek-zamanli-uygulama-gelistirme","status":"publish","type":"post","link":"https:\/\/www.etemkeskin.com\/index.php\/tr\/2021\/02\/08\/djangoda-websocket-kullanarak-gercek-zamanli-uygulama-gelistirme\/","title":{"rendered":"Django’da Websocket Kullanarak Ger\u00e7ek Zamanl\u0131 Uygulama Geli\u015ftirme"},"content":{"rendered":"\n

WebSocket<\/strong>, tek bir TCP ba\u011flant\u0131s\u0131 \u00fczerinden tam \u00e7ift y\u00f6nl\u00fc ileti\u015fim kanal\u0131 sa\u011flayan bir bilgisayar ileti\u015fim protokol\u00fcd\u00fcr. T\u00fcm internet taray\u0131c\u0131lar\u0131 2011′ den beri Websockets’ leri destekliyor. <\/p>\n\n\n\n

Websocket ile uygulama geli\u015ftirme pop\u00fcler bir konu. Fakat uygulama geli\u015ftirirken ger\u00e7ekten ihtiyac\u0131n\u0131z var m\u0131 bunun analizini yapm\u0131\u015f olman\u0131z gerekiyor. <\/p>\n\n\n\n

Websocket ile Ger\u00e7ekle\u015ftirilecek Uygulama Alanlar\u0131<\/h4>\n\n\n\n
  1. Chat Uygulamalar\u0131<\/li>
  2. web uygulaman\u0131zda ziyaret\u00e7ilerinize ger\u00e7ek zamanl\u0131 bildirimler yollama<\/li>
  3. Ger\u00e7ek zamanl\u0131 grafik sunma<\/li>
  4. IOT cihazlar\u0131na ile ba\u011flant\u0131 kurularak(rasberrypie gibi…) ger\u00e7ek zamanl\u0131 ileti\u015fim uygulamalar\u0131(GPS takibi, sens\u00f6rlerden gelen anl\u0131k veriyi okuma ve aksiyon alma)<\/li>
  5. Chat botlar\u0131<\/li><\/ol>\n\n\n\n

    Django channels:<\/strong> Django projelerine sadece Http ba\u011flant\u0131n\u0131n d\u0131\u015f\u0131nda, WebSockets, MQTT, chatbots, amateur radio gibi uygulamalar i\u00e7in uzun s\u00fcreli ba\u011flant\u0131 imkan\u0131 sunan bir pakettir. Django ile gelen asenkron view lere ekstra \u00f6zellikler kazand\u0131r\u0131r.<\/p>\n\n\n\n

    Ama\u00e7<\/h4>\n\n\n\n

    Bu yaz\u0131da<\/p>\n\n\n\n

    1. Django projemize Django channels kullanarak Web sockets deste\u011fi sa\u011flamak<\/li>
    2. Jupyter notebook’ ta bir publisher olu\u015fturarak websockets ile Django uygulamam\u0131za veri g\u00f6nderme<\/li>
    3. Frontend’ de websocket ba\u011flant\u0131s\u0131 yaparak veriyi anl\u0131k olarak g\u00fcncelleme i\u015flemlerini ger\u00e7ekle\u015ftirece\u011fiz.<\/li><\/ol>\n\n\n\n

      Y\u00fcklenecek h\u00fct\u00fcphaneler<\/strong><\/p>\n\n\n\n

      Ger\u00e7ek zamanl\u0131 uygulamam\u0131z i\u00e7in a\u015fa\u011f\u0131daki paketleri bilgisayar\u0131m\u0131za y\u00fcklememiz gerekiyor.<\/p>\n\n\n\n

      pip install Django<\/code>\npip install -U channels<\/code>\npip install websocket-client<\/code>\n\nsettings.py<\/strong><\/pre>\n\n\n\n
      settings.py dosyam\u0131zda y\u00fckl\u00fc uygulamalar\u0131m\u0131za channels’ \u0131 a\u015fa\u011f\u0131daki gibi tan\u0131mlamam\u0131z gerekiyor. Projemizde liveapp<\/strong> isminde uygulamay\u0131 ba\u015flatt\u0131k.<\/p>\n\n\n\n
      INSTALLED_APPS = [\n    'channels', # for async app  it must be top place\n  \n  \t'liveapp'<\/pre><\/div>\n\n\n\n
      Uygulamam\u0131z asenkron \u00e7al\u0131\u015faca\u011f\u0131 i\u00e7in a\u015fa\u011f\u0131daki \u015fekilde tan\u0131mlamam\u0131z gerekiyor. learndj projemizde url<\/strong>‘ leri tan\u0131mlayaca\u011f\u0131m\u0131z routing.py<\/strong> ad\u0131nda dosya olu\u015fturduk.<\/p>\n\n\n\n
      WSGI_APPLICATION = 'learndj.wsgi.application'\nASGI_APPLICATION = 'learndj.routing.application'<\/pre><\/div>\n\n\n\n
      CHANNEL_LAYERS<\/strong>‘ \u0131 e\u011fer Django ile birlikte geleni kullanacaksak a\u015fa\u011f\u0131daki kodlar\u0131 ekleriz. E\u011fer ger\u00e7ek zamanl\u0131 uygulamada Redis<\/strong> kullan\u0131lacaksa a\u015fa\u011f\u0131daki kodlarda yorum sat\u0131r\u0131na al\u0131nm\u0131\u015f k\u0131sm\u0131 kullanabilirsiniz.<\/p>\n\n\n\n
      CHANNEL_LAYERS = {\n    "default": {\n        "BACKEND": "channels.layers.InMemoryChannelLayer"\n    },\n}\n\n# CHANNEL_LAYERS = {\n#     "default": {\n#         "BACKEND": "channels_redis.core.RedisChannelLayer",\n#         "CONFIG": {\n#             "hosts": [("localhost", 6379)],\n#         },\n#     },\n# }<\/pre><\/div>\n\n\n\n
      learndj<\/strong> projemizin dosya yap\u0131s\u0131 a\u015fa\u011f\u0131daki gibidir.<\/p>\n\n\n\n
      \"\"<\/figure>\n\n\n\n
      routing.py<\/strong><\/p>\n\n\n\n
      routing.py dosyas\u0131n\u0131 olu\u015fturduktan sonra a\u015fa\u011f\u0131daki kodlar\u0131 kullanaca\u011f\u0131z. websocket url<\/strong>‘ i tan\u0131mlarken ba\u015f\u0131na di\u011fer urllerden ay\u0131rmak i\u00e7in ws\/<\/strong> ekliyoruz. Bu url’ e istek yap\u0131ld\u0131\u011f\u0131nda \u00e7al\u0131\u015facak consumer<\/strong> class’ \u0131 yeni olu\u015fturdu\u011fumuz consumer.py<\/strong> dosyas\u0131ndaki DashConsumer<\/strong> class\u0131d\u0131r. <\/p>\n\n\n\n
      from channels.routing import ProtocolTypeRouter, URLRouter\nfrom channels.auth import AuthMiddlewareStack\nfrom django.urls import path\nfrom liveapp import consumer\n\nwebsocket_urlPattern = [\n    #In routing.py, "as_asgi()" is required for versions over python 3.6.\n    path('ws\/pollData', consumer.DashConsumer.as_asgi()), # add ws for prefix.\n]\n\napplication = ProtocolTypeRouter({\n    'websocket':AuthMiddlewareStack(URLRouter(websocket_urlPattern ))\n})<\/pre><\/div>\n\n\n\n
      consumer.py<\/strong><\/p>\n\n\n\n
      Consumer’ lar Django’ daki view fonksiyonlar\u0131n\u0131n kar\u015f\u0131l\u0131\u011f\u0131d\u0131r. liveapp<\/strong> uygulamam\u0131zda consumer.py<\/strong> isminde dosyam\u0131z\u0131 olu\u015fturduk.<\/p>\n\n\n\n
      \"\"<\/figure>\n\n\n\n
      A\u015fa\u011f\u0131daki kod blo\u011fu ile \u00e7al\u0131\u015facak consumer fonksiyonlar\u0131n\u0131 tan\u0131mlad\u0131k. Uygulamam\u0131z\u0131n websocket url’ ine ba\u011flanan bir kullan\u0131c\u0131 dashboard<\/strong> grubuna eklenecek.<\/p>\n\n\n\n
      from channels.generic.websocket import AsyncJsonWebsocketConsumer\nimport json\n\nclass DashConsumer(AsyncJsonWebsocketConsumer):\n    print('==================')\n    async def connect(self):\n        self.groupname='dashboard'\n        await self.channel_layer.group_add(\n            self.groupname,\n            self.channel_name,\n        )\n        await self.accept()\n\n    async def disconnect(self,close_code):\n        await self.channel_layer.group_discard(\n            self.groupname,\n            self.channel_name\n        )   \n\n    async def receive(self, text_data):\n        datapoint = json.loads(text_data)\n        val =datapoint['value']\n\n        await self.channel_layer.group_send(\n            self.groupname,\n            {\n                'type':'deprocessing', #function name to run\n                'value':val #value to send function\n            }\n        )\n        print ('>>>>',text_data)\n\n    async def deprocessing(self,event):\n        valOther=event['value']\n        valOther = f'IP VALUE: {valOther}'\n        await self.send(text_data=json.dumps({'value2':valOther}))# send for frontend<\/pre><\/div>\n\n\n\n
      Uygulamam\u0131za ba\u011flanacak ve json format\u0131nda data g\u00f6nderecek python scripti a\u015fa\u011f\u0131daki gibidir. Jupyter notebookta anl\u0131k olarak \u00fcretilen veriler templette render edilecek.<\/p>\n\n\n\n
      \"\"<\/figure>\n\n\n\n
      Jupyter notebook’u \u00e7al\u0131\u015ft\u0131rd\u0131\u011f\u0131m\u0131zda, consumer.py ‘deki receive fonksiyonun i\u00e7inde, gelen verileri print ederiz . Print edilen json verisini djangoyu \u00e7al\u0131\u015ft\u0131rd\u0131\u011f\u0131m\u0131z komut sat\u0131r\u0131nda a\u015fa\u011f\u0131daki resimdeki gibi g\u00f6rebiliriz.<\/p>\n\n\n\n
      \"\"<\/figure>\n\n\n\n
      live_app.html<\/strong> isminde template<\/strong> olu\u015fturup a\u015fa\u011f\u0131daki kod blokunu ekliyoruz. <\/p>\n\n\n\n
      <h2>Live APP<\/h2>\n<h3 id='poll_data'>Data<\/h3>\n<script>\n  \tconst myDiv = document.getElementById('poll_data')\n    \n    let socket = new WebSocket('ws:\/\/localhost:8000\/ws\/pollData');\n    socket.onopen = function(e){\n        alert('connection established');\n    }\n\n    socket.onmessage = function(e){\n        console.log(e.data);\n        result = JSON.parse(e.data);\n      \tmyDiv.textContent = result.value2;\n    }\n\n    socket.onclose = function(e){\n        alert('connection closed');\n    }\n<\/script><\/pre><\/div>\n\n\n\n
      Bu template’i render edecek herhangi url<\/strong> ve view<\/strong>‘ i tan\u0131mlad\u0131\u011f\u0131m\u0131zda a\u015fa\u011f\u0131daki resimdeki gibi verilerin anl\u0131k olarak g\u00fcncellendi\u011fini g\u00f6rebiliriz.<\/p>\n\n\n\n
      \"\"<\/figure>\n\n\n\n
      Ba\u015far\u0131lar …<\/p>\n","protected":false},"excerpt":{"rendered":"
      WebSocket, tek bir TCP ba\u011flant\u0131s\u0131 \u00fczerinden tam \u00e7ift y\u00f6nl\u00fc ileti\u015fim kanal\u0131 sa\u011flayan bir bilgisayar ileti\u015fim protokol\u00fcd\u00fcr. T\u00fcm internet taray\u0131c\u0131lar\u0131 2011′ den beri Websockets’ leri destekliyor. Websocket ile uygulama geli\u015ftirme pop\u00fcler bir konu. Fakat uygulama geli\u015ftirirken ger\u00e7ekten ihtiyac\u0131n\u0131z var m\u0131 bunun analizini yapm\u0131\u015f olman\u0131z gerekiyor. Websocket ile Ger\u00e7ekle\u015ftirilecek Uygulama Alanlar\u0131 Chat Uygulamalar\u0131 web uygulaman\u0131zda ziyaret\u00e7ilerinize ger\u00e7ek zamanl\u0131 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[32,26],"tags":[],"yoast_head":"\nDjango'da Websocket Kullanarak Ger\u00e7ek Zamanl\u0131 Uygulama Geli\u015ftirme - blog website<\/title>\n<meta name=\"description\" content=\"WebSocket, tek bir\u00a0TCP ba\u011flant\u0131s\u0131 \u00fczerinden tam \u00e7ift y\u00f6nl\u00fc ileti\u015fim kanal\u0131 sa\u011flayan bir bilgisayar ileti\u015fim protokol\u00fcd\u00fcr. T\u00fcm internet taray\u0131c\u0131lar\u0131 2011' den beri Websockets' leri destekliyor. Websocket ile uygulama geli\u015ftirme pop\u00fcler bir konu. Fakat uygulama geli\u015ftirirken ger\u00e7ekten ihtiyac\u0131n\u0131z var m\u0131 bunun analizini yapm\u0131\u015f olman\u0131z gerekiyor.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2021\/02\/08\/djangoda-websocket-kullanarak-gercek-zamanli-uygulama-gelistirme\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Django'da Websocket Kullanarak Ger\u00e7ek Zamanl\u0131 Uygulama Geli\u015ftirme - blog website\" \/>\n<meta property=\"og:description\" content=\"WebSocket, tek bir\u00a0TCP ba\u011flant\u0131s\u0131 \u00fczerinden tam \u00e7ift y\u00f6nl\u00fc ileti\u015fim kanal\u0131 sa\u011flayan bir bilgisayar ileti\u015fim protokol\u00fcd\u00fcr. T\u00fcm internet taray\u0131c\u0131lar\u0131 2011' den beri Websockets' leri destekliyor. Websocket ile uygulama geli\u015ftirme pop\u00fcler bir konu. Fakat uygulama geli\u015ftirirken ger\u00e7ekten ihtiyac\u0131n\u0131z var m\u0131 bunun analizini yapm\u0131\u015f olman\u0131z gerekiyor.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2021\/02\/08\/djangoda-websocket-kullanarak-gercek-zamanli-uygulama-gelistirme\/\" \/>\n<meta property=\"og:site_name\" content=\"blog website\" \/>\n<meta property=\"article:published_time\" content=\"2021-02-08T13:26:47+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-02-08T17:50:16+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.etemkeskin.com\/wp-content\/uploads\/2021\/02\/image-5.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Tahmini okuma s\u00fcresi\" \/>\n\t<meta name=\"twitter:data1\" content=\"4 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.etemkeskin.com\/#website\",\"url\":\"https:\/\/www.etemkeskin.com\/\",\"name\":\"blog website\",\"description\":\"Etem KESK\\u0130N\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https:\/\/www.etemkeskin.com\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"tr\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2021\/02\/08\/djangoda-websocket-kullanarak-gercek-zamanli-uygulama-gelistirme\/#primaryimage\",\"inLanguage\":\"tr\",\"url\":\"https:\/\/www.etemkeskin.com\/wp-content\/uploads\/2021\/02\/image-5.png\",\"contentUrl\":\"https:\/\/www.etemkeskin.com\/wp-content\/uploads\/2021\/02\/image-5.png\",\"width\":157,\"height\":218},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2021\/02\/08\/djangoda-websocket-kullanarak-gercek-zamanli-uygulama-gelistirme\/#webpage\",\"url\":\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2021\/02\/08\/djangoda-websocket-kullanarak-gercek-zamanli-uygulama-gelistirme\/\",\"name\":\"Django'da Websocket Kullanarak Ger\\u00e7ek Zamanl\\u0131 Uygulama Geli\\u015ftirme - blog website\",\"isPartOf\":{\"@id\":\"https:\/\/www.etemkeskin.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2021\/02\/08\/djangoda-websocket-kullanarak-gercek-zamanli-uygulama-gelistirme\/#primaryimage\"},\"datePublished\":\"2021-02-08T13:26:47+00:00\",\"dateModified\":\"2021-02-08T17:50:16+00:00\",\"author\":{\"@id\":\"https:\/\/www.etemkeskin.com\/#\/schema\/person\/dcbc30282861ce578b96a79ce8789629\"},\"description\":\"WebSocket, tek bir\\u00a0TCP ba\\u011flant\\u0131s\\u0131 \\u00fczerinden tam \\u00e7ift y\\u00f6nl\\u00fc ileti\\u015fim kanal\\u0131 sa\\u011flayan bir bilgisayar ileti\\u015fim protokol\\u00fcd\\u00fcr. T\\u00fcm internet taray\\u0131c\\u0131lar\\u0131 2011' den beri Websockets' leri destekliyor. Websocket ile uygulama geli\\u015ftirme pop\\u00fcler bir konu. Fakat uygulama geli\\u015ftirirken ger\\u00e7ekten ihtiyac\\u0131n\\u0131z var m\\u0131 bunun analizini yapm\\u0131\\u015f olman\\u0131z gerekiyor.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2021\/02\/08\/djangoda-websocket-kullanarak-gercek-zamanli-uygulama-gelistirme\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2021\/02\/08\/djangoda-websocket-kullanarak-gercek-zamanli-uygulama-gelistirme\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2021\/02\/08\/djangoda-websocket-kullanarak-gercek-zamanli-uygulama-gelistirme\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Ana sayfa\",\"item\":\"https:\/\/www.etemkeskin.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Django’da Websocket Kullanarak Ger\\u00e7ek Zamanl\\u0131 Uygulama Geli\\u015ftirme\"}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.etemkeskin.com\/#\/schema\/person\/dcbc30282861ce578b96a79ce8789629\",\"name\":\"etemkeskin\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.etemkeskin.com\/#personlogo\",\"inLanguage\":\"tr\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/6af0148b790691ed24ae245fb3dc773b?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/6af0148b790691ed24ae245fb3dc773b?s=96&d=mm&r=g\",\"caption\":\"etemkeskin\"},\"url\":\"https:\/\/www.etemkeskin.com\/index.php\/author\/etemkeskinyahoo-com\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","_links":{"self":[{"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/posts\/1130"}],"collection":[{"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/comments?post=1130"}],"version-history":[{"count":59,"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/posts\/1130\/revisions"}],"predecessor-version":[{"id":1262,"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/posts\/1130\/revisions\/1262"}],"wp:attachment":[{"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/media?parent=1130"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/categories?post=1130"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/tags?post=1130"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}