Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
Site.js
site
Commits
360f4c71
Verified
Commit
360f4c71
authored
Jul 26, 2019
by
Aral Balkan
Browse files
Tighten up the WebSocket example
parent
4c6a3e2a
Changes
1
Hide whitespace changes
Inline
Side-by-side
index.html
View file @
360f4c71
...
...
@@ -132,24 +132,21 @@ module<span class="token punctuation">.</span><span class="token function-variab
<p>
For example, to create
<a
href=
'https://source.ind.ie/site.js/app/tree/master/examples/wss-basic-chat'
>
a very basic chat app
</a>
:
</p>
<pre><code>
mkdir
<span
class=
"token keyword"
>
-p
</span>
<span
class=
"token string"
>
basic-chat
</span>
/.dynamic/.wss
</code>
<code>
touch basic-chat/.dynamic/.wss/
<span
class=
"token string"
>
chat.js
</span></code>
<code><span
class=
"token comment"
>
# Add the code below to chat.js.
</span></code>
<code>
site
<span
class=
"token string"
>
basic-chat
</span></code></pre>
<p>
The code for
<em>
chat.js
</em>
:
</p>
<pre><code
class=
'language-js'
>
module
<span
class=
"token punctuation"
>
.
</span><span
class=
"token function-variable function"
>
exports
</span>
<span
class=
"token operator"
>
=
</span>
<span
class=
"token keyword"
>
function
</span>
<span
class=
"token punctuation"
>
(
</span><span
class=
"token parameter"
>
webSocket
<span
class=
"token punctuation"
>
,
</span>
request
</span><span
class=
"token punctuation"
>
)
</span>
<span
class=
"token punctuation"
>
{
</span>
<code>
cat
<
<
<
span
class=
"token keyword"
>
EOF
</span>
> basic-chat/.dynamic/.wss/
<span
class=
"token string"
>
chat.js
</span></code>
<code
class=
'language-js'
>
module
<span
class=
"token punctuation"
>
.
</span><span
class=
"token function-variable function"
>
exports
</span>
<span
class=
"token operator"
>
=
</span>
<span
class=
"token keyword"
>
function
</span>
<span
class=
"token punctuation"
>
(
</span><span
class=
"token parameter"
>
webSocket
<span
class=
"token punctuation"
>
,
</span>
request
</span><span
class=
"token punctuation"
>
)
</span>
<span
class=
"token punctuation"
>
{
</span>
webSocket
<span
class=
"token punctuation"
>
.
</span><span
class=
"token function"
>
on
</span><span
class=
"token punctuation"
>
(
</span><span
class=
"token string"
>
'message'
</span><span
class=
"token punctuation"
>
,
</span>
<span
class=
"token parameter"
>
message
</span>
<span
class=
"token operator"
>
=
>
</span>
<span
class=
"token punctuation"
>
{
</span>
<span
class=
"token keyword"
>
this
</span><span
class=
"token punctuation"
>
.
</span><span
class=
"token function"
>
getWss
</span><span
class=
"token punctuation"
>
(
</span><span
class=
"token string"
>
'/chat'
</span><span
class=
"token punctuation"
>
)
</span><span
class=
"token punctuation"
>
.
</span>
clients
<span
class=
"token punctuation"
>
.
</span><span
class=
"token function"
>
forEach
</span><span
class=
"token punctuation"
>
(
</span><span
class=
"token parameter"
>
client
</span>
<span
class=
"token operator"
>
=
>
</span>
<span
class=
"token punctuation"
>
{
</span>
client
<span
class=
"token punctuation"
>
.
</span><span
class=
"token function"
>
send
</span><span
class=
"token punctuation"
>
(
</span>
message
<span
class=
"token punctuation"
>
)
</span>
<span
class=
"token punctuation"
>
}
</span><span
class=
"token punctuation"
>
)
</span>
<span
class=
"token punctuation"
>
}
</span><span
class=
"token punctuation"
>
)
</span>
<span
class=
"token punctuation"
>
}
</span></code></pre>
<span
class=
"token punctuation"
>
}
</span>
<span
class=
"token keyword"
>
EOF
</span></code>
<code>
site
<span
class=
"token string"
>
basic-chat
</span></code></pre>
<p>
To test it, open up two web browser windows and enter the following into the web developer (JavaScript) console both of them:
</p>
<pre><code
class=
'language-js'
><span
class=
"token keyword"
>
const
</span>
webSocket
<span
class=
"token operator"
>
=
</span>
<span
class=
"token keyword"
>
new
</span>
<span
class=
"token class-name"
>
WebSocket
</span><span
class=
"token punctuation"
>
(
</span><span
class=
"token string"
>
'
http
s://localhost/chat'
</span><span
class=
"token punctuation"
>
)
</span>
webSocket
<span
class=
"token punctuation"
>
.
</span><span
class=
"token function-variable function"
>
onmessage
</span>
<span
class=
"token operator"
>
=
</span>
<span
class=
"token parameter"
>
message
</span>
<span
class=
"token operator"
>
=
>
</span>
console
<span
class=
"token punctuation"
>
.
</span><span
class=
"token function"
>
log
</span><span
class=
"token punctuation"
>
(
</span>
message
<span
class=
"token punctuation"
>
)
</span>
<pre><code
class=
'language-js'
><span
class=
"token keyword"
>
const
</span>
webSocket
<span
class=
"token operator"
>
=
</span>
<span
class=
"token keyword"
>
new
</span>
<span
class=
"token class-name"
>
WebSocket
</span><span
class=
"token punctuation"
>
(
</span><span
class=
"token string"
>
'
ws
s://localhost/chat'
</span><span
class=
"token punctuation"
>
)
</span>
webSocket
<span
class=
"token punctuation"
>
.
</span><span
class=
"token function-variable function"
>
onmessage
</span>
<span
class=
"token operator"
>
=
</span>
console
<span
class=
"token punctuation"
>
.
</span><span
class=
"token function"
>
log
</span>
webSocket
<span
class=
"token punctuation"
>
.
</span><span
class=
"token function"
>
send
</span><span
class=
"token punctuation"
>
(
</span><span
class=
"token string"
>
'hello'
</span><span
class=
"token punctuation"
>
)
</span></code></pre>
<p>
To test
<a
href=
'https://source.ind.ie/site.js/app/tree/master/examples/wss-basic-chat'
>
this example
</a>
with a web interface, do the following and then visit
<a
href=
'https://localhost'
>
https://localhost
</a></p>
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment