vue中使用socket連線後台

2022-05-08 08:03:10 字數 1052 閱讀 6500

1、需求背景

工程車巡檢,實時傳送巡檢位置資訊、現場狀況到伺服器,頁面實時顯示工程車位置以及狀況資訊

2、vue中使用socket建立實時連線

3、mounted生命週期中初始化連線

mounted () ,
4、socket連線方法

/*

* * 1.首次進入頁面,如果不是檢視記錄,請求出來初始資料後,建立socket連線

* 2.呼叫資料庫查詢完畢後

* */initwebsocket() ,

websocketonopen()

this

.websocketsend(json.stringify(actions))

},/**

* 連線建立失敗,斷開連線

* 1.查詢一次資料庫資料

* 2.查詢完後再次建立socket連線

* */websocketonerror() ,

websocketonmessage(e) ,

websocketsend(data) ,

websocketclose(e) ,

5、連線狀態

6、資料輸出(在websocketonmessage裡呼叫資料處理方法)

vue中使用axios後post請求注意事項

定義區域性 qs 注意 引入import qs from qs 第三方庫對請求引數進行轉換,否則不通過定義全域性 qs 可使用 import qs from qs 新增請求 axios.interceptors.request.use function config 在傳送請求之前做些什麼 aler...

在socket中使用網域名稱

客戶端中直接使用ip位址會有很大的弊端,一旦ip位址變化 ip位址會經常變動 客戶端軟體就會出現錯誤。而使用網域名稱會方便很多,註冊後的網域名稱只要每年續費就永遠屬於自己的,更換ip位址時修改網域名稱解析即可,不會影響軟體的正常使用。關於網域名稱註冊 網域名稱解析 host 檔案 dns 伺服器等本...

Vue之在vue中使用render

使用components進行渲染得到 建立 vue 例項,得到 viewmodel var vm newvue methods components script body html 使用render 這裡 return 的結果,會 替換頁面中 el 指定的那個 容器 建立 vue 例項,得到 vi...