Skip to content
This repository was archived by the owner on Jun 3, 2021. It is now read-only.

Commit 8e54309

Browse files
IngvordIngvord
committed
Progress: #13 
1 parent 3713b2d commit 8e54309

File tree

2 files changed

+124
-0
lines changed

2 files changed

+124
-0
lines changed

‎docs/samples/javascript/index.html‎

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>SSE</title>
6+
</head>
7+
<body>
8+
<div id="1"></div>
9+
<div id="2"></div>
10+
<div id="3"></div>
11+
<div id="4"></div>
12+
<div id="5"></div>
13+
<div id="6"></div>
14+
<div id="error"></div>
15+
16+
17+
<!-- webix provides convenient ajax API -->
18+
<script type="text/javascript" src="https://cdn.webix.com/5.2/webix_debug.js"></script>
19+
20+
21+
<!-- CORS auth data -->
22+
<script type="application/javascript">
23+
webix.attachEvent("onBeforeAjax", function (mode, url, params, x, headers) {
24+
x.withCredentials = true;
25+
headers["Authorization"] = "Basic " + btoa("tango-cs:tango");
26+
});
27+
</script>
28+
<!-- In this example client creates a subscription and opens an event-stream -->
29+
<script type="application/javascript">
30+
/**
31+
* Tango REST entry point
32+
*
33+
* @type {string}
34+
* @const
35+
*/
36+
const kRestURL = "http://ec2-35-156-104-8.eu-central-1.compute.amazonaws.com:8080/tango/rest/rc4";
37+
38+
/**
39+
* Create a subscription using POST request
40+
*
41+
* @type {Promise}
42+
*/
43+
var subscriptionPromise = webix.ajax().post(kRestURL + "/subscriptions")
44+
/**
45+
* webix returns xhr wrapper that is used to extract JSON data
46+
*/
47+
.then(value => value.json())
48+
/**
49+
* POST request failure handler
50+
*/
51+
.fail(() => {
52+
document.getElementById("error").innerHTML = "Server does not respond";
53+
});
54+
/**
55+
* PUT a Tango event into newly created subscription
56+
*/
57+
subscriptionPromise.then(subscription => {
58+
/**
59+
* define request content type
60+
*/
61+
return webix.ajax().headers({
62+
"Content-Type": "application/json"
63+
})
64+
/**
65+
* subscribe to tango://ip-172-31-30-179:10000/sys/tg_test/1/double_scalar/change event
66+
*/
67+
.put(kRestURL + "/subscriptions/" + subscription.id, JSON.stringify([
68+
{
69+
host: "ip-172-31-30-179:10000",
70+
device: "sys/tg_test/1",
71+
attribute: "double_scalar",
72+
type: "change"
73+
}
74+
]))
75+
/**
76+
* extract JSON
77+
*/
78+
.then(value => value.json())
79+
})
80+
/**
81+
* now open subscription's event-stream and add a listener to it
82+
*/
83+
.then(subscription => {
84+
/**
85+
* Create new EventSource. Due to CORS we need set withCredentials to true
86+
*
87+
* @type {EventSource}
88+
* @see https://developer.mozilla.org/en-US/docs/Web/API/EventSource
89+
*/
90+
var source = new EventSource(kRestURL + "/subscriptions/" + subscription.id + "/event-stream", {
91+
withCredentials: true
92+
});
93+
/**
94+
* add event listener for each event in our subscription. We have only one buy now.
95+
*/
96+
subscription.events.forEach(event => {
97+
source.addEventListener(event.id, function (event) {
98+
/**
99+
* event.type -- same as subscription.events[0].id field
100+
* event.data -- data sent by upstream Tango server or error cause e.g. error: ...
101+
* event.lastEventId -- event's timestamp
102+
*/
103+
document.getElementById(event.type).innerHTML = event.data + "@" + event.lastEventId;
104+
});
105+
});
106+
/**
107+
* EventSource.onerror handler. This one is invoked when event stream receives event with type=error
108+
* or server is down
109+
*
110+
* @param event
111+
*/
112+
source.onerror = function (event) {
113+
document.getElementById("error").innerHTML = event.data;
114+
};
115+
});
116+
117+
</script>
118+
</body>
119+
120+
</html>

‎docs/subscriptions.md‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -171,6 +171,10 @@ data: <server error cause>
171171
4. Implementation MAY separate subscriptions by client/app/user
172172
5. Implementation MAY NOT implement errors broadcasting as client MUST assume that error event occurs only due to connection lose
173173

174+
## Client samples
175+
176+
Client code samples can be found following [this link](https://github.com/tango-controls/rest-api/tree/master/docs/samples)
177+
174178
## References
175179

176180
[1] [Server sent events overview](https://www.w3schools.com/html/html5_serversentevents.asp)

0 commit comments

Comments
 (0)