WebSocket example & link to MDN API reference (#19558)
Added a simple example to the WebSocket info for a frontend and backend, and a link to the Mozilla API for further learnings
This commit is contained in:
@ -21,3 +21,34 @@ WebSockets do not need repeated calls to respond. It is enough to make one reque
|
||||
## When not to use WebSockets?
|
||||
|
||||
WebSockets are already supported in 95% of browsers, but sometimes this technology is not required. For example, if you are creating a simple CMS where real-time functionality is not required.
|
||||
|
||||
## WebSocket Example
|
||||
> Frontend (No need for an import, WebSockets are supported by [every major browser])
|
||||
```javascript
|
||||
const ws = new WebSocket('ws://localhost:3000');
|
||||
|
||||
ws.onmessage = function(e){
|
||||
console.log('Message received from WebSocket');
|
||||
const parsedData = JSON.parse(e.data);
|
||||
handleData(parsedData);
|
||||
};
|
||||
|
||||
ws.onopen = function(){
|
||||
console.log('Websocket open');
|
||||
}
|
||||
```
|
||||
|
||||
> Backend (uses [ws](https://github.com/websockets/ws) and [express](https://expressjs.com/), the most common WebSocket client web framework for NodeJS)
|
||||
```javascript
|
||||
const SocketServer = require('ws').Server;
|
||||
const router = require('express').Router();
|
||||
|
||||
const server = express()
|
||||
.use('/', router)
|
||||
.listen(3000, () => console.log('Listening on 3000'));
|
||||
|
||||
const wss = new SocketServer({ server });
|
||||
```
|
||||
|
||||
## Learn more
|
||||
[Official Mozilla API](https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API)
|
||||
|
Reference in New Issue
Block a user