iT邦幫忙

signalr相關文章
共有 31 則文章
鐵人賽 Modern Web DAY 30

技術 30. 來玩玩即時互動App吧! ASP.NET Core SignalR 總結 & 完賽心得

今天終於最後一天啦!等這天等了好久囉哈哈!,其實應該是一直被發文進度追得很苦惱才對,總之先來個總結吧! 總結 SignalR和SignalR Core最大的差別...

鐵人賽 Modern Web DAY 29

技術 29. 部屬SignalR到Server上

既然實作都做完了,卻只能單機自己使用好像怪怪的,至少要能開放自己的內網使用才對,所以今天要來教大家怎麼把自己的signalR部署到Apache和IIS 安裝.N...

鐵人賽 Modern Web DAY 28

技術 28. 實作Web即時共同編輯文件 (8) - 最後的BUG修正+小功能添加

真的是越複雜的功能,越容易出現不少的BUG,前面做了7篇原本以為我大概的狀況我都有抓到,直到昨天做完發現蠻多BUG,所以今天就來幫這個時做來做最後修正吧! 不同...

鐵人賽 Modern Web DAY 27

技術 27. 實作Web即時共同編輯文件 (7) - 新增自訂文件及載入自訂文件

今天就來完成最後的部分吧!最後要載入和建立自訂的文件,首先來先來做建立文件的部分 建立自訂文件 首先先建立切換畫面事件,讓建立文件的Button能切換頁面 go...

鐵人賽 Modern Web DAY 26

技術 26. 實作Web即時共同編輯文件 (6) - 新增登錄畫面及選擇文件列表

今天我們要來做自訂表格內容和連線列表,既然建立表格的方法都訂好了,當然要能從前端建立啊!XD 各畫面區塊建立 這次我想做4個畫面登入畫面、文件選擇畫面、文件建立...

鐵人賽 Modern Web DAY 25

技術 25. 實作Web即時共同編輯文件 (5) - 一些小功能修正

今天是一些小地方的修正,其實做到這邊還有很多需要修正的地方,一個是重整後編輯中的顏色不會重新讀取,一個是編輯中關閉不會回船取消編輯,就是在編輯的人沒移開編輯中的...

鐵人賽 Modern Web DAY 24

技術 24. 實作Web即時共同編輯文件 (4) - 幫編輯中的表格添加顏色

今天要來幫編輯中的表格更換顏色,顏色就是昨天做的使用者顏色,這次是要放到編輯的cell內,並且鎖住不讓其他人同時編輯。 幫編輯中的表格著色 我發現直接對表格誆著...

鐵人賽 Modern Web DAY 23

技術 23. 實作Web即時共同編輯文件 (3) - 加入上線使用者清單

昨天我們做到能互相傳遞編輯的文字,今天我們要來實現上線的名單吧! 建立上線名單 首先我們來做一下上線名單的樣式,Day11一個Select元素裝進去太醜了,這次...

鐵人賽 Modern Web DAY 22

技術 22. 實作Web即時共同編輯文件 (2) - 使用signalR同步文件內容

沒想到昨天光完成前端的部分就花那麼多時間,看來這次實作比上次難了不少,大概是因為沒使用套件的關係吧!XD 那麼今天就來做signalR同步的部分吧。 資料Bin...

鐵人賽 Modern Web DAY 21

技術 21. 實作Web即時共同編輯文件 (1) - 建立文件編輯介面

有沒有覺得第一次看到Google共用編輯文件很好玩,它把類似Excel功能搬到Web上,然後又能共同編輯,我們這次就是要來模仿做一個類似GOOGLE文件共同編輯...

鐵人賽 Modern Web DAY 20

技術 20. 實作一個即時投票系統 (5) - 讀取建立的投票

今天就是即時投票系統最後一篇了,讓我們努力把它完成吧! 讀取投票資料 首先我們要把畫面改一下,一堆按鈕投票感覺很笨 投票畫面修改 我們這次不要一堆按鈕,改成把選...

鐵人賽 Modern Web DAY 19

技術 19. 實作一個即時投票系統 (4) - 建立投票列表

今天我們要來做投票列表,概念跟Day11的上線名單一模一樣,忘記的可以去回顧一下,那麼我們就開始吧! 建立列表HTML元素 我們先把voteMenu區塊設成顯示...

鐵人賽 Modern Web DAY 18

技術 18. 實作一個即時投票系統 (3) - 自訂投票內容

今天繼續把投票系統沒做完的做完吧,上一篇我們是從後端建立一個新的投票,今天我們要做成改成前端建立投票,然後讓大家進去投票,這個部分有點長,所以也是拆成2偏來講。...

鐵人賽 Modern Web DAY 17

技術 17. 實作一個即時投票系統 (2) - 使用signalR同步投票

今天要來把即時投票系統跟SignalR連線囉! 基本上跟塗鴉板也是差不多,但是投票系統應該需要自訂投票的選項和建立投票的種類,這個部份我們需要去設計物件來達成,...

鐵人賽 Modern Web DAY 16

技術 16. 實作一個即時投票系統 (1) - 投票介面建置

今天我們要來實作一個即時投票系統,前端的圖表呈現部分,我們要依賴Chart.js這個JS函式庫,所以今天就先來帶大家瞭解一下Chart.js大概的使用方法。 首...

鐵人賽 Modern Web DAY 15

技術 15. 實作一個共用塗鴉牆 (4) - 載入時同步

今天應該最後一篇塗鴉牆了,來講講畫版載入時同步的功能,在載入時必須和前面畫過的畫面同步,避免之後進來的人看到的畫面跟先進來看到會有不一樣的狀況,所以我們得做一個...

鐵人賽 Modern Web DAY 14

技術 14. 實作一個共用塗鴉牆 (3) - 新增橡皮擦功能

今天我們要幫塗鴉牆加上橡皮擦的功能,只能畫不能擦掉感覺真的是蠻奇怪的,當然擦的時候也要同時擦全部的畫版。 橡皮擦功能 這邊我在實作時,一開始是想到只有用透明色或...

鐵人賽 Modern Web DAY 13

技術 13. 實作一個共用塗鴉牆 (2) - signal同步畫板

今天要來做塗鴉牆第2部分,首先我們得想想該回傳些什麼,制定一個Json格式回傳回去。 前端部分 連接部分程式碼先寫好 var connection = new...

鐵人賽 Modern Web DAY 12

技術 12. 實作一個共用塗鴉牆 (1) - 前端塗鴉板製作

今天我們來實作一個共用塗鴉牆,其實之前看到Canvas的應用一直想玩玩看,但是一直都沒時間玩,剛好這次SignalR實作可以用到!XD 今天先做前端塗鴉的實作,...

鐵人賽 Modern Web DAY 11

技術 11. 實作一個連線名單

今天要來個小型的實作一個連線名單,連線名單可以讓你知道目前在線的人有誰(廢話),之前的範例都是在進入時傳送訊息給所有人,如果是中途進來的人,是無從得知目前有哪些...

鐵人賽 Modern Web DAY 10

技術 10. SignalR 組態設定

先來碎碎念一下,昨天gitpage一直有問題,害我git push好幾次,後來發現repo裡的文件是新的沒錯,今天一看又好了,真是的浪費我快30分鐘 今天來講講...

鐵人賽 Modern Web DAY 9

技術 09. 使用MessagePack傳輸更小的資料

MessagePack是一個類似Json格式但是比Json速度更快、檔案更小,不過似乎還沒很流行就是了,既然ASP.Net Core SignalR文件上面有特...

鐵人賽 Modern Web DAY 8

技術 08. 使用Json傳遞訊息和跨網域驗證

今天要來講講怎麼使用JSON傳遞訊息及跨網域訊息。 使用JSON格式 在Service註冊 其實這步是可以跳過,因為SignalR預設會開啟AddJsonPro...

鐵人賽 Modern Web DAY 7

技術 07. SignalR 群組概念與使用

今天來介紹群組的運作,不知道會不會有人問為什麼要群組??總不能每次訊息都傳給所有人吧!XD 所以今天就讓我們好好來介紹一下SignalR群組運作的方式。 使用方...

鐵人賽 Modern Web DAY 6

技術 06. SignalR 前端API運用

連接事件 建立連線,我們需要建立一個連線物件,withUrl(Hub)裡的參數放入要連接的Hub名稱,再用build()建立連線物件。 var connecti...

鐵人賽 Modern Web DAY 5

技術 05. 使用SignalR Hub (2)

今天來點輕鬆的吧!來寫寫強型別的Hub和把HubContext注入Controller 強型別Hub的好處 SignalR的Hub介面只規定我們要實作OnCon...

鐵人賽 Modern Web DAY 4

技術 04. 使用SignalR Hub (1)

SignalR Hub是什麼? 其實你從它的名字也看得出來是什麼,Hub不就是集線器的意思XD,不過這邊的線不是網路線而是Browser和Server溝通的橋樑...

鐵人賽 Modern Web DAY 3

技術 03. 第一個SingalR專案

我想先帶大家做一遍,之後再開始講觀念,因為我覺得這樣會比較好玩一點XD。 建立Web專案 首先先開啟終端機(命令提示字元),輸入下面指令建立專案 $ dotne...

鐵人賽 Modern Web DAY 2

技術 02. 架設SignalR環境

今天來先來裝需要的環境 需要的OS環境 OS環境Windows、Linux、Mac OS任一都行,主要操作是用dotNet CLI和VS Code不用擔心會有不...

鐵人賽 Modern Web DAY 1

技術 01. ASP.Net Core SignalR 導讀

今天第一天來點輕鬆的,我們來說說SignalR是什麼? ASP.NET Core SignalR是什麼? SignalR是一個能輕鬆架構即時互動(real-t...