<\/div>\n

Merhaba,<\/p>\n

SignalR vas\u0131tas\u0131yla client ile server aras\u0131nda e\u015fzamanl\u0131 bir etkile\u015fim sa\u011flanmaya \u00e7al\u0131\u015f\u0131l\u0131rken, ilk etapta bir ba\u011flant\u0131n\u0131n olmamas\u0131 yahut var olan ba\u011flant\u0131n\u0131n s\u00fcre\u00e7 i\u00e7erisinde kopmas\u0131 durumlar\u0131na istinaden bu ba\u011flant\u0131n\u0131n yeniden veya ilk olarak belli aral\u0131klarla sa\u011flanmaya \u00e7al\u0131\u015f\u0131lmas\u0131 gerekmektedir. Bir yandan bu ba\u011flant\u0131 ger\u00e7ekle\u015ftirme s\u00fcre\u00e7lerinde, ba\u011flant\u0131n\u0131n durumu hakk\u0131nda bilgi edinebilmek i\u00e7in tasarlanm\u0131\u015f olaylar devreye sokularak, kullan\u0131c\u0131y\u0131 y\u00f6nlendirmemiz gerekebilmektedir. \u0130\u015fte bu i\u00e7eri\u011fimizde, bu ihtiya\u00e7lar do\u011frultusunda otomatik ba\u011flant\u0131 konfig\u00fcrasyonunun nas\u0131l ger\u00e7ekle\u015ftirilece\u011fi, ba\u011flant\u0131 durumu hakk\u0131nda bilgi veren event’lerin neler oldu\u011fu ve nas\u0131l tan\u0131mland\u0131\u011f\u0131 hakk\u0131nda jQuery \u00fczerinden detayl\u0131 incelemede bulunaca\u011f\u0131z.<\/p>\n

Otomatik Ba\u011flant\u0131 Konfig\u00fcrasyonu<\/h3>\n

Otomatik ba\u011flant\u0131 konfig\u00fcrasyonu; ilk etapta bir ba\u011flant\u0131n\u0131n olmad\u0131\u011f\u0131 veya ba\u011flant\u0131n\u0131n s\u00fcre\u00e7 i\u00e7erisinde koptu\u011fu durumlar\u0131na istinaden \u00f6zel olarak yap\u0131land\u0131r\u0131labilir. \u0130lk olarak ba\u011flant\u0131n\u0131n s\u00fcre\u00e7 i\u00e7erisinde koptu\u011fu durumlarda otomatik ba\u011flant\u0131 konfig\u00fcrasyonunu ele alal\u0131m. Bunun i\u00e7in withAutomaticReconnect<\/strong><\/code> fonksiyonu kullan\u0131lmaktad\u0131r.<\/p>\n

withAutomaticReconnect; e\u015fzamanl\u0131 etkile\u015fime girmi\u015f olan client ile server aras\u0131ndaki ba\u011flant\u0131n\u0131n s\u00fcre\u00e7 esnas\u0131nda kopmas\u0131 sonucu tekrar ba\u011flan\u0131lmas\u0131n\u0131 sa\u011flayan bir fonksiyondur. Ba\u011flant\u0131 koptuktan sonra s\u0131ras\u0131yla 0<\/em><\/strong> -> 2<\/em><\/strong> -> 10<\/em><\/strong> -> 30<\/em><\/strong> saniyelik periyotlarla d\u00f6rt kez tekrarl\u0131 bir \u015fekilde ba\u011flant\u0131y\u0131 deneyecektir.<\/p>\n

\r\n         var connection = new signalR.HubConnectionBuilder()\r\n            .configureLogging(signalR.LogLevel.Information)\r\n            .withUrl("https:\/\/localhost:5001\/myhub")\r\n            .withAutomaticReconnect()\r\n            .build();\r\n<\/pre>\n<\/a>
\nYukar\u0131daki ekran g\u00f6r\u00fcnt\u00fcs\u00fcnde oldu\u011fu gibi bu denemelerden herhangi birinde ba\u011flant\u0131 sa\u011flan\u0131yorsa uygulama i\u015flevine sa\u011fl\u0131kl\u0131 bir \u015fekilde devam edecektir.<\/p>\n
withAutomaticReconnect’in parametresi \u00fczerinden verilen dizisel de\u011ferler ile tekrardan deneme periyodu belirlenerek, \u00f6zelle\u015ftirilebilmektedir.<\/p>\n
\r\n         var connection = new signalR.HubConnectionBuilder()\r\n            .configureLogging(signalR.LogLevel.Information)\r\n            .withUrl("https:\/\/localhost:5001\/myhub")\r\n            .withAutomaticReconnect([1000, 1000, 2000, 3000, 5000, 1000, 100, 100])\r\n            .build();\r\n<\/pre>\nYukar\u0131daki tan\u0131mlamaya g\u00f6z atarsan\u0131z e\u011fer s\u00fcre\u00e7te ba\u011flant\u0131n\u0131n kopmas\u0131 durumunda s\u0131ras\u0131yla 1 saniye<\/strong><\/em> -> 1 saniye<\/strong><\/em> -> 2 saniye<\/strong><\/em> -> 3 saniye<\/strong><\/em> -> 5 saniye<\/strong><\/em> -> 1 saniye<\/strong><\/em> -> 100 milisaniye<\/strong><\/em> -> 100 milisaniye<\/strong><\/em> aral\u0131klar\u0131yla tekrar ba\u011flant\u0131 denenmi\u015f olacakt\u0131r.<\/p>\n
\u0130kinci olarak ilk etapta ba\u011flant\u0131n\u0131n olmad\u0131\u011f\u0131 durumdaki otomatik ba\u011flant\u0131 konfig\u00fcrasyonunu ele alal\u0131m. Buna el ile yeniden ba\u011flant\u0131 yahut manuel yeniden ba\u011flant\u0131da diyebiliriz. <\/p>\n\r\n         async function start() {\r\n            try {\r\n               await connection.start()\r\n            } catch (error) {\r\n               setTimeout(() => start(), 2000);\r\n            }\r\n         }\r\n\r\n         start();\r\n<\/pre>\nYukar\u0131daki kod blo\u011funu incelerseniz e\u011fer connection nesnesinin ‘start’ fonksiyonu \u00e7a\u011fr\u0131ld\u0131\u011f\u0131nda herhangi bir hata f\u0131rlat\u0131l\u0131yorsa e\u011fer ak\u0131\u015f catch’e d\u00fc\u015fecek ve 2000 saniye sonra yeniden bir ba\u011flant\u0131 ger\u00e7ekle\u015ftirilmeye \u00e7al\u0131\u015f\u0131lacakt\u0131r ve bu i\u015flem ba\u015far\u0131l\u0131 oluncaya kadar devam edecektir.<\/p>\n
\u0130lgili \u00e7al\u0131\u015fma benzer mant\u0131kla a\u015fa\u011f\u0131daki gibi de kodlanabilir;<\/p>\n\r\n         function start() {\r\n            connection.start().then(() => { }).catch(error => setTimeout(() => start(), 2000))\r\n         }\r\n\r\n         start();\r\n<\/pre>\n<\/a><\/p>\n
Durum Fonksiyonlar\u0131<\/h3>\nDurum fonksiyonlar\u0131, client ile server aras\u0131ndaki ba\u011flant\u0131n\u0131n ger\u00e7ekle\u015fme durumuna g\u00f6re f\u0131rlat\u0131lan event’lerdir. onreconnecting<\/em><\/strong>, onreconnected<\/em><\/strong> ve onclose<\/em><\/strong> olmak \u00fczere \u00fc\u00e7 adettir.<\/p>\n\nonreconnecting<\/em><\/strong>
\nYeniden ba\u011flanma giri\u015fimlerini ba\u015flatmadan \u00f6nce f\u0131rlat\u0131lan event’tir.<\/p>\n\r\n         connection.onreconnecting(error => {\r\n            console.assert(connection.state === signalR.HubConnectionState.Reconnecting);\r\n            console.log("Ba\u011flant\u0131 ger\u00e7ekle\u015ftiriliyor.")\r\n         });\r\n<\/pre>\n<\/li>\nonreconnected<\/em><\/strong>
\nYeniden ba\u011flant\u0131 ger\u00e7ekle\u015ftirildi\u011finde f\u0131rlat\u0131l\u0131r.<\/p>\n\r\n         connection.onreconnected(connecitonid => {\r\n            console.assert(connection.state === signalR.HubConnectionState.Connected);\r\n            console.log("Ba\u011flant\u0131 ger\u00e7ekle\u015ftirildi.")\r\n         });\r\n<\/pre>\nBurada ba\u011flant\u0131 ger\u00e7ekle\u015ftiren client’a di\u011ferlerinden ay\u0131rmak i\u00e7in server taraf\u0131ndan bir connectionid verilmektedir.\n<\/li>\nonclose<\/em><\/strong>
\nYeniden ba\u011flant\u0131 giri\u015fimlerinin sonu\u00e7suz kald\u0131\u011f\u0131 durumda f\u0131rlat\u0131l\u0131r.<\/p>\n\r\n         connection.onclose(connecitonid => {\r\n            console.assert(connection.state === signalR.HubConnectionState.Disconnected);\r\n            console.log("Ba\u011flant\u0131 ger\u00e7ekle\u015ftirilemedi.")\r\n         });\r\n<\/pre>\n<\/li>\n<\/ul>\n\u00d6rnek Yapal\u0131m<\/h4>\n\r\n<!DOCTYPE html>\r\n<html>\r\n\r\n<head>\r\n   <script src="node_modules\/@microsoft\/signalr\/dist\/browser\/signalr.min.js"><\/script>\r\n   <script src="node_modules\/jquery\/dist\/jquery.min.js"><\/script>\r\n   <script>\r\n      $(document).ready(() => {\r\n         var connection = new signalR.HubConnectionBuilder()\r\n            .configureLogging(signalR.LogLevel.Information)\r\n            .withUrl("https:\/\/localhost:5001\/myhub")\r\n            .withAutomaticReconnect([1000, 1000, 1000, 1000])\r\n            .build();\r\n         function start() {\r\n            connection.start().then(() => { }).catch(error => setTimeout(() => start(), 2000))\r\n         }\r\n         start();\r\n         connection.onreconnecting(error => {\r\n            $("div").css("background-color", "#6286a0");\r\n            $("div").css("color", "#white");\r\n            $("div").html("Ba\u011flan\u0131l\u0131yor")\r\n         });\r\n         connection.onreconnected(connecitonid => {\r\n            $("div").css("background-color", "#32a838");\r\n            $("div").css("color", "#white");\r\n            $("div").html("Ba\u011fland\u0131")\r\n         });\r\n         connection.onclose(connecitonid => {\r\n            $("div").css("background-color", "red");\r\n            $("div").css("color", "#white");\r\n            $("div").html("Ba\u011flan\u0131lamad\u0131")\r\n         });\r\n      });\r\n   <\/script>\r\n   <style>\r\n      div {\r\n         background-color: #6286a0;\r\n         border: 15px solid rgba(255, 255, 255, .5);\r\n         border-radius: 115px;\r\n         width: 80px;\r\n         height: 80px;\r\n         line-height: 80px;\r\n         font-size: 12px;\r\n         color: white;\r\n         font-family: Arial, Helvetica, sans-serif;\r\n         font-weight: bold;\r\n         text-shadow: #2d4251 5px 5px 5px;\r\n      }\r\n   <\/style>\r\n<\/head>\r\n<body>\r\n   <div><\/div>\r\n<\/body>\r\n<\/html>\r\n<\/pre>\n<\/a><\/p>\n
\u0130lgilenenlerin faydalanmas\u0131 dile\u011fiyle…
\nSonraki yaz\u0131lar\u0131mda g\u00f6r\u00fc\u015fmek \u00fczere…
\n\u0130yi \u00e7al\u0131\u015fmalar…<\/p>\n
Not : \u00d6rnek uygulamay\u0131 indirmek i\u00e7in buraya<\/a> t\u0131klay\u0131n\u0131z.<\/p>\n","protected":false},"excerpt":{"rendered":"
Merhaba, SignalR vas\u0131tas\u0131yla client ile server aras\u0131nda e\u015fzamanl\u0131 bir etkile\u015fim sa\u011flanmaya \u00e7al\u0131\u015f\u0131l\u0131rken, ilk etapta bir ba\u011flant\u0131n\u0131n olmamas\u0131 yahut var olan ba\u011flant\u0131n\u0131n s\u00fcre\u00e7 i\u00e7erisinde kopmas\u0131 durumlar\u0131na istinaden bu ba\u011flant\u0131n\u0131n yeniden veya ilk olarak belli aral\u0131klarla...<\/p>\n","protected":false},"author":1,"featured_media":17653,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3760],"tags":[3789,3788,3787,639,3784,3785,3786],"class_list":["post-17800","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-signalr","tag-onclose","tag-onreconnected","tag-onreconnecting","tag-signalr","tag-signalr-otomatik-baglanti","tag-signalr-reconnect","tag-withautomaticreconnect"],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts\/17800","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/comments?post=17800"}],"version-history":[{"count":19,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts\/17800\/revisions"}],"predecessor-version":[{"id":17823,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/posts\/17800\/revisions\/17823"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/media\/17653"}],"wp:attachment":[{"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/media?parent=17800"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/categories?post=17800"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.gencayyildiz.com\/blog\/wp-json\/wp\/v2\/tags?post=17800"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}