1. 程式人生 > >vue和node進行通訊(使用socket.io)

vue和node進行通訊(使用socket.io)

socket.io現在越來越頻繁的應用於通訊中,於是,我也摸索了一點。
接下來是我的一點小小見解。
這是vue-cli搭建的前端框架
前端Vue main.js

import VueSocketio from 'vue-socket.io';
import socketio from 'socket.io-client';
Vue.use(VueSocketio, socketio('http://xxx.xxx,xx,xxx:xxxx'));//與服務端連結

vue元件

this.$socket.emit('start');//觸發start
sockets:{//不能改
      connect:function
() {
//與socket.io連線後回撥 console.log('socket connected'); }, login:function(value) { console.log(value);//監聽login(後端向前端emit login的回撥) } },

node後端 建立socket.js
若不理解,可以先看看node教程

var http = require('http');
var fs = require('fs');
var server = http.createServer(function
(req,res){ // fs.readFile('./index.html',function(error,data){//若根目錄有index.html,訪問地址,將顯示index.html // res.writeHead(200,{'Content-Type':'text/html'}); // res.end(data,'utf-8'); // }); }).listen(3000,"192.168.xx.xxx");//建立http服務 console.log('Server running at http://192.168.xx.xxx:3000/'); var io = require
('socket.io').listen(server); io.sockets.on('connection', (socket) => { var timer = ''; console.log('連結成功'); socket.on('start', () => {//監聽前端傳送的start timer = setInterval(function () {//定時器每五秒發一次 socket.emit('login', {//觸發emit,前端接收 "Action": "DataRecv", "Data": { "Reporting_mode": {"T":"I","V":5}, } }); },5000) }); });

啟動socket ,在瀏覽器中輸入上面的地址192.168.xx.xxx:3000
node 控制檯會打印出連結成功
前端啟動emit start,控制檯每五秒會收到{
“Action”: “DataRecv”,
“Data”: {
“Reporting_mode”: {“T”:”I”,”V”:5},
}

相關推薦

vuenode進行通訊使用socket.io

socket.io現在越來越頻繁的應用於通訊中,於是,我也摸索了一點。 接下來是我的一點小小見解。 這是vue-cli搭建的前端框架 前端Vue main.js import VueSocketio from 'vue-socket.io'; impo

Android藍芽開發與藍芽模組進行通訊基於eclipse

public class ComminuteActivity extends Activity { private BluetoothReceiver receiver; private BluetoothAdapter bluetoothAdapter; private Lis

C#TCP與UDP通訊流程、TcplistenerTcpclient進行通訊、UdpClient進行通訊

1.基於Tcp協議的Socket通訊類似於B/S架構,面向連線,不同的是伺服器端可以向客戶端主動的推送訊息 流程順序。可靠性高 (1)建立一個套接字(Socket) (2)繫結伺服器端IP地址及埠號-伺服器端 (3)利用Listen()方法開啟監聽-伺服器端 (4)利用Accep

linux網路程式設計之用socket實現簡單客戶端服務端的通訊基於TCP

一、介紹基於TCP協議通過socket實現網路程式設計常用API 1、讀者如果不是很熟悉,可以先看我之前寫的幾篇部落格,有socket,地址結構的理解,更加方便讀者理解 地址分別是: 2、socket(TCP)程式設計API簡介 1)、socket int s

linux網路程式設計之用socket實現簡單客戶端服務端的通訊基於UDP

1、sendto和recvfrom函式介紹 sendto(經socket傳送資料) 相關函式 send , sendmsg,recv , recvfrom , socket 表頭檔案 #include < sys/types.h >#includ

Nodejs實時通訊 線上聊天室Socket.io)_收藏

前言 網路聊天室在web1.0的時代就出現了,但當時技術支援比較有限,大都是通過瀏覽器外掛BHO,JavaApplet,Flash實現的。如今HTML5技術風起雲湧,通過websocket實現的網路聊天室,被定義為websocket的第一個實驗,就像Hello World

IO練習 兩個文件夾進行copy含子目錄

nts pan tor 拷貝 style copy str1 子目錄 red 1 //從鍵盤接收兩個文件夾路徑,把其中一個文件夾中(包含內容)拷貝到另一個文件夾中 2 @Test 3 public void t6(){ 4 //1)

用別人的錢時間進行學習可以學到很多東西,創業成功多了把握,而且緩解財務壓力,善於利用已有資源,別著急,只要不斷工作、不斷學習然後保持耐心即可

strong 以及 禮品 body tor 是我 雜誌 研究 財務 我還是個小孩的時候,曾經在堂兄的禮品店幹過。   那些漫長炎熱的夏天實在是太無聊了,所以我甚至都沒開口讓他給我工錢。   不過有一天我突然想到了一個好點子。我可以跑到山裏面,到當地果園摘一些無花果,

1025_(即時通訊)使用 Socket.IO 開發聊天室

使用 Socket.IO 開發聊天室 前言 Socket.IO 是一個用來實現實時雙向通訊的框架,其本質是基於 WebSocket 技術。 我們首先來聊聊 WebSocket 技術,先設想這麼一個場景: · 使用者小A,打開了某個網站的充值介面,該介面上有一個付款的二維碼。 ·

android中通過usbpc進行通訊

找到的最好的部落格 https://blog.csdn.net/jakemiao/article/details/17270785?locationNum=7&fps=1 下面是demo: https://github.com/yunzheyue/usbCommunication

JAVA——點對面通訊Socket基於TCP/IP協議

點對面通訊(Socket基於TCP/IP協議) 1.要求 大多情況下,網路通訊經常需要多個客戶機同一個伺服器進行通訊,如FTP伺服器是同時接收多個客戶訪問的伺服器。本例介紹點對面通訊,即一個伺服器監聽多個客戶端的請求的通訊。 2.原理 建立多客戶連線的Soc

Untiy中用C#實現TCP通訊Socket通訊服務端與客戶端皆可

簡而言之,TCP通訊原理大家可以從各種網路文獻上找到,這裡不做贅述。 只提出C#實現TCP通訊的一般方法和常用程式碼工具供第一次接觸TCP通訊的玩家參考,老玩家繞道。。。 為了方便大家理解我的程式碼,會適當提及通訊遠離。 1、建立服務端,TCP連線的基本: using U

TCPUDP的區別Socket

轉自:https://www.cnblogs.com/LUO77/p/5801977.html TCP和UDP區別 TCP和UDP程式設計區別 TCP程式設計的伺服器端一般步驟是:    1、建立一個socket,用函式socket();&nb

活動服務進行通訊

        我們學習了啟動和停止服務的方法,雖然服務是在活動裡啟動的,但在啟動了服務之後,活動與服務基本上就沒有什麼關係了。確實如此,我們在活動裡呼叫了StartCommand()方法來啟動MyService這個服務,然後MyService的onCreat

Qt:Qt實現Winsock網路程式設計—TCP服務端客戶端通訊多執行緒

Qt實現Winsock網路程式設計—TCP服務端和客戶端通訊(多執行緒) 前言 感覺Winsock網路程式設計的api其實和Linux下網路程式設計的api非常像,其實和其他程式語言的網路程式設計都差不太多。博主用Qt實現的,當然不想用黑視窗唄,有介面可以看到,由於GUI程式設計

說說在 Vue.js 中如何實現元件間通訊高階篇

之前說過,可以使用 props 將資料從父元件傳遞給子元件。其實還有其它種的通訊方式,下面我們一一娓娓道來。 1 自定義事件 通過自定義事件,我們可以把資料從子元件傳輸回父元件。子元件通過 $emit() 來觸發事件,而父元件通過 $on() 來監聽事件,這是典型的觀察者模式。 htm

Socket通訊持續更新...

Socket 通訊 1.提及通訊我們首先要了解的是程序間的通訊方式(IPC),可分為四類: a.訊息傳遞(管道、FIFO、訊息列隊) b.同步(訊號量、互斥量、條件變數) c.共享記憶體(shar memory) d.遠端呼叫 2.下面是關於So

IO通訊模型同步阻塞模式BIOBlocking IO

幾個概念 阻塞IO 和非阻塞IO 這兩個概念是程式級別的。主要描述的是程式請求作業系統IO操作後,如果IO資源沒有準備好,那麼程式該如何處理的問題:前者等待;後者繼續執行(但是使用執行緒一直輪詢,直到有IO資源準備好了)。 同步IO 和 非同步IO,這兩個概念是作業系統級別的。主要描述的是作業系統在收到程式

IO通訊模型同步非阻塞模式NIONonBlocking IO

同步非阻塞模式(NonBlocking IO) 在非阻塞模式中,發出Socket的accept()和read()操作時,如果核心中的資料還沒有準備好,那麼它並不會阻塞使用者程序,而是立刻返回一個資訊。也就是說程序發起一個read操作後,並不需要一直阻塞等待,而是馬上就得到了一個結果。 如果結果發現數據準備

5、無線傳輸衛星通訊物理層

1、無線傳輸 引言 在某些情況下,無線具有的優勢甚至超過了固定裝置的優勢。例如,由於地形等陸地因素等原因造成把光纖拉到一座建築物非常困難時,無線或許是更好的選擇。現代無線數字通訊始於夏威夷群島。 1.電磁頻譜 當電子運動時會產生電磁波,電磁波可在空中傳播。英國物理學家馬克