Last active
November 17, 2016 07:31
-
-
Save birowo/afd2bf47556afd2a05baaccd9ca5b9ac to your computer and use it in GitHub Desktop.
server sent event dengan NODE.JS . contoh untuk broadcast message. jalankan >node nodesse di terminal dari path dimana file-file berikut disimpan. coba akses browser: http://localhost di 2/lebih instance browser/client . SSE adalah https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <title></title> | |
| </head> | |
| <body> | |
| <textarea id="daftar" readonly></textarea><br> | |
| <input id="pesan"><br> | |
| <button onclick="kirim()">kirim</button> | |
| <script> | |
| pesan.focus(); | |
| function sse(url, callback){ | |
| if(window.EventSource){ | |
| var sse = new EventSource(url); | |
| sse.onmessage = callback; | |
| }else{ | |
| document.body.innerHTML = ''; | |
| return alert('tidak support server sent event'); | |
| } | |
| } | |
| sse('/sse', function(evt){ | |
| daftar.value = evt.data+'\n'+daftar.value; | |
| }); | |
| function ajax(method, url, kueri, callback){ | |
| try{ var xhr=new XMLHttpRequest();}catch(err){ | |
| document.body.innerHTML = ''; | |
| return alert('tidak support ajax'); | |
| } | |
| xhr.onreadystatechange = function(){ | |
| if(4 == xhr.readyState && 200 == xhr.status){ | |
| callback&&callback(xhr.responseText); | |
| } | |
| } | |
| if(-1 != 'GET,DELETE'.indexOf(method)){ | |
| if(kueri) url += "?"+kueri; | |
| kueri = null; | |
| } | |
| xhr.open(method, url); | |
| kueri&&xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); | |
| xhr.send(kueri); | |
| } | |
| function kirim(){ | |
| ajax('POST', '/xhr?pesan='+pesan.value); | |
| pesan.value = ''; | |
| pesan.focus(); | |
| } | |
| </script> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| 'use strict'; | |
| const sseres = []; | |
| const fsReadStream = require('fs').createReadStream; | |
| const rute = { | |
| notfound: function(rekues, respon){ | |
| respon.writeHead(404, {'Content-Type': 'text/html; charset=UTF-8'}); | |
| respon.end('tidak ketemu'); | |
| }, | |
| '/': function(rekues, respon){ | |
| respon.writeHead(200, {'Content-Type': 'text/html; charset=UTF-8'}); | |
| fsReadStream('nodesse.html').pipe(respon); | |
| }, | |
| '/sse': function(rekues, respon){ | |
| respon.writeHead(200, {"Content-Type":"text/event-stream", "Cache-Control":"no-cache", "Connection":"keep-alive"}); | |
| //respon.write("retry:9999\n\n"); | |
| sseres.push(respon); | |
| }, | |
| '/xhr': function(rekues, respon){ | |
| respon.end(); | |
| let len = sseres.length; | |
| while(len){ | |
| len--; | |
| if(sseres[len].write){ if(rekues.kueri.pesan) sseres[len].write('data:'+rekues.kueri.pesan+'\n\n');} | |
| else sseres.splice(len, 1); | |
| } | |
| } | |
| } | |
| const urlparse = require('url').parse; | |
| const PORT = 80; | |
| const server = require('http').createServer(function(rekues, respon){ | |
| const url = urlparse(rekues.url, true); | |
| rekues.kueri = url.query; | |
| rute[rute.hasOwnProperty(url.pathname)? url.pathname: 'notfound'](rekues, respon); | |
| }); | |
| server.timeout = 0; // no timeout | |
| server.listen(PORT); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
serpertinya baru chrome browser yang tab network inspect element nya bisa memantau EventStream data. jadi saya cobanya buka 2 instance chrome browser.