{"id":18317904,"url":"https://github.com/idiocc/websocket","last_synced_at":"2025-04-09T13:51:19.924Z","repository":{"id":57117942,"uuid":"168207720","full_name":"idiocc/websocket","owner":"idiocc","description":"Establishes WebSocket Connetion Between Client And Server.","archived":false,"fork":false,"pushed_at":"2020-02-28T21:10:07.000Z","size":61,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-03-16T12:48:13.685Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://idio.cc","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/idiocc.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-01-29T18:39:50.000Z","updated_at":"2020-02-28T21:10:09.000Z","dependencies_parsed_at":"2022-08-23T05:21:00.440Z","dependency_job_id":null,"html_url":"https://github.com/idiocc/websocket","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/idiocc%2Fwebsocket","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/idiocc%2Fwebsocket/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/idiocc%2Fwebsocket/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/idiocc%2Fwebsocket/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/idiocc","download_url":"https://codeload.github.com/idiocc/websocket/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248054218,"owners_count":21039951,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-05T18:07:49.640Z","updated_at":"2025-04-09T13:51:19.895Z","avatar_url":"https://github.com/idiocc.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# @idio/websocket\n\n[![npm version](https://badge.fury.io/js/%40idio%2Fwebsocket.svg)](https://www.npmjs.com/package/@idio/websocket)\n\n`@idio/websocket` Establishes _WebSocket_ Connections Between Clients And The Server.\n\n```sh\nyarn add @idio/websocket\nnpm i @idio/websocket\n```\n\n## Table Of Contents\n\n- [Table Of Contents](#table-of-contents)\n- [API](#api)\n- [`websocket(server, config=): !Object\u003cstring, sendMessage\u003e`](#websocketserver-httpserverconfig-websocketconfig-objectstring-sendmessage)\n  * [`WebSocketConfig`](#type-websocketconfig)\n- [`sendMessage(event, message): void`](#sendmessageevent-stringmessage--void)\n- [Copyright](#copyright)\n\n\u003cp align=\"center\"\u003e\u003ca href=\"#table-of-contents\"\u003e\n  \u003cimg src=\"/.documentary/section-breaks/0.svg?sanitize=true\"\u003e\n\u003c/a\u003e\u003c/p\u003e\n\n## API\n\nThe package is available by importing its default function:\n\n```js\nimport websocket from '@idio/websocket'\n```\n\n\u003cp align=\"center\"\u003e\u003ca href=\"#table-of-contents\"\u003e\n  \u003cimg src=\"/.documentary/section-breaks/1.svg?sanitize=true\"\u003e\n\u003c/a\u003e\u003c/p\u003e\n\n## \u003ccode\u003e\u003cins\u003ewebsocket\u003c/ins\u003e(\u003c/code\u003e\u003csub\u003e\u003cbr/\u003e\u0026nbsp;\u0026nbsp;`server: !http.Server,`\u003cbr/\u003e\u0026nbsp;\u0026nbsp;`config=: !WebSocketConfig,`\u003cbr/\u003e\u003c/sub\u003e\u003ccode\u003e): \u003ci\u003e!Object\u003cstring, sendMessage\u003e\u003c/i\u003e\u003c/code\u003e\nSets up a listener for the `UPGRADE` event on the server, and stores all connected clients in the client list. When clients disconnect, they are removed from this list. The list is a hash object where each key is the _accept key_ sent by the client, and values are the callback functions to send messages to those clients.\n\n - \u003ckbd\u003e\u003cstrong\u003eserver*\u003c/strong\u003e\u003c/kbd\u003e \u003cem\u003e\u003ccode\u003e\u003ca href=\"https://nodejs.org/api/http.html#http_class_http_server\" title=\"An HTTP server that extends net.Server to handle network requests.\"\u003e\u003cimg src=\".documentary/type-icons/node.png\" alt=\"Node.JS Docs\"\u003e!http.Server\u003c/a\u003e\u003c/code\u003e\u003c/em\u003e: The server on which to setup the listener.\n - \u003ckbd\u003econfig\u003c/kbd\u003e \u003cem\u003e\u003ccode\u003e\u003ca href=\"#type-websocketconfig\" title=\"Options for the web socket protocol communication.\"\u003e!WebSocketConfig\u003c/a\u003e\u003c/code\u003e\u003c/em\u003e (optional): Additional configuration.\n\n__\u003ca name=\"type-websocketconfig\"\u003e`WebSocketConfig`\u003c/a\u003e__: Options for the web socket protocol communication.\n\n\n|   Name    |                         Type                         |                      Description                       | Default |\n| --------- | ---------------------------------------------------- | ------------------------------------------------------ | ------- |\n| log       | \u003cem\u003eboolean\u003c/em\u003e                                     | Whether to log on connect and disconnect.              | `true`  |\n| onMessage | \u003cem\u003e(clientID: string, message: string) =\u003e void\u003c/em\u003e | The callback when a message is received from a client. | -       |\n| onConnect | \u003cem\u003e(clientID: string) =\u003e void\u003c/em\u003e                  | The callback when a client is connected.               | -       |\n\n_With the following client-side implementation:_\n\n```js\n/* eslint-env browser */\nconst ws = new WebSocket(`ws://${location.host}`, 'json')\nsetInterval(() =\u003e {\n  if (ws.readyState == ws.OPEN) ws.send('')\n}, 2000)\n\nws.addEventListener('message', async event =\u003e {\n  const { message, event: e } = JSON.parse(event.data)\n  console.log('Received %s:', e, message)\n  window.WSstatus.innerText = message\n  ws.send(navigator.userAgent)\n})\n```\n\n_the server can be setup to listen for connections._\n\n```jsx\n/* yarn example/ */\nimport core, { render } from '@idio/idio'\nimport websocket from '@idio/websocket'\n\n(async () =\u003e {\n  const { url, server } = await core({\n    static: {\n      use: true,\n      root: 'example/frontend',\n    },\n    index(ctx) {\n      ctx.body = render(\n        \u003chtml\u003e\n          \u003chead\u003e\n            \u003ctitle\u003eWebsocket Example\u003c/title\u003e\n          \u003c/head\u003e\n          \u003cbody\u003e\n            \u003ch1\u003e\n              Hello World.\n            \u003c/h1\u003e\n            Server says: \u003cspan id=\"WSstatus\" /\u003e\n            \u003cscript type=\"module\" src=\"index.js\"/\u003e\n          \u003c/body\u003e\n        \u003c/html\u003e\n        , { addDoctype: true })\n    },\n  })\n  const clients = websocket(server, {\n    onConnect(clientId) {\n      clients[clientId]('handshake', 'welcome')\n    },\n    onMessage(clientId, message) {\n      console.log('Client %s says: %s', clientId, message)\n    },\n  })\n  console.log(url)\n})()\n```\n\n```fs\nhttp://localhost:5000\nClient connected.\nClient FIM/Jvt9Ldb1J0HCx5ye8g== says:\n  Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_0)\n  AppleWebKit/537.36 (KHTML, like Gecko)\n  Chrome/71.0.3578.98 Safari/537.36\nClient disconnected.\n```\n\n## \u003ccode\u003e\u003cins\u003esendMessage\u003c/ins\u003e(\u003c/code\u003e\u003csub\u003e\u003cbr/\u003e\u0026nbsp;\u0026nbsp;`event: string,`\u003cbr/\u003e\u0026nbsp;\u0026nbsp;`message: *,`\u003cbr/\u003e\u003c/sub\u003e\u003ccode\u003e): \u003ci\u003evoid\u003c/i\u003e\u003c/code\u003e\n - \u003ckbd\u003e\u003cstrong\u003eevent*\u003c/strong\u003e\u003c/kbd\u003e \u003cem\u003e`string`\u003c/em\u003e: The name of the event to send.\n - \u003ckbd\u003e\u003cstrong\u003emessage*\u003c/strong\u003e\u003c/kbd\u003e \u003cem\u003e`*`\u003c/em\u003e: The data, that will be serialised in _JSON_.\n\n\u003cp align=\"center\"\u003e\u003ca href=\"#table-of-contents\"\u003e\n  \u003cimg src=\"/.documentary/section-breaks/2.svg?sanitize=true\"\u003e\n\u003c/a\u003e\u003c/p\u003e\n\n## Copyright\n\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003cth\u003e\n      \u003ca href=\"https://www.artd.eco\"\u003e\n        \u003cimg width=\"100\" src=\"https://raw.githubusercontent.com/wrote/wrote/master/images/artdeco.png\"\n          alt=\"Art Deco\"\u003e\n      \u003c/a\u003e\n    \u003c/th\u003e\n    \u003cth\u003e© \u003ca href=\"https://www.artd.eco\"\u003eArt Deco™\u003c/a\u003e for \u003ca href=\"https://idio.cc\"\u003eIdio\u003c/a\u003e 2020\u003c/th\u003e\n    \u003cth\u003e\n      \u003ca href=\"https://idio.cc\"\u003e\n        \u003cimg src=\"https://avatars3.githubusercontent.com/u/40834161?s=100\" width=\"100\" alt=\"Idio\"\u003e\n      \u003c/a\u003e\n    \u003c/th\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\nWebSocket Node.JS implementation by **Srushtika Neelakantam** from [Implementing a WebSocket server with Node.js](https://hackernoon.com/implementing-a-websocket-server-with-node-js-d9b78ec5ffa8)\n\n\u003cp align=\"center\"\u003e\u003ca href=\"#table-of-contents\"\u003e\n  \u003cimg src=\"/.documentary/section-breaks/-1.svg?sanitize=true\"\u003e\n\u003c/a\u003e\u003c/p\u003e","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fidiocc%2Fwebsocket","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fidiocc%2Fwebsocket","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fidiocc%2Fwebsocket/lists"}