websocket上傳圖片
A. 關於websocket發送圖片
發送圖片有兩種方法：1.json傳送，2.base64傳送
json傳送：
base64傳送
這兩種方法都可以傳送圖片，那麼有什麼區別呢？通俗來說，json是一種比較「敗家」的行為，傳json開銷比較大，因為在嵌入式開發中，如果硬體資源比較有限，那麼就容易出問題，相對比較來純洞寬說，傳送base64相對比較節約。但是json帶來的開銷也是有好處的，因為它可以傳的東西太多了，比顫薯如json的key-value對用來傳數組就很方便，（這個可以去看我的另一篇文章 https://www.jianshu.com/p/772a49948792 ，裡面有json格式傳送數組）。
在嵌入做亮式開發中，json可以使用在雲端到前端中，但是在雲端到邊緣端中還是能省就省，如果有比json更節約資源的方式，那麼還是第二考慮使用json的。
以上是我實際經驗，如果有什麼問題，歡迎聯系我。
B. 前台html5後台用的c#WebSocket 怎麼上傳文件捏 大神們給個例子吧
html5可以用ajax上傳了
C. 大神們請教個文件上傳的問題 前台html5後台用的c#WebSocket 怎麼上傳文件捏
後台不有CS文件嗎，直接保存就好，
再調WebSocket多此一舉
D. web前端可視化圖表怎麼添加數據
需叢亂蠢要調介面嗎？不需要的話數據直接寫在data里返滲陪回出去就好啦，調用介面陪或的話，先定義一個空數組接收數據，返回出去，用prop調用就好
E. 使用瀏覽器websocket接收圖片，如何釋放內存
從代碼看貌似沒什麼問題，如果真的內存泄露了，那應該是瀏覽器的問題吧。
其實可以考慮直接通過傳datauri來規埋薯避這個問題，伺服器那邊使用字元串的方式傳圖片信息，格式為：data:image/png;base64，加上base64編滾伏碼的png文件內容。使用彎備者的時候直接用image.src=data就行，省去調用createObjectURL/revokeObjectURL的麻煩。
F. 各位大神們求教上傳文件的問題 前台html5後台用的c#WebSocket 怎麼上傳文件捏
在博客園搜。
G. 由WebRTC談起
原生支持： iOS13開始，使用URLSessionWebSocketTask類可實現像發送HTTP請求一樣的WebSocket功能。如果要對Web套接字（包括客戶端和伺服器支持）進行較低級別的控制，請查看Network框架： https://developer.apple.com/documentation/network 。
一、Socket
是對TCP/IP 協議的封裝，本質並不是一個協議，是應用層與 TCP/IP 協議族通信的中間軟體緩螞抽象層（類似於對底層的封裝），它是一組介面，讓你在使用的時候更方便操作。
二、WebSocket協議
是HTML5下一種新的協議，也是基於TCP的一種網路協議，它實現了 瀏覽器/客戶端 與 伺服器 全雙工(full-plex)通信——連接成功以後允許伺服器或客戶端的任何一方主動發送信息給對方。WebSocket協議由兩部分組成： 握手 和 數據傳輸 。Websocket是一個持久化的協議，只需要一次成功的HTTP握手，服務端會一直保留握手成功時的信息，直到客戶端或服務端關閉請求。
創建了WebSocket後，會有一個HTTP請求發送到伺服器以發起連接。取得伺服器響應後，建立的連接使用HTTP升級，從 HTTP協議 交換為 WebSocket協議 。WebSocket使用了自定義世信的協議，未加密的連接不再是 http:// ，而是 ws:// ，默認埠為 80 ；加密的連接也不是 https:// ，而是 wss:// ，默認埠為 443 。即，使用標準的HTTP伺服器無法實現WebSocket，只有支持WebSocket協議的伺服器才能正常工作。一旦WebSocket連接建立後，後續數據都以 幀序列 的形式傳輸。
WebSocket協議的特點包括：
（1）建擾返埋立在 TCP 協議之上。
（2）與 HTTP 協議有著良好的兼容性。握手階段採用 HTTP 協議，默認埠也是80和443，因此握手時不容易屏蔽，能通過各種 HTTP 代理伺服器。
（3）數據格式比較輕量，性能開銷小，通信高效。如何體現通信高效？WebSocket通信格式沒有HTTP協議那麼多的固定報頭，且不用重復建立連接。
（4）可以發送文本，也可以發送二進制數據。
（5）沒有同源限制，客戶端可以與任意伺服器通信。（什麼是同源限制？協議相同，域名相同，埠相同。目的是為了保證用戶信息的安全，防止惡意的網站竊取數據。）
（6）協議標識符是ws（如果加密，則為wss），伺服器網址就是 URL。
（7）WebSocket通信協議於2011年被IETF定為標准RFC 6455，WebSocket API被W3C定為標准。
WebSocket如何實現長鏈接 ？創建了WebSocket後，會有一個HTTP請求發送到伺服器以發起連接。取得伺服器響應後，建立的連接使用HTTP升級，從HTTP協議交換為WebSocket協議。只需要一次成功的HTTP握手，服務端會一直保留握手成功時的信息，直到客戶端或服務端關閉請求。WebSocket之所以能持久連接原因是它運行在TCP協議上，TCP協議自身是長連接協議，所以WebSocket當然可以長連接啦。
WebSocket如何管理連接 ？RFC6455-5.5意見稿指明：WebSocket協議定義了Control Frame 控制幀。WebSocket的控制幀有： Close 、 Ping 、 Pong 。
Close幀 ：發起關閉請求；
Ping幀 ：通信發起方確認鏈路是否暢通的報文；
Pong幀 ：通信接收方回應鏈路是否暢通的報文。
WebSocket在建立連接之後，通信的基本數據幀格式如下圖（來源RFC6455-5.2）沒有Http協議那麼多固定的報頭，且不用重復建立連接，所以通信效率高：
WebSocket連接的生命周期：
CONNECTING ：使用Http發起請求，RFC6455-4（ https://tools.ietf.org/html/rfc6455#section-4 ）規定了Client和Server的報文格式。Server在響應時使用Http狀態碼是101（切換協議）。在握手時，WebSocket連接處於CONNECTING狀態。
OPEN ：握手成功之後，進入OPEN狀態。
CLOSING ：如果一方發起了CLOSE幀，那麼便標志著WebSocket連接進入了CLOSING狀態；
CLOSED ：當TCP連接關閉之後，那麼WebSocet連接便進入了CLOSED狀態。
三、WebRTC
名稱源自 網頁實時通信 （Web Real-Time Communication）的縮寫，是谷歌2010年以6820萬美元收購Global IP Solutions公司而獲得的一項技術，由Google、Mozilla和Opera等支持的、免費的開放式項目。通過簡單的API為瀏覽器和移動應用程序提供跨平台的 音視頻實時通信 （RTC：Real-Time Communications ）功能。WebRTC使得開發者在瀏覽器無需安裝任何插件就可以實現音視頻通信。
WebRTC提供了跨平台的音視頻核心技術，包括音視頻的採集、編解碼、網路傳輸、顯示等功能，支持的平台：Windows、linux、Mac、Android及iOS。RTCPeerConnection是用於進行WebRTC調用以流式傳輸視頻和音頻以及交換數據的API，WebRTC使用RTCPeerConnection(對等連接)在瀏覽器之間傳遞 流數據 ，但也需要一種協調通信和發送控制消息的機制，這一過程稱為 信令 。信令處理過程需要客戶端之間來回傳遞消息，這個過程在WebRTC裡面是沒有實現的，需要自己創建。即WebRTC未指定信令方法和協議，需要開發者確保使用安全協議。所有WebRTC組件都必須進行加密，即 WebRTC是安全的 （如何保證安全？）。WebRTC這種技術可以讓開發者的精力集中在用戶體驗上而不是媒體流本身，因為API就會處理好媒體引擎的相關工作。
WebRTC 1.0 的重點是提供給開發者更多對媒體、數據通道的控制。而根據此前的提案（見後面的提案連接）顯示，下一版本的 WebRTC 將有可能使數據處理脫離主線程。使用 RTCDataChannels 傳輸數據，相比使用 WebSocket 會有更好的擁塞控制。（該段內容筆者未確認）
參考連接： http://www.sohu.com/a/275427719_458408
提案連接： https://www.w3.org/2011/04/webrtc/wiki/images/5/5c/WebRTCWG-2018-06-19.pdf
如何保證安全 ：當連通性檢測完成後，WebRTC會開啟 DTLS （Datagram TLS）握手，用於協商出SRTP中加密RTP包的 對稱秘鑰 。該過程稱為DTLS-SRTP，保證了數據傳輸的安全性。
參考： https://imweb.io/topic/5a4a6cb2a192c3b460fce37f
RTP/RTCP 和 SRTP/SRTCP協議是什麼？參考： https://blog.csdn.net/thinkerleo1997/article/details/80233530
基本概念：
SDP ： 即會話描述協議（Session Description Protocol ），主要保存當前會話的媒體和傳輸信息，其中媒體信息包括 媒體類型 、 傳輸協議 、 媒體格式 等，傳輸信息包括媒體的遠程 地址信息 、 帶寬 等；它由多行KV格式的文本信息組成，具體可參考這里（ https://tools.ietf.org/pdf/draft-nandakumar-rtcweb-sdp-08.pdf ）。WebRTC通過 信令 建立一個SDP握手的過程，只有通過SDP握手，雙方才知道對方的信息，這是建立p2p通道的基礎。
Offer ： 通信的發起方對自己的sdp描述
Answer ： 通信的接收方對自己的sdp描述
信令 ：協商通信過程，傳遞基本的數據信息，其中包括SDP描述信息、會話控制信息（節點加入、退出及各類的業務控制信息等）、網路信息、錯誤信息等。是指控制建立連接和斷開連接的狀態的數據。在建立連接之前，信令必須發生在 帶外 （通過伺服器），但一旦建立連接，就可以通過已經建立的通道發送更新信令（如掛斷）。（這里要了解一下什麼叫「帶外（OOB：Out-Of-Band）」，網路： https://ke..com/item/out-of-band/15801641?fr=aladdin ）
OOB概述 ：傳輸層協議使用 帶外數據 （out-of-band，OOB）來發送一些重要的數據，如果通信一方有重要的數據需要通知對方時，協議能夠將這些數據快速地發送到對方。為了發送這些數據，協議一般不使用與 普通數據 相同的通道，而是使用另外的通道。linux系統的套接字機制支持低層協議發送和接受帶外數據。但是TCP協議沒有真正意義上的帶外數據。為了發送重要協議，TCP提供了一種稱為 緊急模式 （urgent mode）的機制。TCP協議在數據段中設置 URG 位，表示進入緊急模式。接收方可以對緊急模式採取特殊的處理。很容易看出來，這種方式數據不容易被阻塞，並且可以通過在我們的伺服器端程序裡面捕捉 SIGURG 信號來及時接受數據。
信令通道 ：與服務端建立連接和斷開連接的通道，對於WebRTC而言就是信令通道。
STUN 伺服器：是用來取外網地址的。
TURN 伺服器：是在P2P失敗時進行轉發的，中繼轉發。
STUN 和 TURN 伺服器的作用主要處理打洞與轉發，配合完成 ICE協議 。
ICE ：Interactive Connectivity Establishment，互動式連接建立。
WebRTC通信
基於WebRTC的點對點音視頻通信流程如下：
1）客戶端A初始化本地音視頻設備，創建一個用於Offer的SDP對象，該對象中保存當前音視頻的相關信息；
2）客戶端A通過信令伺服器將SDP信息發送給客戶端B；
3）客戶端B接收到A的SDP信息後保存，初始化本地音視頻設備並創建用於Answer的SDP對象；
4）客戶端B通過信令伺服器將SDP信息發送給客戶端A；
5）客戶端A、B通過交換SDP等信息，建立P2P通道進行音視頻傳輸；
示意圖如下圖所示：
WebRTC ICE（互動式連接建立）(ICE：Interactive Connectivity Establishment)
以下是呼叫信令期間發生的消息交換的高級過程，即： WebRTC 信令交互流程圖 ：
************************************************開始************************************************
##關鍵詞
--[SOMETHING]-->：表示從主叫方發送給被叫方的「SOMETHING」類型的消息。另一解釋是： 主叫方所要執行操作 。
<--[SOMETHING]--：表示從被叫方發送給主叫方的「SOMETHING」類型的消息。另一解釋是： 被叫方所要執行的操作 。
SS (Signal Service)：通過伺服器發送的信息（通過BCM 伺服器發送的信息）
DC (Data Channel)：通過WebRTC 數據通道 發送的消息
### Message Exchange / State Flow Overview （消息交換/狀態流概述）
| Caller（主叫方） | Callee（被叫方） |
+----------------------------+-------------------------+
開始撥出電話：`handleOutgoingCall`...
--[SS.CallOffer]-->
…並開始生成iceCandidate候選，先保存在本地。iceCandidate裡麵包含了SDP、公網地址、用來標識當前ice中流媒體的id(sdpMid)，這個公網地址是由STUN、TURN Server發過來的。
當生成iceCandidate候選後，將會調用方法`handleLocalAddedIceCandidate` ，並把這些iceCandidate保存起來。
被叫方收到來電，通過 `handleReceivedOffer` 發送呼叫應答
<--[SS.CallAnswer]--
1. 開始生成iceCandidate候選。
2. 立即通過`handleLocalAddedIceCandidate` 將它們發送給主叫方。
<--[SS.ICEUpdate]-- (多次發送)
主叫方收到應答後調用方法: `handleReceivedAnswer`，接著發送所有前面保存的iceCandidate候選 (在此之後生成的iceCandidate候選會立即發送)
--[SS.ICEUpdates]--> (多次發送)
完成交換iceCandidate候選後…（此時表示雙方身份已確認，接下來會通過P2P通道建立音視頻會話，這里會涉及NAT技術，有可能失失敗。如果失敗，主叫方會一直顯示呼叫中，被叫方不會顯示任何界面）雙方都調用方法: `handleIceConnected`
顯示遠程鈴聲用戶界面
1.連接到提供的數據通道
2.顯示來電界面
3.如果被叫人接聽電話
4.發送連接消息
<--[DC.ConnectedMesage]--
接收到的連接消息後顯示呼叫已連接。
主叫方掛斷（被叫方同樣可以掛斷）調用方法：
--[DC.Hangup]-->
--[SS.Hangup]-->
************************************************結束************************************************
上面的消息交換可以整理為如下的簡化版的WebRTC建立連接過程：
1）主叫方通過 createOffer 生成 SDP 描述
2）主叫方通過 setLocalDescription，設置本地的描述信息
3）主叫方將 offer SDP 發送給被叫方
4）被叫方通過 setRemoteDescription，設置遠端的描述信息
5）被叫方通過 createAnswer 創建出自己的 SDP 描述
6）被叫方通過 setLocalDescription，設置本地的描述信息
7）被叫方將 anwser SDP 發送給主叫方
8）主叫方通過 setRemoteDescription，設置遠端的描述信息。
只有通過 SDP握手 ，雙方才知道對方的信息，這是建立p2p通道的基礎。 通過SDP握手後，客戶端之間就會建立起一個點對點的直接通訊通道。但是由於我們所處的網路環境錯綜復雜，用戶可能處在私有內網內，使用p2p傳輸時，將會遇到 NAT (網路地址轉換)以及防火牆等阻礙。這個時候我們就需要在SDP握手時，通過STUN/TURN/ICE相關 NAT穿透技術 (也有稱為 打洞 或 穿牆 技術)來保障p2p鏈接的建立。
WebRTC的視頻部分 ，包含採集、編解碼(I420/VP8)、加密、媒體文件、圖像處理、顯示、網路傳輸與流控(RTP/RTCP)等功能。
視頻採集支持多種媒體類型，比如I420、YUY2、RGB、UYUY等，並可以進行幀大小和幀率控制。
WebRTC採用I420/VP8編解碼技術。VP8是Google收購ON2後的開源實現，並且也用在WebM項目中。VP8能以更少的數據提供更高質量的視頻，特別適合視頻會議這樣的需求。
視頻加密是WebRTC的video_engine一部分，相當於視頻應用層面的功能，給點對點的視頻雙方提供了數據上的安全保證，可以防止在Web上視頻數據的泄漏。
視頻加密在發送端和接收端進行加解密視頻數據，密鑰由視頻雙方協商，代價是會影響視頻數據處理的性能；也可以不使用視頻加密功能，這樣在性能上會好些。
視頻加密的數據源可能是原始的數據流，也可能是編碼後的數據流。估計是編碼後的數據流，這樣加密代價會小一些，需要進一步研究。
WebRTC的音頻部分 ，包含設備、編解碼(iLIBC/iSAC/G722/PCM16/RED/AVT、NetEQ)、加密、聲音文件、聲音處理、聲音輸出、音量控制、音視頻同步、網路傳輸與流控(RTP/RTCP)等功能。
WebRTC採用iLIBC/iSAC/G722/PCM16/RED/AVT編解碼技術。
WebRTC還提供NetEQ功能---抖動緩沖器及丟包補償模塊，能夠提高音質，並把延遲減至最小。
另外一個核心功能是基於語音會議的混音處理。
聲音處理針對音頻數據進行處理，包括回聲消除(AEC)、AECM(AEC Mobile)、自動增益(AGC)、降噪(NS)、靜音檢測(VAD)處理等功能，用來提升聲音質量。
丟包補償原理是什麼？
自動增益（AGC：Automatic Gain Control）概念？
TCP協議 ：屬於傳輸層，是可靠的、面向連接的。主要解決如何在IP層之上可靠地傳遞數據包，使得網路上接收端收到發送端所發出的所有包，並且順序與發送順序一致。TCP連接的建立依靠「三次握手」，而釋放則需要「四次握手」。
IP協議 ：屬於網路層，主要解決 網路路由和定址 問題。
Http協議 ：屬於應用層協議，一個簡單的請求-響應協議，是一種無狀態、非持久的協議，是被動性的，也就是只能客戶端發起。服務端不保留上一次與客戶端交互時的任何狀態，每次都要重新傳輸 identity info （鑒別信息），來告訴服務端你是誰。HTTP的長連接和短連接本質上是TCP長連接和短連接。HTTP1.1支持keep-alive。
Http與WebSocket區別與聯系
（1）Http與WebSocket是兩個完全不同的協議，都是基於TCP的。兩者唯一的聯系是WebSocket利用Http進行握手；具體說明請看：RFC6455-1.7( https://tools.ietf.org/html/rfc6455#section-5.5 )
（2）WS默認也使用80埠；WSS默認也使用443埠。
（3）Http協議局限性一大堆，比如明文傳輸、無法保證信息完整性、沒有身份驗證等。而WebSocket的出現則是為了解決Http協議只能由Client發起通信請求的問題。WebSocket是 全雙工通信 。
（4）HTTP是運行在TCP協議傳輸層上的應用協議，而WebSocket是通過HTTP協議協商如何連接，然後獨立運行在TCP協議傳輸層上的應用協議。
WebSocket僅僅是利用了HTTP協議做連接請求。WebSocket相當於一個簡化版的TCP傳輸子層（實際上WebSocket也是應用層協議）。WebSocket之所以能持久連接原因是它運行在TCP協議上，TCP協議自身是長連接協議，所以WebSocket當然可以長連接啦。如果你要問為什麼HTTP不是長連接，原因是早期的HTTP在發起每個請求，響應完成後就會關閉Socket。但是後來加了多路復用KeepAlive協議後HTTP協議已經可以實現長連接了，可以處理長連接事務了。至於添加WebSocket特性，是為了更好、更靈活，輕量的與伺服器通訊。因為WebSocket提供了簡單的消息規范，可以更快的適應長連接的環境，其實現在HTTP協議自身就可以做，但是不太輕便，因為HTTP是一種無狀態、非持久的協議，是被動性的，也就是只能客戶端發起。服務端不保留上一次與客戶端交互時的任何狀態，每次都要重新傳輸 identity info （鑒別信息），來告訴服務端你是誰，每次請求和應答都帶有完整的Http頭，佔用網路傳輸帶寬，增加了每次傳輸的數據量。為什麼HTML4不支持WebSocket？原因是WebSocket的協商機制HTML4底層API沒有實現。
WebSocket與Socket是沒什麼關系的
WebSocket協議 和 Http協議： 都是基於TCP的，所以他們都是可靠的協議，是在應用層。
Socket： 是對TCP/IP 協議的封裝，本質並不是一個協議，是應用層與 TCP/IP 協議族通信的中間軟體抽象層（類似於對底層的封裝），它是一組介面，讓你在使用的時候更方便操作。
WebSocket與WebRTC(Web Real-Time Communication)是什麼關系？
WebSocket： 是WebRTC的基礎，為WebRTC負責客服端發現和數據轉發。
TCP協議 ：參考 https://blog.csdn.net/Awille/article/details/79748193
SocketRocket ：Facebook的開源框架
WebRTC開發和VoIP開發之間有什麼區別與聯系？
待完善知識點：WebRTC移動端兼容性檢測，如何配置MediaStreamConstraints， 信令(iceCandidate, sessionDescription)傳輸方式的選擇，iceCandidate和sessionDescription設置的先後順序，STUN和TURN的概念，如何實現截圖及錄制視頻及上傳圖片和視頻功能，如何高效跟蹤錯誤？
WebRTC擁塞控制和碼率調節策略是怎麼樣的？在弱網環境下如何保證圖像不失真？
猜：好像是改RTCRtpEncodingParameters這個類里的ssrc參數。是改采樣頻率？
參考資料：
WebRTC網路： https://ke..com/item/WebRTC/5522744?fr=aladdin
WebRTC基礎知識： https://webrtc.org.cn/category/basic/
GoogleWebRTC-pod安裝文檔：https:// cocoapods.org/pods/GoogleWebRTC
GoogleWebRTC-iOS官網： https://webrtc.org/native-code/ios/
H. WebSocket SpringBoot實現文件上傳進度消息通知
文件上傳進度消息：
非同步耗時任務完成消息：
常見方案：
根據解析器構造，傳入必要參數。該解析器將替代默認實現
spring為WebSocket提供了很好的支持，參照官方文檔即可完成服務搭建
繼承 類，重寫 registerStompEndpoints() configureMessageBroker() configureClientInboundChannel() 方法。
此處通過註解切面，在需要執行的方法前後想Message服務發送消息
該切面將以@SendMessage註解為切入點，利用反射獲取形參名及參數值，封裝MessageDto，調用Feign介面向消息模塊發送消息
文件上傳監聽日誌，成功監聽上傳進度
文件上傳進度消息發送日誌
耗時任務消息模塊發送日誌
前端消息渲染效果
大功告成！
尚有諸多缺點，但保證了基礎功能夠用，諸位大佬可以做個小參考。
I. html5+websocket上傳文件問題
websocket目前只支持文本，不支持二進制數據。上傳多個文件，用 <input type="file"> 結合 ajax 的 POST 足夠了
J. 如何用webSocket發送圖片
用尺消Node.js實現server。運行方式：
npm install ws
node server.js
運行陵坦知client.htm
目錄結構信租如下：
