node에서 Socket.IO 모듈을 사용하는 방법은 무엇입니까? 다음 글에서는 node.js에서 Socket.IO 모듈을 우아하게 사용하는 방법을 소개하겠습니다. 도움이 되길 바랍니다!
Socket.IO는 클라이언트 측 js
및 서버 측을 포함하는 <code>WebSocket 라이브러리
입니다. node .js는 다양한 브라우저와 모바일 장치에서 사용할 수 있는 실시간 애플리케이션을 구축하는 것을 목표로 합니다. [관련 튜토리얼 권장 사항: WebSocket库
,包括了客户端的js
和服务器端的node.js
,它的目标是构建可以在不同浏览器和移动设备上使用的实时应用。【相关教程推荐:nodejs视频教程】
Socket.IO将WebSocket、AJAX和其它的通信方式
全部封装成了统一的通信接口
,也就是说,我们在使用SocketIO时,不用担心兼容问题,底层会自动选用最佳的通信方式
。
socket.io封装了服务端和客户端,使用起来非常简单方便。
socket.io支持跨平台,这就意味着你有了更多的选择,可以在自己喜欢的平台下开发实时应用。
socket.io可以自定义事件发送到对端,对端可以是服务器,可以是客户端;使用emit发送,接收还是on
。
它会自动根据浏览器从WebSocket、AJAX长轮询、Iframe流等等各种方式中选择最佳的方式来实现网络实时应用,非常方便和人性化,而且支持的浏览器最低达IE5.5。如果不支持websocket,可以自动降级为轮询
打开终端,在终端中输入以下代码即可安装Socket.IO模块:
npm i socket.io
emit
和 on
是最重要的两个api,分别对应 发送
和 监听
事件.
我们可以非常自由的在服务端
定义并发送一个事件emit
,然后在客户端
监听 on
,反过来也一样。
发送的内容格式
也非常自由,既可以是基本数据类型 Number,String,Boolean 等,也可以是 Object,Array 类型,甚至还可以是函数
。而用回调函数的方式则可以进行更便携的交互。
socket.emit(eventName[, ...args])
:发射(触发)一个事件
socket.emit('aaa','你好,前台')
在这里以
服务端
为例子:在服务端中通过socket.emit()
方法创立一个事件(第一个参数:自定义事件
)aaa
,发送的信息(第二个参数
)你好,前台
.
注意: 第二个参数可以传
对象
,因为在emit方法内部
带有JSON.stringfy()
方法,自动将对象转化为字符串。
socket.on(eventName, callback)
:监听一个 emit 发射的事件
socket.on('aaa',(msg)=>{ console.log(msg) })
在这里以
客户端
为例,客户端监听服务端的事件aaa
,随后通过回调函数的方式打印出aaa
传过来的信息。
const server = require('http').createServer(app); const io = require('socket.io')(server); io.on('connection', socket => { console.log('恭喜你连接成功!') socket.on("message",(msg)=>{ console.log(msg) //你好 后台 //注意 : 这里的 io.emit() 是默认转发给全部客户端信息,所有客户端都可以收到 io.emit("allMsg","广播 : 欢迎来到聊天室") }) }); server.listen(3000);
将
server
当作参数传入,目的在于说明io
挂载的服务依旧是基于http
的。
这里的代码表示,只要连接成功,就会打印连接成功的信息!
<script src="/socket.io/socket.io.js"></script> <script> const socket = io(); //默认连接服务端启动的本地端口地址 socket.emit("message","你好 后台") // 监听服务端的广播事件,接收广播的消息 socket.on("allMsg",(msg)=>{ console.log(msg) //广播 : 欢迎来到聊天室 }) </script>
在客户端需要单独引用
]🎜🎜Socket.IO는socket.io.js
文件,因为socket.io不是浏览器内置模块,需要单独引用,js文件内部代码 ==> socket.io.js内部代码,将这里的代码复制到自己创建的js文件中,然后在客户端中引用。
只要在客户端中出现const socket = io()
nodejs 비디오 튜토리얼WebSocket, AJAX 및 기타 통신 방법
을통합 통신 인터페이스
로 캡슐화합니다. SocketIO를 사용하면호환성 문제에 대해 걱정할 필요가 없으며 하위 계층이 자동으로 최상의 통신 방법을 선택합니다
. 🎜
🎜🎜🎜Socket.IO의 장점🎜🎜🎜🎜🎜Install Socket.IO in node🎜🎜🎜Open으로 다운그레이드될 수 있습니다. 터미널에 다음 코드를 입력하여 Socket.IO 모듈을 설치하세요:🎜rrreee
- 🎜socket.io는 서버와 클라이언트는 사용이 매우 간단하고 편리합니다. 🎜
- 🎜socket.io는 크로스 플랫폼을 지원하므로 선호하는 플랫폼에서 실시간 애플리케이션을 개발할 수 있는 더 많은 선택권이 있습니다. 🎜
- 🎜socket.io는 서버나 클라이언트가 될 수 있는 피어로 보낼 이벤트를 사용자 정의할 수 있습니다.
보내기, 받기 또는 켜기
🎜- 🎜WebSocket, AJAX 롱 폴링, Iframe 스트리밍 등의 브라우저를 기반으로 실시간 네트워크 애플리케이션을 구현하는 가장 좋은 방법을 자동으로 선택합니다. 매우 편리하고 사용자 친화적이며 지원합니다. 필요한 최소 브라우저는 IE5.5입니다. websocket이 지원되지 않는 경우 자동으로
Polling
🎜
🎜🎜🎜Use Socket.IO in node🎜🎜🎜emit code> 및 on
은 각각sending
및listening
이벤트에 해당하는 두 가지 가장 중요한 API입니다. 🎜🎜우리는 서버이벤트 내보내기
를 정의하고 보낸 다음클라이언트
에서on
을 수신하고 그 반대의 경우도 마찬가지입니다. 🎜🎜전송되는콘텐츠 형식
도 매우 무료입니다.는 숫자, 문자열, 부울 등과 같은 기본 데이터 유형일 수도 있고 객체, 배열 유형 또는 함수일 수도 있습니다.
. 콜백 함수를 사용하면 더 이식 가능한 상호 작용이 가능해집니다. 🎜🎜🎜🎜방출🎜🎜🎜socket.emit(eventName[, ...args]):<code>이벤트 방출(트리거)
🎜rrreee🎜여기에서server
를 예로 들어 보겠습니다. 서버에서socket.emit( )
메소드는 이벤트(첫 번째 매개변수: 맞춤 이벤트
)aaa
를 생성하고 정보를 보냅니다(두 번째 매개변수
)안녕하세요, 프론트 데스크
.🎜🎜🎜참고: 🎜 두 번째 매개변수는🎜🎜🎜on🎜🎜🎜emit 메소드
내부에 있기 때문에객체
로 전달될 수 있습니다.JSON.stringfy()
메서드를 사용하면 자동으로 객체를 문자열로 변환합니다. 🎜socket.on(eventName, 콜백) 스팬> 코드>: <code>방출에 의해 발생된 이벤트 수신
🎜rrreee🎜여기에서는클라이언트
를 예로 들어 클라이언트가서버의 이벤트를 수신합니다. >aaa
를 입력하고 콜백 함수를 통해aaa
가 전달한 정보를 출력합니다. 🎜
🎜🎜🎜express에 도입되어 사용됨🎜🎜🎜🎜Server🎜
rrreee🎜io
에 의해 마운트된 서비스가 아직임을 보여주기 위해server
를 매개변수로 전달합니다.http
를 기반으로 합니다.
여기 코드는 연결이 성공하면 연결 성공 메시지가 인쇄된다는 것을 나타냅니다! 🎜
🎜🎜Client🎜
rrreee🎜socket.io.js
를 별도로 참조해야 합니다. client code> 파일, 소켓.io는 브라우저의 내장 모듈이 아니어서 별도로 참조해야 하기 때문에 js 파일의 내부 코드 ==> socket.io.js 내부 코드🎜, 여기 코드를 생성한 js 파일에 복사한 다음 클라이언트에서 참조하세요.
const 소켓 = io()
가 클라이언트에 나타나는 한, 브라우저는 기본적으로 클라이언트가 시작한 로컬 서비스 주소에 직접 연결됩니다. 🎜
요약
socket.io 이 타사 모듈은
ws
模块中通过switch
分支来进行对不同的聊天类型
进行不同的方法呈现,而在socket.io
模块中仅仅通过自定义事件
就可以解决这个问题,并且socket.io可以在服务器断开后,当你再次进入客户端后可以自动连接,整体的表现优于ws
모듈에 코드를 작성할 때 상대적으로 더 편리하고 효율적입니다.노드 관련 지식을 더 보려면 nodejs 튜토리얼을 방문하세요!
위 내용은 노드에서 Socket.IO 모듈을 우아하게 사용하는 방법에 대한 간략한 분석의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!