快訊!我的新書今天開始可以在天瓏網路書店預購啦!歡迎大家前往訂購!
>>>> AI 職場超神助手:ChatGPT 與生成式 AI 一鍵搞定工作難題 <<<<

Web Developer

  • ,

    Error: probe transport websocket failed

    參考文章 Socket.io 1.x: use WebSockets only? 相關參數 這個問題主要可參考Engine.io介紹的連線設定的章節

  • , ,

    Engine.io介紹

    Engine.io介紹 Socket.io是在engine.io的基礎上去實作的 Gitlab連結: Engine.IO: the realtime engine engine.io為socket.io提供跨瀏覽器/跨設備的雙向通信的底層庫。engine.io使用了Websocket和XHR方式封裝了一套socket協議。在低版本的瀏覽器中,不支持Websocket,為了兼容使用長輪詢( polling )替代。 關於長輪詢可參考我的另一篇文章:WebSocket與Ajax的不同 過去WebSocket未出來時,許多聊天室使用的都是長輪詢的方式去實作,而engine.io則可依據客戶端環境兼容使用這兩種方式。

  • TCP連線階段與TIME_WAIT意義

    TCP運作方式 TCP協定的執行可劃分為三個階段:連接建立(connection establishment)、資料傳送(data transfer)和連接終止(connection termination)。

  • ,

    Redis Sentinel

    Sentinel特性 Redis Sentinel為Redis提供高可用性。實際上,這意味著使用Sentinel可以創建Redis部署,該部署可以在沒有人工干預的情況下抵抗某些類型的故障。 Redis Sentinel還提供其他附帶任務,例如監視,通知,並充當客戶端的配置提供程序。 這是宏觀上Sentinel功能的完整列表(即,大圖): 監控。Sentinel會不斷檢查您的主實例和副本實例是否按預期工作。 通知。Sentinel可以通過API通知系統管理員或其他計算機程序,其中一個受監視的Redis實例出了問題。 自動故障轉移。如果主服務器未按預期工作,則Sentinel可以啟動故障轉移過程,在該過程中將副本升級為主服務器,將其他附加副本重新配置為使用新的主服務器,並通知使用Redis服務器的應用程序要使用的新地址。連接時。 配置提供程序。Sentinel充當客戶端服務發現的授權來源:客戶端連接到Sentinels,以詢問負責給定服務的當前Redis主服務器的地址。如果發生故障轉移,Sentinels將報告新地址。 Redis Sentinel是一個分佈式系統: Sentinel本身設計為在有多個Sentinel進程協同合作的配置中運行。具有多個Sentinel進程進行協作的優點如下: 當多個哨兵就給定的主機不再可用這一事實達成共識時,將執行故障檢測。這降低了誤報的可能性。 即使不是所有的Sentinel進程都在工作,Sentinel仍能正常工作,從而使系統能夠應對故障。畢竟,擁有故障轉移系統本身就是一個單點故障,這沒有任何樂趣。

  • ,

    npm module – ioredis介紹

    Redis介紹 Redis是REmote DIctionary Server(遠程字典服務器)的縮寫,它以字典結構(key-value鍵值對結構)存儲數據,並允許其他應用通過TCP協議讀寫字典中的內容。所以,redis是一個key-value存儲系統,或者說是一個key-value數據庫。 Redis的內存存儲和持久化Redis數據庫中的所有數據都存儲在內存中。由於內存的讀寫速度遠快於硬盤,因此Redis在性能上對比其他基於硬盤存儲的數據庫有非常明顯的優勢,在一臺普通的筆記本電腦上,edis可以在一秒內讀寫超過十萬個鍵值。將數據存儲在內存中也有問題,例如,程序退出後內存中的數據會丟失。不過 Redis提供了對持久化的支持,即將可以內存中的數據異步寫入到硬盤中,同時不影響繼續提供服務。 ioredis介紹 ioredis是一個功能強大的功能強大的Redis客戶,已被世界上最大的在線商務公司阿里巴巴和許多其他了不起的公司所使用。

  • 使用Charles Proxy抓取nodejs的網路使用

    設定Charles 1. 針對HTTP流量 按下Proxy » Reverse Proxies… 選擇 Enable Reverse Proxies, 新增一個項目: Local Port: 60103 – any unused local port Remote Host: claire-chang.com – target host…

  • 用Charles以本地/遠端內容取代網路回應

    以本地檔案內容取代網路回應 有時我們在本地開發網頁功能時,若以API的方式去讀取資料,當我們在測試時可能會希望回傳某個固定的response。這時候就可以用Map Local的功能。 使用步驟 1、Save Response 選擇要模擬數據的接口,然後右鍵,選擇“Save Response”

  • 加解密用的模組 – yeast

    模組資訊 官網: https://www.npmjs.com/package/yeast GitHub: https://github.com/unshiftio/yeast 模組介紹 yeast是唯一的ID生成器。它的主要目的是生成可用於緩存清除的唯一ID。通常的做法是使用時間戳記,但是使用時間戳記有幾個缺點。 時間戳已經是13個字符了。這可能對1個請求無關緊要,但是如果您發出數百個請求,則這會迅速增加帶寬和處理時間。 它不夠獨特。如果您緊接彼此生成兩個標記,則它們將是相同的,因為計時精度限制為毫秒。 yeast通過以下方式解決了這兩個問題: Compressing the generated timestamp using a custom encode() function that returns a string representation of…

  • WebSocket與Ajax的不同

    WebSocket與Ajax的不同 WebSocket 是HTML5 開始提供的一種在單個TCP 連接上進行全雙工通訊的協議。 WebSocket 使得客戶端和服務器之間的數據交換變得更加簡單,允許服務端主動向客戶端推送數據。在WebSocket API 中,瀏覽器和服務器只需要完成一次握手,兩者之間就直接可以創建持久性的連接,並進行雙向數據傳輸。 在WebSocket API 中,瀏覽器和服務器只需要做一個握手(polling)的動作,然後,瀏覽器和服務器之間就形成了一條快速通道。兩者之間就直接可以數據互相傳送。 現在,很多網站為了實現推送技術,所用的技術都是Ajax 輪詢。輪詢是在特定的的時間間隔(如每1秒),由瀏覽器對服務器發出HTTP請求,然後由服務器返回最新的數據給客戶端的瀏覽器。這種傳統的模式帶來很明顯的缺點,即瀏覽器需要不斷的向服務器發出請求,然而HTTP請求可能包含較長的header,其中真正有效的數據可能只是很小的一部分,顯然這樣會浪費很多的帶寬等資源。 HTML5 定義的WebSocket 協議,能更好的節省服務器資源和帶寬,並且能夠更實時地進行通訊。 下圖是兩種方式的對比圖,我們可以看到Ajax是一直相同頻率的http request,而WebSocket在第一次的握手(http)之後就改走WebSocket的路 WebSocket 屬性 Socket.readyState: 屬性readyState表示連接狀態,可以是以下值: 0 –…

  • , ,

    使用Charles抓取手機網路使用

    使用Charles抓取手機網路使用資訊 將電腦和手機連上同一個WIFI網路 輸入ifconfig(MAC電腦)取得電腦的內網IP,如下圖可得知內網IP為192.168.1.104 設置Charles上的Proxy settings 設置手機上的WIFI的PROXY 此時即可在電腦上看到手機的網路使用狀況


17年資歷女工程師,專精於動畫、影像辨識以及即時串流程式開發。經常組織活動,邀請優秀的女性分享她們的技術專長,並在眾多場合分享自己的技術知識,也活躍於非營利組織,辦理活動來支持特殊兒及其家庭。期待用技術改變世界。

如果你認同我或想支持我的努力,歡迎請我喝一杯咖啡!讓我更有動力分享知識!