mirror of
https://github.com/guilhermewerner/erlang-ws
synced 2025-06-16 03:14:19 +00:00
Cowboy WebSocket Example
This commit is contained in:
4
.gitignore
vendored
Normal file
4
.gitignore
vendored
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
_rel
|
||||||
|
.erlang.mk/
|
||||||
|
deps/
|
||||||
|
ebin/
|
10
Makefile
Normal file
10
Makefile
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
PROJECT = erws
|
||||||
|
PROJECT_DESCRIPTION = Erlang WebSocket
|
||||||
|
PROJECT_VERSION = 0.1.0
|
||||||
|
|
||||||
|
DEPS = cowboy
|
||||||
|
dep_cowboy_commit = 2.6.3
|
||||||
|
|
||||||
|
DEP_PLUGINS = cowboy
|
||||||
|
|
||||||
|
include erlang.mk
|
2
config/sys.config
Normal file
2
config/sys.config
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
[
|
||||||
|
].
|
3
config/vm.args
Normal file
3
config/vm.args
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
-name erws@127.0.0.1
|
||||||
|
-setcookie erws
|
||||||
|
-heart
|
4
erws.d
Normal file
4
erws.d
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
# Generated by Erlang.mk. Edit at your own risk!
|
||||||
|
|
||||||
|
|
||||||
|
COMPILE_FIRST +=
|
111
priv/index.html
Normal file
111
priv/index.html
Normal file
@ -0,0 +1,111 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<title>Websocket client</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<h1>Websocket client</h1>
|
||||||
|
<div id="status"></div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<nav>
|
||||||
|
<div id="connecting">
|
||||||
|
<input type='text' id="server" value=""></input>
|
||||||
|
<button type="button" onclick="toggle_connection()">connection</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="connected">
|
||||||
|
<input type='text' id="message" value=""></input>
|
||||||
|
<button type="button" onclick="sendTxt();">send</button>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<main id="content">
|
||||||
|
<button id="clear" onclick="clearScreen()">Clear text</button>
|
||||||
|
<div id="output"></div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<script type="text/javascript">
|
||||||
|
|
||||||
|
var websocket;
|
||||||
|
var server = document.getElementById("server");
|
||||||
|
var message = document.getElementById("message");
|
||||||
|
var connecting = document.getElementById("connecting");
|
||||||
|
var connected = document.getElementById("connected");
|
||||||
|
var content = document.getElementById("content");
|
||||||
|
var output = document.getElementById("output");
|
||||||
|
|
||||||
|
server.value = "ws://" + window.location.host + "/websocket";
|
||||||
|
connected.style.display = "none";
|
||||||
|
content.style.display = "none";
|
||||||
|
|
||||||
|
function connect() {
|
||||||
|
wsHost = server.value;
|
||||||
|
websocket = new WebSocket(wsHost);
|
||||||
|
showScreen('<b>Connecting to: ' + wsHost + '</b>');
|
||||||
|
websocket.onopen = function (evt) { onOpen(evt) };
|
||||||
|
websocket.onclose = function (evt) { onClose(evt) };
|
||||||
|
websocket.onmessage = function (evt) { onMessage(evt) };
|
||||||
|
websocket.onerror = function (evt) { onError(evt) };
|
||||||
|
};
|
||||||
|
|
||||||
|
function disconnect() {
|
||||||
|
websocket.close();
|
||||||
|
};
|
||||||
|
|
||||||
|
function toggle_connection() {
|
||||||
|
if (websocket && websocket.readyState == websocket.OPEN) {
|
||||||
|
disconnect();
|
||||||
|
} else {
|
||||||
|
connect();
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
function sendTxt() {
|
||||||
|
if (websocket.readyState == websocket.OPEN) {
|
||||||
|
var msg = message.value;
|
||||||
|
websocket.send(msg);
|
||||||
|
showScreen('sending: ' + msg);
|
||||||
|
} else {
|
||||||
|
showScreen('websocket is not connected');
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
function onOpen(evt) {
|
||||||
|
showScreen('<span style="color: green;">CONNECTED </span>');
|
||||||
|
connecting.style.display = "none";
|
||||||
|
connected.style.display = "";
|
||||||
|
content.style.display = "";
|
||||||
|
};
|
||||||
|
|
||||||
|
function onClose(evt) {
|
||||||
|
showScreen('<span style="color: red;">DISCONNECTED</span>');
|
||||||
|
};
|
||||||
|
|
||||||
|
function onMessage(evt) {
|
||||||
|
showScreen('<span style="color: blue;">RESPONSE: ' + evt.data + '</span>');
|
||||||
|
};
|
||||||
|
|
||||||
|
function onError(evt) {
|
||||||
|
showScreen('<span style="color: red;">ERROR: ' + evt.data + '</span>');
|
||||||
|
};
|
||||||
|
|
||||||
|
function showScreen(html) {
|
||||||
|
var el = document.createElement("p");
|
||||||
|
el.innerHTML = html;
|
||||||
|
output.insertBefore(el, output.firstChild);
|
||||||
|
};
|
||||||
|
|
||||||
|
function clearScreen() {
|
||||||
|
output.innerHTML = "";
|
||||||
|
};
|
||||||
|
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
4
relx.config
Normal file
4
relx.config
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
{release, {erws_release, "1"}, [erws, sasl, runtime_tools]}.
|
||||||
|
{extended_start_script, true}.
|
||||||
|
{sys_config, "config/sys.config"}.
|
||||||
|
{vm_args, "config/vm.args"}.
|
26
src/erws_app.erl
Normal file
26
src/erws_app.erl
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
%% Feel free to use, reuse and abuse the code in this file.
|
||||||
|
|
||||||
|
%% @private
|
||||||
|
-module(erws_app).
|
||||||
|
-behaviour(application).
|
||||||
|
|
||||||
|
%% API.
|
||||||
|
-export([start/2]).
|
||||||
|
-export([stop/1]).
|
||||||
|
|
||||||
|
%% API.
|
||||||
|
start(_Type, _Args) ->
|
||||||
|
Dispatch = cowboy_router:compile([
|
||||||
|
{'_', [
|
||||||
|
{"/", cowboy_static, {priv_file, erws, "index.html"}},
|
||||||
|
{"/websocket", ws_h, []},
|
||||||
|
{"/static/[...]", cowboy_static, {priv_dir, erws, "static"}}
|
||||||
|
]}
|
||||||
|
]),
|
||||||
|
{ok, _} = cowboy:start_clear(http, [{port, 8080}], #{
|
||||||
|
env => #{dispatch => Dispatch}
|
||||||
|
}),
|
||||||
|
erws_sup:start_link().
|
||||||
|
|
||||||
|
stop(_State) ->
|
||||||
|
ok = cowboy:stop_listener(http).
|
23
src/erws_sup.erl
Normal file
23
src/erws_sup.erl
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
%% Feel free to use, reuse and abuse the code in this file.
|
||||||
|
|
||||||
|
%% @private
|
||||||
|
-module(erws_sup).
|
||||||
|
-behaviour(supervisor).
|
||||||
|
|
||||||
|
%% API.
|
||||||
|
-export([start_link/0]).
|
||||||
|
|
||||||
|
%% supervisor.
|
||||||
|
-export([init/1]).
|
||||||
|
|
||||||
|
%% API.
|
||||||
|
|
||||||
|
-spec start_link() -> {ok, pid()}.
|
||||||
|
start_link() ->
|
||||||
|
supervisor:start_link({local, ?MODULE}, ?MODULE, []).
|
||||||
|
|
||||||
|
%% supervisor.
|
||||||
|
|
||||||
|
init([]) ->
|
||||||
|
Procs = [],
|
||||||
|
{ok, {{one_for_one, 10, 10}, Procs}}.
|
24
src/ws_h.erl
Normal file
24
src/ws_h.erl
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
-module(ws_h).
|
||||||
|
|
||||||
|
-export([init/2]).
|
||||||
|
-export([websocket_init/1]).
|
||||||
|
-export([websocket_handle/2]).
|
||||||
|
-export([websocket_info/2]).
|
||||||
|
|
||||||
|
init(Req, Opts) ->
|
||||||
|
{cowboy_websocket, Req, Opts}.
|
||||||
|
|
||||||
|
websocket_init(State) ->
|
||||||
|
erlang:start_timer(1000, self(), <<"Hello!">>),
|
||||||
|
{[], State}.
|
||||||
|
|
||||||
|
websocket_handle({text, Msg}, State) ->
|
||||||
|
{[{text, <<"That's what she said! ", Msg/binary>>}], State};
|
||||||
|
websocket_handle(_Data, State) ->
|
||||||
|
{[], State}.
|
||||||
|
|
||||||
|
websocket_info({timeout, _Ref, Msg}, State) ->
|
||||||
|
erlang:start_timer(1000, self(), <<"How' you doin'?">>),
|
||||||
|
{[{text, Msg}], State};
|
||||||
|
websocket_info(_Info, State) ->
|
||||||
|
{[], State}.
|
Reference in New Issue
Block a user